[pdf.js] PDFベースのスライドをGitHubに公開出来るツールを書いた話

作った経緯は以下に書いてある。

mozilla/pdf.jsを使えばPDFをブラウザ上で表示出来るので、これを使ったプレゼンテーションツールとかあると面白そうな気がする。

Learningとか見る感じページめくり系のスライド表示を作るのは意外と簡単な気がする。

こういうのが欲しい理由としては以下のような感じ
SlideShareやSpeaker Deckにロックインされたくない
    そもそもSpeaker Deckは素のPDFを見たほうがましという状況がよくあるのが問題…
GitHub Pagesにスライドを置くという同じスタイルを取れる
    直接PDFだとはやっぱり避けられる所がある + ブラウザによって表示形態がスライドに適してない
PDFを吐けるアプリは多いので、意外と汎用的に対応できる気がする
    パワーポイント、KeyNote、DeckSet、Reveal.jsなど

-- PDFベースのプレゼンテーションツール · Issue #20 · azu/azu

mozilla/pdf.jsが主な構成要素

azu/pdf-slide-html はiframeでslide-pdf.jsを使ったビューアを埋め込むジェネレータ。

http://azu.github.io/slide/DOMQuery/ 埋め込み例

これMarkdownからレンダリングした内容を下にHTMLで入れるようにしてる。 SlideShareとかにある内容のテキスト出力をインスパイアしてつけた。

Decksetとか組み合わせると、 HTML自体もいい感じに読めるし検索性も高まるので便利な感じなった気がする。

デメリット

複雑な図形が多用されるとpdf.jsはまだレンダリングが苦手な感じがある
モバイルでpdf.js動くのか分からない(フェールバックとしてpdfを直接開かせる)

であげてたデメリットも、iOSとか普通に表示できたし思ったより現時点でよい感じがする。ここ3年ぐらいスライドはHTMLで書いてて、色々なジェネレータやテーマを作ったりしたけど、スライドで求められるのレイアウトって大体固定である方が都合がいい感じになる気がする。

HTMLならではの実行が入るスライドは別だけど、大抵は固定レイアウトの方がモバイルとかで可変ならない方が見やすい。

後、これのツールについてpdf.jsについて色々書いたので、pdf.jsの紹介とかをやりたい。

長くなりそうなので、分割するかも。

efcl / efcl.github.io

[pdf.js] PDFベースのスライドをGitHubに公開出来るツールを書いた話 #35