Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
「本のつながり」を可視化する
Search
SUGIMOTO Tatsuo
November 10, 2025
Design
0
10
「本のつながり」を可視化する
SUGIMOTO Tatsuo
November 10, 2025
Tweet
Share
More Decks by SUGIMOTO Tatsuo
See All by SUGIMOTO Tatsuo
データビジュアライゼーションの制作方法を学ぶ
sugi2000
0
2k
DataMapp データ駆動型地図表現ツールの開発
sugi2000
0
220
文芸テキストを地図上にビジュアライズする観賞型Webアプリ「bibliomaps」の開発
sugi2000
1
1.3k
データビジュアライゼーションのツール」
sugi2000
0
1.4k
地域の可視化をたのしもう
sugi2000
2
880
Other Decks in Design
See All in Design
生成AIの不確実性を価値に変える、「ビズリーチ」の体験設計 / KNOTS2026
visional_engineering_and_design
6
800
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
koyaman
1
1.5k
maki setoguchi
maki_setoguchi
0
710
セブンデックス プロジェクト事例 / innovation Scenes
sevendex
1
190
2026年、デザイナーはなにに賭ける?
0b1tk
0
510
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
mewmo
0
180
これからの「Webデザイン」の話をしよう~デザイナーの私が考えるブロックテーマへの対応で変わりゆくデザインの価値~
ds35mm
0
580
プラットフォームに馴染むモバイルアプリデザイン / Mobile App UI Design Lunch LT
pixyzehn
0
160
新卒2年目デザイナーが、UX検定基礎にチャレンジした話
designer_no_pon
1
1.3k
情報を翻訳する-伝わる可視化3原則とオープンデータ活用-
hjmkth
1
170
Figmaレクチャー会Part2 もっと使いこなす編@千株式会社 社内勉強会
designer_no_pon
1
280
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
2k
Featured
See All Featured
Navigating Weather and Climate Data
rabernat
0
130
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
1.8k
Abbi's Birthday
coloredviolet
2
5.2k
Are puppies a ranking factor?
jonoalderson
1
3.1k
Claude Code どこまでも/ Claude Code Everywhere
nwiizo
64
53k
How to Talk to Developers About Accessibility
jct
2
150
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
250
Reality Check: Gamification 10 Years Later
codingconduct
0
2k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.9k
Code Reviewing Like a Champion
maltzj
528
40k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
Transcript
「本のつながり」を可視化する opencoverとhonbacoの開発 2025-11-08 RuRo Seminar 杉本達應
本と本棚
縮小する 出版産業 『出版指標 年報 2025年版』
拡大する 読書活動 コンテンツとしての 本棚 選書フェア 選書コーディネート 文学館 本棚劇場 坂本図書 テレビ・雑誌・書籍
読書体験施設 文喫 Book and Bed TSUTAYA 次世代型図書館 まちライブラリー 既存流通にのらない 本 ZINE 同人誌 読書を通じた交流 一箱古本市 シェア型書店 ビブリオバトル 読書会
本棚を見せるための施設
本棚特集
シェア型書店、まちライブラリー、一箱古本市
オンラインコミュニティ
棚に生まれる個性 〈キュレーション〉としての選書、陳列 【文脈棚】自分の懐の話だけだった選挙戦のあとに - 往来堂書店
棚に生まれる個性 家の棚は収納家具だが、複数の場所から、自分の関心や必要に応じて集めてきたも のが凝縮された、ひとつの世界でもある。さまざまな場所に分散していた者を自分 が集めなおし、「自己」という新しいジャンルを作って、私的な空間に再現してい るようなものだ。大げさにいえば書棚は自分の分身であり、家の中に書棚があるこ とは、その分身と常に向き合っていることを意味する。 家族がいれば、その世界は家族とも共有される。置き場所によっては来客が目に する機会もある。他人の家や仕事場を訪問して、つい置いてある書棚に目をやって しまった経験がないだろうか。雑誌などではしばしば有名人の書斎の写真を載せた
りするが、そこに対する好奇心は、本の並びにあらわれるその人の内面や知的関心 に向けられている。(柴野京子,2012,『書物の環境論』弘文堂.)
空間と記憶 「特に分類していないので、どの本 がどこにあるのかは、身体感覚で覚 えています。それが狂うともう探せ ない。(笑)」(東浩紀) 『松岡正剛の書棚──松丸本舗の挑 戦』p.98
スクリーンの書籍表現
スクリーンの書籍表現
本は多面体 …なのに、 表紙のデータしかない!
書影をめぐる問題 ライセンス(利用許諾)が不明瞭 利用目的の制限(非商用に限定など) 解像度が低い そもそも画像がない
書影をめぐる問題 openBDプロジェクトの挑戦と縮小 https://hon.jp/news/1.0/0/47164
書誌情報・書影のAPI API(Application Programming Interface) Amazon Product Advertising API (2003–) 楽天API
(2007–) アフィリエイト(成果報酬型広告)利用はで きるが、そのネットショップでの購入促進に つながる利用に限られる API提供企業の仕様や規約変更に振り回される
背表紙の効用 何度も目にしている書棚の様子は、努 力しなくても自然と頭に入ったりもす る。例えば、これまで何度も訪れた本 屋なら、入口から奥まで、フロアの形 や棚の配置、あるいはどこにどんな分 野の本が置かれているか、知らず識ら ずのうちに覚えているものだ。(p.177) 山本貴光『記憶のデザイン』(2020)
背表紙の効用 本はそれぞれが、ある外見や重さや手触りや 匂いを備えている。そしてもっぱら、離れた 場所から眺める場合、そのデザインが目に入 る。背表紙は、多くの場合、著者名、書名、 副題、叢書名、版元といった要素が表記さ れ、デザインを施されている。すでに内容を 知っている本なら、この背表紙はその内容に 対するインデックス(索引)のようなものと して機能する。(p.182)
山本貴光『記憶のデザイン』(2020)
杉浦康平デザインアーカイブ(武蔵野美術大学 美術館・図書館)
An Ocean of Books Gael Hugo, in collaboration with Satellite
Studio
蔵書家の悩み スペース 空間の限界 ・十分な容量の本棚を持てない ・蔵書数に限界がある アクセシビリティ ・棚の奥や箱、倉庫に入れると アクセスしづらい ファインダビリティ
検索しづらさ ・目的の本に辿り着けない ・重複本がある 永続性 ・死んだら散逸する
教育実践 https://tmu-2024-net-1-web.pages.dev/
教育実践 https://net-1-2025.sugi2000.workers.dev/
これまでの開発
プロジェクトの目標 書籍間ネットワークの提示と可視化デザイン 書籍カバー画像を自由に利用できるインフラの 提供とオープンソースコミュニティの構築 書籍コレクションのデジタルアーカイブ構築 個人の書籍コレクションの作成・編集・共有が できるサービスの提供
著者 著者 著者 評者 読者 著書 引用 参照 書評 読書
読者Aの本棚 読者Bの本棚 本のネットワーク パラテクスト(本文以外のテキスト) コンテクスト(文脈)
opencover honbaco library 書籍カバー画像を生成・配信する ウェブAPI みんなでつくる opencover 図書館の書架を閲覧 できるサービス 構成
ユーザが書籍コレクションを作成・ 共有できるウェブサービス スタイルシートの共同編集 プラットフォーム
opencoverとは 書籍カバー画像の配信サービス 自由に利用できる 書誌情報からカバー画像を簡易再現 出版社の許諾が得られたら実画像提供も Web APIを通じて外部サービスからも利用可 背表紙を並べることで本棚を作れる
背表紙画像の生成プログラム (ジェネレーター)
ISBN→書誌情報にスタイルシートを適用する
本棚インターフェイスの事例 新書マップ NPO法人連想出版 Digital Bookshelf(電子書架) 東京都立図書館
本棚インターフェイスの事例 新書マップ4D NPO法人連想出版 バーチャル図書館 大日本印刷・図書館流通センター
出版社サイトの事例 筑摩書房 みすず書房
開発プロセス 「書棚のたのしみ」2010年1月 こうした試みは、ネットでもできるかもしれません。も ちろん、それは、単に現実空間の書棚を仮想空間に再 現するという意味ではありません。バーチャル空間なら ではの書棚の見せ方ができるのではないかと思いまし た。 ネットで編集された書棚を見せるときに、本の「背表 紙」が圧倒的な力を持つと思います。背表紙のビジュア ルは、コンパクトな面積にタイトルや著者名、出版社
やシリーズ、本の厚み(つまり、ボリューム)を、一瞬 にして伝えてくれます。
開発プロセス 2012年6月
プロトタイプ(HTML)
プロトタイプ(SVG)
プロトタイプ(SVG)
カスタムスタイル表示
3D表示
API公開 2025年3月
対象書籍の範囲 現在 約72,000冊 新書・文庫シリーズの一部 今後 収録範囲の拡張 スタイル未定義の書籍も画像出力
ZINE『オープンカバーの旅する本箱』(すぎもと組) Jimbocho Zine Fair in ひじりばし博覧会2025
3D Book Collection(開発:坂村空介) https://3d-book-collections.vercel.app/
みんなでつくる opencover (開発中) スタイルの共同編集
みんなでつくる opencover (開発中) スタイルの 共同編集
Figmaプラグイン
ユーザによる協働 Wikipedia
ユーザによる協働 OpenStreetMap
honbaco (開発中) 本棚共有サービス 見せたい棚だけ公開 する
図書館の書架再現 東京都立大学図書館日野館 新書・文庫の書架 約7,000冊 honbaco library (開発中)
図書館の書架再現 honbaco library (開発中)
書評の棚 (開発中)
これまでにもらった 感想や意見 ・自宅の書棚を再現したい ・もっている電子書籍の書棚を作りたい ・選んだ本をその場で読みたい ・帯・函も再現してほしい ・棚の奥や横向きにも積みたい ・SNSでシェアしたい ・3D・VR・ARで見たい ・国際特許とるべき
今後の予定
スケジュール 2025年度 ・「honbaco library」一般公開 (東京都立大学図書館 日野館)バージョン ・「honbaco」限定公開 ・「みんなでつくるopencover」公開 2026年度以降
・「honbaco」一般公開
THANK YOU