2024-09-07 Code4Lib JAPANカンファレンス2024 ライトニングトーク 麗澤大学 柏キャンパス 発表者：杉本達應（東京都立大学）

1. N E T W O R K D E S I G N S T U D I O
書籍カバー画像生成API
opencoverの開発
杉本達應
東京都立大学
Code4Lib JAPAN Conference 2024
2024-09-07

2. N E T W O R K D E S I G N S T U D I O
自己紹介
杉本達應（すぎもと・たつお）
東京都立大学 准教授
システムデザイン学部インダストリアルアート学科
ネットワークデザインスタジオ
@sugi2000

3. N E T W O R K D E S I G N S T U D I O
山本貴光『記憶のデザイン』(2020)
何度も目にしている書棚の様子は、努力しな
くても自然と頭に入ったりもする。例えば、
これまで何度も訪れた本屋なら、入口から奥
まで、フロアの形や棚の配置、あるいはどこ
にどんな分野の本が置かれているか、知らず
識らずのうちに覚えているものだ。(p.177)

4. N E T W O R K D E S I G N S T U D I O
山本貴光『記憶のデザイン』(2020)
本はそれぞれが、ある外見や重さや手触りや
匂いを備えている。そしてもっぱら、離れた
場所から眺める場合、そのデザインが目に入
る。背表紙は、多くの場合、著者名、書名、
副題、叢書名、版元といった要素が表記さ
れ、デザインを施されている。すでに内容を
知っている本なら、この背表紙はその内容に
対するインデックス（索引）のようなものと
して機能する。（p.182）

5. N E T W O R K D E S I G N S T U D I O
本は多面体 …なのに、一面のデータしかない

6. N E T W O R K D E S I G N S T U D I O
背表紙画像のジェネレーター

7. N E T W O R K D E S I G N S T U D I O
プロトタイプ（簡易的なHTML）

8. N E T W O R K D E S I G N S T U D I O
プロトタイプ（実物の比率に近づけたSVG）

9. N E T W O R K D E S I G N S T U D I O
プロトタイプ（実物のスタイルに寄せたもの）

10. N E T W O R K D E S I G N S T U D I O
ISBN→書誌情報にスタイルシートを適用する

11. N E T W O R K D E S I G N S T U D I O
本棚インターフェイスの事例
Digital Bookshelf（電子書架）
東京都立図書館
新書マップ
連想出版

12. N E T W O R K D E S I G N S T U D I O
出版社サイトの事例
みすず書房
筑摩書房

13. N E T W O R K D E S I G N S T U D I O
技術
Web標準技術
・HTML
・SVG
・CSS
フロントエンド
・Svelte
・D3.js
DB
・sqlite

14. N E T W O R K D E S I G N S T U D I O
DEMO

15. N E T W O R K D E S I G N S T U D I O
THANK YOU