0-8

TensorFlow UserGroup で話す時用のMarpのスライドテーマ を作った

これまでは Google Slides を使うことが多かったのですが、毎回そんなに複雑なことをするわけでもないので、Markdown でお手軽にスライドを作成できるように、 Marpのテーマを作りました。

github.com

↓みたいな感じの Markdown を書くと

# Your Name

- a
- b
- c

![your logo](assets/logo.png)

↓みたいなスライドに変換されます。

f:id:ohtaman:20191022214522p:plain
生成されたスライド

これでスライド作成がはかどります。

Marp とは

Marpはyhattさんが開発している、 Markdown記法からスライドを生成するアプリ・ライブラリのことです。 もともとはPDFに出力して使うことを想定されていたようですが、現在はHTML出力も可能になっています。CSSを記述することで独自のテーマを適用することもできます。

Markdown記法からスライドを生成する方法は、Marp以外にも色々あって、たとえばreveal.jsが有名だと思います。あと、Qiitaに書くような内容に限るのであれば、Qiitaのスライドモードを使うのが手っ取り早いと思います。 そんな中で、Marpは日本初ながら

  • 余計なことをしないので、独自テーマが使いやすい
  • Visual Studio Code拡張機能が使いやすい
  • Qiita のようにサービスの制約を受けない / 完全にローカルでプレビューを見ながら執筆できる
  • 開発も活発に進んでいる(ように見える)

という点で、とても良い立ち位置にいると思います。

スライドを Markdown で記述するメリット

エンジニアであれば誰でも Markdown は記述できる点、専用の(高価な)ソフトが不要な点、テキストなのでバージョン管理が楽である点などいろいろありますが、個人的には、できることが限られているので、(結果的に)調整に時間が取られないというのが一番のメリットだと思います。

スライドをMarkdown で記述するデメリット

一方で、デメリットもあります。例えば、共同編集には弱い点。共同編集は、Google Docs や Office 365 であれば標準で備えている機能で、複数人で1つのスライドを作り上げていくような場合だと重宝するというか、なくてはならない機能だと思います。Markdownで記述する場合は、Markdownを共同編集できるような環境を別途作らなければいけないというデメリットがあります。 共同編集という意味だと、会社ではエンジニアと営業が協力して1つのスライドを完成させるようなケースも多いと思いますが、正直営業さんに Markdown を強要する勇気は僕にはありません。

また、Markdown でできる範囲は限られているので、その範囲からはずれたことをやろうとすると、とても時間がかかってしまうというのもデメリットかもしれません。(ただ、これは必要以上に作り込まなくなるというメリットと裏表でもありますが...)

ちなみに、Markdown だけの機能だと、ダイアグラムのようなものを記述することはできないのですが、Marpでは、一度HTMLに変換してから必要に応じてPDFに変換しているため、mermaid.js のような、JavaScriptのライブラリを使ってダイアグラムを記述することができます。

執筆環境について一言

Markdown から HTML/PDF への変換方法には、marp-cli というコマンドを利用する方法、Marpをライブラリとしてnodeから呼び出す方法、対応しているエディタの拡張機能を利用する方法などがあります。

普段 Visual Studio Codevscode) を利用しているのですが、Marp拡張 marp-vscode を入れると、プレビューを確認しながら書きすすめることができるのでとても便利です。

  1. プレビューが自動更新される
    Markdownそのものではなく、適用しているテーマのcssを更新してもプレビューが更新されるので、独自テーマの作成がとてもはかどりました。
  2. テーマとしてリモートのcssも指定できる
    これは marp-cli だとできないように見えますが、今回のようにテーマを公開したい場合にはとても重宝される機能だと思います。

まとめ

Marp と marp-vscode を使って快適なスライドライフをお過ごしください。