図書館書架のオンライン閲覧サービス「honbaco library」の開発 Code4Lib JAPAN カンファレンス 2026

!"#$%&'(!"#$%&'!"#$%& 図書館書架のオンライン閲
覧サービス「 h o n b ac o l i b ra r y 」の開発 Code4Lib JAPAN カンファレンス 2026 2026-09-06 at 皇學館大学東京都立大学杉本達應

!"#$%&'(!"#$%&'!"#$%& 杉本達應（すぎもと・た
つお）情報デザイン／データビジュアライゼーション／メディアアートなど東京都立大学大学院システムデザイン学域インダストリアルアート学域准教授ネットワークデザインスタジオ Bluesky: sugimototatsuo.com

!"#$%&'(!"#$%&'!"#$%& 杉本達應（すぎもと・た
つお）訳書『たのしいクリエイティブテック・ジン醸造所「すぎもと組」主宰 2026年9月末から1年間コーディング』文学フリマ東京、技術書典に出展ドイツ・デュッセルドルフに滞在（BNN） 2026年11月

!"#$%&'(!"#$%&'!"#$%& 20 2 4 年・ 2 0 25 年
の LTの続編です

!"#$%&'(!"#$%&'!"#$%& openc o v er 書籍カバー画像
を配信する AP I

!"#$%&'(!"#$%&'!"#$%& 本は多面体。なのに、一面のデータしかない。 openc o v er とはオンラインでも背表紙を眺められる本棚を作りたい
•書籍カバー画像のオープンデータ •書誌情報からカバー画像を簡易再現許諾を得たら実画像も •Web APIを通じて外部サービスからも利用可 •背表紙を並べることで本棚を作れる

!"#$%&'(!"#$%&'!"#$%& https://opencover.jp 書籍カバー画像配信API 約110,0 0 0 冊（新書
・文庫中心）の背表紙生成に対応外部からも利用できる 2025年3月プレビュー版公開現在出力面と収録範囲を拡張中

!"#$%&'(!"#$%&'!"#$%& openc o v er

!"#$%&'(!"#$%&'!"#$%& みんなでつくる o p e nc o v e r
ウィキペディアのようにみんなでスタイルを共同編集できる

!"#$%&'(!"#$%&'!"#$%& h on bac o l i b ra r
y の概要図書館の「見た目」をオンラインにも

!"#$%&'(!"#$%&'!"#$%& 図書館の本をさがす／ながめる図書館で借りた本
の居場所をおぼえていますか？・目当ての本を検索してたどりつく・棚を見ていて、読みたい本を発見する・いちど借りた書架の場所はおぼえている・本の場所を空間で記憶している

!"#$%&'(!"#$%&'!"#$%& 図書館の本をさがす／ながめる図書館の検索画面
では書架を思い出すことができないオンラインでも図書館の書架の見た目を再現したい

!"#$%&'(!"#$%&'!"#$%& 先行事例新書マップ 4 D （N P
O 法人連想出版）

!"#$%&'(!"#$%&'!"#$%& 先行事例学芸大デジタル書架ギ
ャラリー（東京学芸大学附属図書館）

!"#$%&'(!"#$%&'!"#$%& 先行事例 Di gi t a l B o o
k S h e l f （電子書架）（東京都立図書館）

!"#$%&'(!"#$%&'!"#$%& 類似事例３Ｄ書架ブラウジン
グサービス（文京区立図書館）「図書館本棚家で閲覧文京区今秋、ネット上に蔵書背表紙」読売新聞（2026/02/08）

!"#$%&'(!"#$%&'!"#$%& hon baco l i b ra r y https://lib.honbaco.com
無料・非営利の図書館書架の閲覧サービス「opencover」の活用例・デモ 2025年12月公開

!"#$%&'(!"#$%&'!"#$%& 掲載図書館サービス開設時は1館のみ東京都立大学図書館日野館小型本書架 7,000冊新書・文庫

!"#$%&'(!"#$%&'!"#$%& 掲載図書館・東京都立大学図書館日野館・東京都立大学図書館荒川館・東京都立大学図書館本館 7,000冊
3,700冊 9,000冊（まもなく公開）

!"#$%&'(!"#$%&'!"#$%& 掲載図書館（仮想図書館）・青空文庫 19,000点・岩波書店・講談社・筑摩書房・新潮社・平凡社
4,300点 10,000点 8,000点 6,000点 3,000点（まもなく公開）

!"#$%&'(!"#$%&'!"#$%& !検索、並び替え（ソート）画面設計 1ページに1書架 !ミニマップ !拡大・縮小・フルスクリーン 4段 x 50冊
= 200冊 !書架移動ボタン

