概要
Markdownでプレゼンテーションの資料を作ることができる、Marpという技術があります。
気軽に綺麗な資料を作ることができるので、気に入っている技術の一つです。
このMarpで作ったスライドに半自動で音声を吹き込み、動画資料に変換することで、応用の幅を広げることができそう。
ということで、VOICEVOXを使って作ってみました。
エディタにはVisual Studio Codeを使い、Marp for VS Codeを使うことで、快適な執筆環境を目指します。
動作環境
VS CodeとDocker Desktopなどのdevcontainer実行環境が必要です。
リポジトリ
本記事で紹介するワークスペースは、以下のGitHubリポジトリに公開しています。
設計
詳細な設計は前述のリポジトリに載せてありますので、簡単に記載します。
アーキテクチャ
アーキテクチャはこんな感じで組みました。
入力
入力は、通常のMarpスライドですが、スピーカーノートをHTMLコメントの形式で埋め込みます。
HTML slide deckとしてのエクスポート時に使われる記法のようなので、一般的と思います。
この際、VOICEVOXが適切に発声できるよう、漢字や英単語はひらがなに変換しておくとよいです。
出力
出力は、標準ではワークスペースにdistフォルダを生成し、その中に以下の3種類を出力します。
- ページ毎のスピーカーノートの合成音声（.wav）
- ページ毎の画像ファイル（.png）
- 完成した動画ファイル（.mp4）
つかいかた
前述のリポジトリを、VS Codeで開き、devcontainerを起動します。
slide.mdを開いてアクティブにした状態で Ctrl + Shift + B のショートカットを実行することで、音声化から動画結合までを一連で実行します。
おわりに
大仰なものではないですが、Markdownスライドを書いてビルドするだけで動画ができるのは、ちょっと面白かったです。
何らかの動画資料を作る必要があるときに、楽しく発表資料を作れるよう、役立てていただけると嬉しいです。
クレジット
本記事で紹介したリポジトリでは、デフォルトの合成音声に VOICEVOX:四国めたん を利用しています。