backslideでスライド作ってみた
スライド作成に使うツールをreveal.jsからbackslideに乗り換えてみました。
Table of Contents
はじめに
仕事でしばしばスライドを作る機会があります。
その場合には以下のいずれかのツールを使ってきました。
| 使うツール | 共有/共同編集が必要 | 凝ったプレゼンをしたい | ソースコードが多い |
|---|---|---|---|
| Google Slides | O | △ | X |
| Microsoft PowerPoint | X | O | X |
| reveal.js | X | X | O |
共有や共同編集をしたい場合は否応がなしにGoogle Slidesでしょう。
細部まで作り込むには、Microsoft PowerPointの右に出る者はいません。
一方、それらに該当せずソースコードが多い場合などはreveal.jsのようなHTML Presentation Frameworkが向いています。
HTML Presentation Frameworkに求めるもの
正確にはreveal.jsではなくvscode-revealを使っていました。
VSCodeだけ完結するお手軽な拡張です。
しかし、半年ほど使ってみると物足りない点がいくつか出てきました。 HTML Presentation Frameworkに必要だと感じている機能は以下です。
| 要件 | 理由 | vscode-reveal |
|---|---|---|
| Markdownが使える | シンプルになるから | O |
| HTMLが使える | 柔軟な編集が可能だから | O |
| Hot reload | 手動で都度リロードが面倒だから | X |
| 静的サーバにデプロイ | オリジナルを見てほしいから | X (対応とあるが動かなかった) |
vscode-revealに関しては、以下の点で不安もありました。
- 保存してリロードしても正しく反映されないときがある
- Markdownで表現できず、HTMLに頼ることが多く複雑になる
reveal.jsの挙動について
backslide
上記の不満点を全て解消してくれるのがbackslideでした😄
内部はremark.jsが使われており、backslideはそのラッパな位置づけです。
せっかくなのでここから先はbackslideを使って作ったスライドで紹介させてください😉
↓ 続きはスライドで
総括
スライド作成に使えるHTML Presentation Frameworkとしてbackslideを紹介しました。
シーンに応じて、Google SlidesのようなGUIツールと使い分けができればと思います。