!"#$%&'(!"#$%&'!"#$%& 詳細画面表紙画像→ !背ラベル図書館詳細ページへリンク書誌情報→ !前後の本移動ボタン

!"#$%&'(!"#$%&'!"#$%& デザイン実空間の書架を再現棚のサイズ・厚み・色壁の色

!"#$%&'(!"#$%&'!"#$%& h on bac o l i b ra r
y の開発試行錯誤しながらつくる

!"#$%&'(!"#$%&'!"#$%& 図書館からの要望貸出データは使えない現在のWeb本棚は積極的にすすめていない・実際の書架と並びが違うことがある・書籍詳細の表紙をクリックすると紀伊国屋書店BookWebに飛ぶ Web本棚（東京都立大学図書館）

!"#$%&'(!"#$%&'!"#$%& データ当初は図書館提供のExcelファイル

!"#$%&'(!"#$%&'!"#$%& データ ISBNがない！→学情ID（NCID）を提供してもらう NCIDを主の検索キーにしてCiNii Books APIで検索 ISBN NCID

!"#$%&'(!"#$%&'!"#$%& データ書架の見た目で再現したことでデータの誤りを発見 ↓ 文庫なのに単行本版のNCIDが割り当てられている

!"#$%&'(!"#$%&'!"#$%& データ更新図書館の許諾を得て OPACのAPIから定期的にデータ取得・更新当初は毎日現在は週1回更新したらDiscordに通知が来る

!"#$%&'(!"#$%&'!"#$%& シリーズが多すぎる岩波新書ブルーバックス中公新書講談社現代新書ワイド版岩波文庫サイエンス・アイ新書ちくま新書光文社
新書集英社新書岩波科学ライブラリー教育社新書文春新書 PHP新書 NHK出版新書新潮新書平凡社新書中公新書ラクレ幻冬舎新書丸善ライブラリー朝日新書 SB新書角川新書日経文庫講談社+α新書星海社新書日経プレミアシリーズちくまプリマー新書 PHPサイエンス・ワールド新書インターナショナル新書アスキー新書交通新聞社新書祥伝社新書扶桑社新書 PHPビジネス新書青春新書intelligence 新書y 岩波ジュニア新書ソフトバンク新書角川oneテーマ21 宝島社新書中災防新書岩波アクティブ新書ワニブックス「Plus」新書マイナビ新書ベスト新書サイエンス・パレットじっぴコンパクト新書静岡学術出版教養新書河出新書文庫クセジュ岩波文庫マイコミ新書ポプラ新書ハヤカワ新書竹書房新書生活人新書潮新書有斐閣新書廣済堂新書小学館101新書メディアファクトリー新書ハヤカワ新書juice イースト新書Q KAWADE夢新書 CQ文庫シリーズ香り新書青春新書PLAY BOOKS 電気新聞ブックス近代文芸社新書角川SSC新書白水Uブックス明治図書新書日経新書日本棋院新書日文新書技評SE新書幻冬舎ルネッサンス新書小学館新書双葉新書創成社新書働く・仕事を考えるシリーズ信山社新書中公クラシックス中公PC新書三省堂新書三愛新書プレイブックスソリューションIT新書サンガ新書エネルギーフォーラム新書イースト新書 SBビジュアル新書 MdN新書 COLOR新書y CMC books Asahi news shop 1秒でわかる!

!"#$%&'(!"#$%&'!"#$%& シリーズが多すぎる新潮文庫朝日文庫岩波文庫ちくま学芸文庫角川文庫ちくま文庫講談社文庫文春文庫
朝日文芸文庫集英社文庫ハヤカワ文庫中公文庫講談社学術文庫江戸川乱歩推理文庫幻冬舎文庫講談社+アルファ文庫 (シリーズ名なし) 河出文庫 PHP文庫現代教養文庫人物文庫小学館文庫知的生きかた文庫光文社文庫天皇の世紀吉川英治歴史時代文庫王様文庫岩波現代文庫宝島社文庫創元推理文庫光人社NF文庫日経ビジネス人文庫福武文庫草思社文庫評論社文庫角川ホラー文庫 KAWADE夢文庫祥伝社文庫中経の文庫ハヤカワepi文庫宝島SUGOI文庫双葉文庫創元SF文庫ワニ文庫講談社+α文庫知恵の森文庫徳間文庫実業之日本社文庫大学とは何か光文社古典新訳文庫京都工芸繊維大学美術工芸資料館デザインコレクションハヤカワ・ミステリ文庫ノン・ポシェットだいわ文庫 How to see 講談社文芸文庫角川ソフィア文庫祥伝社黄金文庫潮文庫旺文社文庫新風舎文庫今すぐ使えるかんたん文庫二見文庫マイコミ将棋文庫SP ポケット・ブックスアテネ文庫ちくま学芸文庫ニーチェ全集 9-10 DOJIN文庫静山社文庫青木文庫青春文庫青春Best文庫講談社タイガ空想科学文庫枻文庫新装版戦記文庫新戦史シリーズ文春文庫PLUS 扶桑社文庫扶桑社ミステリー成美文庫幻冬舎アウトロー文庫小学館文庫プレジデントセレクト学研M文庫勁文社文庫21 加藤諦三文庫創元ライブラリ人格形成文庫二見waiwai文庫ヴィレッジブックスモービル文庫マガジンハウス文庫マイナビ将棋文庫SP ホワット・イフ? ビジュアルだいわ文庫ハーパーbooks ハルキ文庫スポーツ・ノンフィクション・シリーズコスモ文庫カンガルー文庫カラーブッ

