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
初心者から見たVivliostyleの可能性とコミュニティへの提言 #vivliostyle ...
Search
kondoyuko
April 04, 2020
Technology
0
850
初心者から見たVivliostyleの可能性とコミュニティへの提言 #vivliostyle / The potential of Vivliostyle from a beginner's perspective and suggestions for the community
CSS組版 Vivliostyle ユーザーと開発者の集い 2020春
https://vivliostyle.connpass.com/event/170939/
での発表資料です。
kondoyuko
April 04, 2020
Tweet
Share
More Decks by kondoyuko
See All by kondoyuko
カンファレンス運営者の視点で伝えたい、アフターコロナのITコミュニティの未来 / The Future of IT Communities #OSO2023
kondoyuko
2
450
みんなに愛されて20年! 「Developers Summit」オーガナイザーとしてやったこと、考えたこと #oso2022 / What I did and thought about as an organizer of Developers Summit
kondoyuko
1
670
大学生に『書くこと』の授業をしたときに 引き合いに出した本 / books on writing for students
kondoyuko
9
10k
The Struggle of online conferences in the time of COVID-19
kondoyuko
0
1.4k
編集者が考える! 大学生が書く技術を高めるべき理由とは? / Why should we improve our writing skills?
kondoyuko
2
1.1k
FreeStyleリブレで 14日間血糖値モニタリングしてみた / glucose monitoring using FreeStyle Libre
kondoyuko
0
290
コロナ禍で開発者向けイベント/講座はいかにオンライン化したか? #opendevcon / Planning online events in the time of COVID-19
kondoyuko
0
1.1k
15年続く老舗技術メディアのリブランディングで考えたこと #DevRelAsia / Rebranding Technology Media for its 15-year anniversary
kondoyuko
2
3.3k
iPadで広がるアウトプットの世界 #ssmjp / The world of output by iPad
kondoyuko
3
4.9k
Other Decks in Technology
See All in Technology
マルチプロダクトな開発組織で 「開発生産性」に向き合うために試みたこと / Improving Multi-Product Dev Productivity
sugamasao
1
300
Amazon CloudWatch Network Monitor のススメ
yuki_ink
1
200
適材適所の技術選定 〜GraphQL・REST API・tRPC〜 / Optimal Technology Selection
kakehashi
1
400
テストコード品質を高めるためにMutation Testingライブラリ・Strykerを実戦導入してみた話
ysknsid25
7
2.6k
ハイパーパラメータチューニングって何をしているの
toridori_dev
0
140
Amazon Personalizeのレコメンドシステム構築、実際何するの?〜大体10分で具体的なイメージをつかむ〜
kniino
1
100
20241120_JAWS_東京_ランチタイムLT#17_AWS認定全冠の先へ
tsumita
2
250
SREが投資するAIOps ~ペアーズにおけるLLM for Developerへの取り組み~
takumiogawa
1
210
Security-JAWS【第35回】勉強会クラウドにおけるマルウェアやコンテンツ改ざんへの対策
4su_para
0
180
B2B SaaSから見た最近のC#/.NETの進化
sansantech
PRO
0
770
AWS Lambda のトラブルシュートをしていて思うこと
kazzpapa3
2
170
これまでの計測・開発・デプロイ方法全部見せます! / Findy ISUCON 2024-11-14
tohutohu
3
370
Featured
See All Featured
For a Future-Friendly Web
brad_frost
175
9.4k
Automating Front-end Workflow
addyosmani
1366
200k
Building an army of robots
kneath
302
43k
KATA
mclloyd
29
14k
Producing Creativity
orderedlist
PRO
341
39k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
840
Designing the Hi-DPI Web
ddemaree
280
34k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
364
24k
Practical Orchestrator
shlominoach
186
10k
Speed Design
sergeychernyshev
25
620
Become a Pro
speakerdeck
PRO
25
5k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
31
2.7k
Transcript
初心者から見たVivliostyleの可能性と コミュニティへの提言 2020.04.04 @kondoyuko CSS組版 Vivliostyle ユーザーと開発者の集い 2020春
#vivliostyle 自己紹介 近藤佑子 aka @kondoyuko / ゆうこりん • 所属:株式会社翔泳社 –
CodeZine編集部 副編集長 – Developers Summit オーガナイザー – 出版社で働いてますが本づくりは初心者です • 趣味:テクノロジーや自分をハブにしたイベントを 作って遊ぶこと – 近藤佑子誕生祭、スナックゆうこ、Tech Pub、 雑学サミット etc... kondoyuko516 kondoyuko アイコン アー写
#vivliostyle 主催する同人サークル「こりん堂」 2019年には、技術書典6、第二十八回文学フリマ東京、技術書典7、 コミックマーケット97(C97)に出展
#vivliostyle 主催する同人サークル「こりん堂」 C97で頒布した同人誌(コピー本)の組版にVivliostyleを採用
#vivliostyle Vivliostyleで本を作ろう vol.3 に寄稿 https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-group-vol3/kondoyuko/index.html
#vivliostyle 今日お話したいこと Vivliostyleを初めて触った立場から考える プラットフォームの可能性と課題
#vivliostyle 本日のアジェンダ • Vivliostyleとは何かを初心者目線で • Vivliostyleを使おうとした背景 • ぶつかった壁 • Vivliostyleコミュニティへの提言
#vivliostyle Vivliostyleとは何かを初心者目線で
#vivliostyle Vivliostyleとは • CSS組版で本を作るためのツール – CSS組版:HTML/CSSを用いた紙面デザイン • Vivliostyleとは – オープンソースのCSS組版システム
– CSS組版のデファクトスタンダード?
#vivliostyle Vivliostyleプロジェクト • 組版されたPDFを生成 – Vivliostyle CLI(HTMLから) – Vivliostyle Pub(Markdownから:開発中)
• 組版されたものをWebで閲覧 – Vivliostyle Viewer(HTMLから:ブラウザの印刷機能でPDF取得) https://vivliostyle.org/ja/
#vivliostyle Vivliostyleを使おうとした背景
#vivliostyle これまでの技術同人誌制作 • Re:VIEW+CircleCIでPDFの自動ビルド – TechBoosterのテンプレートを利用 • 開発者フレンドリーに本を制作するのが 楽しかった
#vivliostyle Re:VIEWでの組版で感じていた課題 • いかにも「Re:VIEWで作った」 ような紙面デザインになる • デザインをいじりたい場合の 直し方が分からない – 特にコラムのデザイン
#vivliostyle C97で頒布した本 • 読んで良かった本を紹介 するブックレビュー本 • 紙面イメージは「洋書」 • コピー本として制作 –
トンボなどの入稿時の 細かい対応は未経験
#vivliostyle なぜVivliostyleを利用しようとしたか • 読み物系なので技術書ライクな紙面にしたくなかった – 制作段階では縦書も視野に入れていた • 何か技術的に新しいチャレンジがしたかった • 短期間で制作ができそうだった
• CSSによる見た目の調整が可能だった • サンプルのテンプレートのデザインが好み – 今回は「英語小説」のサンプルを利用
#vivliostyle 自分の前提知識 • 簡単なWeb制作ができるHTML/CSSの知識がある • 技術同人サークル主と親交があり、CSS組版や Vivliostyleについて、LTなどで聞いたことがある
#vivliostyle ぶつかった壁
#vivliostyle kondoyukoとVivliostyle
#vivliostyle 制作のタイムライン • 12/22 18時 Vivliostyleの調査開始 (6日間進捗出ず) • 12/28 10時 CSS組版よくわからないと嘆く (村上さんのサポート)
• 12/29 17時 書籍の完成
#vivliostyle 制作のタイムライン • 12/22 18時 Vivliostyleの調査開始 (6日間進捗出ず) • 12/28 10時 CSS組版よくわからないと嘆く (村上さんのサポート)
• 12/29 17時 書籍の完成 ↓ 把握してしまえば非常に素早く制作できるツール
#vivliostyle なぜつまづいたのか? • パパっと本を作るための情報が少ない • サンプルのライセンスや利用方法が難しい
#vivliostyle パパっと本を作るための情報が少ない • VivliostyleでGoogle検索 • 「Vivliostyleで本を作ってみた」 的なユーザー目線の情報が少ない • 開発者のディープな情報が目立つ –
検索上位にくる必要はなし?
#vivliostyle Vivliostyle Viewerへの印象 • 検索では「Vivliostyle Viewer」の説明が目立つが、 ユーザーはビューワーの情報が知りたいのではなく 書籍制作の方法が知りたい • 「よくわからんけど重要そうなんだな」と思い、ロー
カルで環境を作るも、「で、本を作るにはこれからど うしたらいいんだっけ?」と思い、しばらく悩む
#vivliostyle 乗り越え方 • ローカルの環境でVivliostyle Viewerで表示させて、い ろいろ触りながら動かすことで理解していった • 別の問題として、当時ドキュメントが、自分がDLした 最新安定版ではなく最新開発版に合わせたものになっ ていて、混乱があったのもある
#vivliostyle サンプルのライセンスや利用方法が難しい • サンプルのページを見てみた • 使いたいサンプルがあったが ライセンスの記載がない • 利用してよいにしても、 利用方法が分からない
https://vivliostyle.org/ja/samples/
#vivliostyle ライセンスについて • ライセンスがよくわからない ので村上真雄さんに質問 • 「Vivliostyleプログラムと同 じAGPLの扱い」とのご回答 をいただく https://twitter.com/MurakamiShinyu/status/
1210447092440686592
#vivliostyle AGPL……!? • AGPLが分からないのでググってみる • Qiita記事*に「AGPL のライセンスの OSS を使う場合 には、すべてをさらけだす覚悟が必要」「現時点で最
強の Copyleft」という記載があり「AGPL 怖い!」 • 「プログラムを改変しても自分で使うだけなら公開の 必要はない」と追加で教えていただく 「オープンソースライセンス、どれなら使っても良いの?? https://qiita.com/fate_shelled/items/a928709d7610cee
#vivliostyle 現在、追加でいただいたライセンスの最新情報 • 以前、VivliostyleはApache 2.0ライセンスで作られ、 サンプルも同ライセンス下にある – 使用、商用利用、改変、複製、公開などが可能 • ユーザーが自由に使えるようにライセンスの見直しが
検討されている
#vivliostyle 利用方法が分からない • サンプルのページから、どのようにサンプルを取得す ればいいか分からない • GitHubで、Vivliostyleのドキュメントをホスティング しているリポジトリにアクセスし、そこからZipで取っ てくるしかなさそう? https://vivliostyle.org/ja/samples/
#vivliostyle とはいえスピーディーに制作できた • サンプルを改変したり、 奥付など必要なパーツを 他のサンプルから取って きたりしながらスムーズ に制作 • 詳しくは寄稿記事を参照
https://vivliostyle.github.io/vivliostyle_doc/ja/vivliostyle-user-gro up-vol3/kondoyuko/index.html
#vivliostyle Vivliostyleコミュニティへの提言
#vivliostyle Vivliostyleコミュニティがさらに発展するために • 現在、Vivliostyleの仕様や開発者向け情報が多い印象 • 「本を作りたい」というユーザー目線の情報がもっと 増えてほしい+ユーザーから生まれてほしい – プロダクトとしてはWeb出版を意識するにしても、 今は紙/PDFの本を作る目線の情報発信でよさそう
#vivliostyle 参考になりそうな知見 • DevRel(デブレル):Developer Relationsの略 • DevRel:開発者向け共創マーケティング – OSS発展にも役立つところがありそう •
DevRelの「3C」を用いた提案 – Code、Contents、Community https://www.amazon.co.jp/dp/B07X8SD4PP/
#vivliostyle Code:ソースコードや技術的リソース • ワンストップなサンプル – 目次、奥付、トンボなどが標準装備されている • メインターゲットとなるユーザーに向けたサンプル – TechBooster/ReVIEW-Templateのような
技術書ライクなサンプル
#vivliostyle Contents:ドキュメントやブログ • Getting Started的な内容 – Vivliostyleを用いたベーシックな書籍制作のチュー トリアルがあると良さそう • 制作事例の発信
– 『Vivliostyleで本を作ろう』のメイキングなど • 開発者エクスペリエンスが高いチュートリアル – CI/CDツールとの連携など
#vivliostyle Community:コミュニティ • ハンズオン動画の公開 • 関連コミュニティへの参加・登壇 – 技術同人誌、組版、Web標準etc… • ユーザーを巻き込む(今回の私のケースなど)
#vivliostyle まとめ
#vivliostyle Vivliostyleの可能性 • 短期間で書籍制作ができる • カスタマイズ性が高い • Web制作やデザイナー系、非エンジニアのユーザーも 狙えそう
#vivliostyle コミュニティへの提言 • プロダクトセントリックからユーザーセントリックへ • 本を作りたい人目線の情報発信が増えることで、 Vivliostyleで本を作る人が増えることを願っています