!"#$%&'(!"#$%&'!"#$%& シリーズが多すぎる冊数が多いシリーズ冊数が少ないシリーズ → スタイルを新規作成して対応 → 汎用スタイルで対応

!"#$%&'(!"#$%&'!"#$%& シリーズ内の多色展開に対応する

!"#$%&'(!"#$%&'!"#$%& 請求番号順のソートを間違える NDC順になっていない…… 100, 200, 300, 400, 500, 600, 007
数値の1桁目を比較する初歩的なミス

!"#$%&'(!"#$%&'!"#$%& ユーザーインタフェースズームインタフェースポインタ周辺を拡大表示

!"#$%&'(!"#$%&'!"#$%& ユーザーインタフェースズームインタフェース拡大表示エリアを縦長に変更

!"#$%&'(!"#$%&'!"#$%& ユーザーインタフェース背表紙の立体感

!"#$%&'(!"#$%&'!"#$%& ユーザーインタフェース高解像度画像ビューア OpenSeadragon とタイル画像動的な棚を作れないため不採用

!"#$%&'(!"#$%&'!"#$%& ユーザーインタフェースパン・ズーム対応 Googleマップと同じ操作感・コントロールボタン・マウスホイール・トラックパッドのピンチイン・アウトフルスクリーン切り替え

!"#$%&'(!"#$%&'!"#$%& ユーザーインタフェーススマートフォン対応スマホでは全1段の棚を横スクロールできる ! "

!"#$%&'(!"#$%&'!"#$%& 使用技術フロントエンド SvelteKit TypeScript バックエンド Cloudflare Workers Hono
TypeScript データベース Cloudflare D1 ストレージ Cloudflare R2

!"#$%&'(!"#$%&'!"#$%& 3D書架のプロトタイプ展覧会で発表一般には未公開

!"#$%&'(!"#$%&'!"#$%& 課題と展望収録範囲の拡張掲載館ご協力いただける図書館を募集しています！新書・文庫の棚と書籍リストがあれば掲載できます掲載書籍単行本、洋書雑誌、ZINE、電子書籍へ

!"#$%&'(!"#$%&'!"#$%& まとめ honbaco libraryのこれからと関連
プロジェクト

!"#$%&'(!"#$%&'!"#$%& 課題と展望サイトの機能強化情報の整理本棚のレイアウトの改善表紙の提供書籍情報の充実基本操作ソート項目の充実
タイトル、著者名（かな）など

!"#$%&'(!"#$%&'!"#$%& 課題と展望オープンな書影がなくなってしまった 2023年7月 openBD APIバージョン1の提供終了 2026年3月国立国会図書館書影APIサービス終了

!"#$%&'(!"#$%&'!"#$%& 課題と展望カテゴリマップ実空間の本棚を超える機能性を

!"#$%&'(!"#$%&'!"#$%& hon baco ユーザーの本棚共有サービス限定運用中

!"#$%&'(!"#$%&'!"#$%& ビブリオハック・プロジェクト https://bibliohackproject.github.io/ 本の情報＋テクノロジー

!"#$%&'(!"#$%&'!"#$%& ありがとうございました杉本達應

図書館書架のオンライン閲覧サービス 「honbaco library」の開発 Code4Li...

図書館書架のオンライン閲覧サービス 「honbaco library」の開発 Code4Lib JAPAN カンファレンス 2026

More Decks by SUGIMOTO Tatsuo

Other Decks in Design

Featured

Transcript

図書館書架のオンライン閲覧サービス「honbaco library」の開発 Code4Li...

図書館書架のオンライン閲覧サービス「honbaco library」の開発 Code4Lib JAPAN カンファレンス 2026