動画で見る（約10分）
この記事の内容を、図解と音声で解説します。
YouTubeで視聴する
音声：VOICEVOX:玄野武宏（CV:ガロ）
同じ内容を、Wordの資料にも、PowerPointにも、動く図解にも、動画にもしたい。生成AIを仕事で使う人なら、一度はこう考えるはずです。答えは、元をMarkdownファイル1つに決め、そこから各形式へ変換する仕組みを持つことです。
この記事では、その仕組みの原理と、変換に使う道具（ライブラリ）の名前を、1枚の地図にまとめて紹介します。
原理は5つ
- 内容を持つのはMarkdownだけです。人が書き、人が承認するのは、このファイルに限ります。
- 道具は内容を持ちません。Pandoc、ライブラリ、PythonやNode.jsのスクリプトは、Markdownを読んで形を変えるだけです。道具が出発点になることは、原理としてありえません。
- 様式も、元の外に置きません。Wordの体裁や色、絵柄は、Markdownの先頭の設定（front matter）からテンプレートを指します。
- HTML、SVG、PNGは中間表現です。受け渡しのための形で、元ではありません。
- 出力は片道です。Word、PowerPoint、GIF、MP4から元には戻れません。直しは必ずMarkdownで行い、出力を作り直します。
7段の流れ
地図は、上から下へ7段で読みます。
| 段 | 中身 | 主な道具 |
|---|---|---|
| ①元 | Markdownファイル1つ | 人が書く |
| ②解析 | 構文木にして、ブロックの種類で振り分ける | Pandoc、markdown-it、remark |
| ③ブロック | 文章、図の定義、データ、台本、字コンテ | Markdownの見出し、表、コードブロック |
| ④変換 | ブロックごとに形を変える | docx（npm）、python-docx、Pandoc、Marp、python-pptx、PptxGenJS、Mermaid CLI、Graphviz、D2、matplotlib、Plotly、D3.js、音声合成、画像生成AI |
| ⑤中間表現 | 受け渡し用の形 | HTML、SVG、音声ファイル、ネーム画像 |
| ⑥描画・加工 | 画像にする、つなぐ、合成する | Chromium（Playwright、Puppeteer）、Pillow、gifski、ImageMagick、FFmpeg、MoviePy、Remotion、動画生成AI |
| ⑦出力 | できあがり | Word、PowerPoint、PDF、Webページ、アニメーションGIF、MP4動画 |
要になるのは、③のブロックです。図も、データも、ナレーションの台本も、漫画の字コンテ（ページとコマを文字で書いた表）も、すべてMarkdownの中のブロックとして書きます。たとえば図は、次のようなコードブロックで定義します。
figure: 制作工程
nodes:
- {id: scenario, label: シナリオ}
- {id: draft, label: AIが下書き}
- {id: approve, label: 人が承認}
edges:
- [scenario, draft]
- [draft, approve]
steps:
- {show: [scenario], caption: 素材を用意する}
- {show: [draft], caption: AIが下書きする}
- {show: [approve], caption: 人が直して承認する}要素、つながり、見せる順番（steps）が元の側にあるので、同じブロックから静止画のSVGも、順番に点灯するアニメーションGIFも、PowerPointのアニメーションも、動画も作れます。出力の形式を変えても、見せる順番は変わりません。
よくある誤り
一番起きやすい誤りは、図の定義をMarkdownに置かず、変換用のスクリプトの中に直接書いてしまうことです。筆者自身も、Wordに動く図解を埋め込む作業でこれをやりました。出来上がりは同じに見えますが、図を直すたびにスクリプトを開くことになり、内容と道具の区別が崩れます。原理の1つ目に反する形です。
もう一つは、HTMLを元だと考えることです。HTMLはブラウザに描かせるための入れ物で、HTMLからWordやPowerPointへ変換すると、体裁が崩れやすくなります。WordとPowerPointは、Markdownから直接作るのが確実です。
出したい形式ごとの注意
| 出力 | 道具 | 注意 |
|---|---|---|
| Word | Pandoc、docx（npm）、python-docx | 動画は埋め込めません。アニメーションGIFなら文書の中で動きます |
| PowerPoint | Marp、Pandoc、python-pptx、PptxGenJS | プログラムからアニメーションを付ける標準の機能がありません |
| Chromiumの印刷、Pandoc、WeasyPrint | 日本語の組版はChromium経由が手堅い | |
| アニメーションGIF | Chromiumで撮影し、Pillowやgifskiでつなぐ | 256色まで。写真やグラデーションには向きません |
| MP4動画 | FFmpeg、MoviePy、Remotion、動画生成AI | 次の節を参照 |
動画への4つの道
- 図の定義ブロックと台本ブロックから作る。図のコマを撮影し、台本を音声合成（OpenAI TTS、ElevenLabs、VOICEVOXなど）で読み上げ、FFmpegやMoviePyで合成します。研修や解説の動画に向く、最も手堅い道です。
- 文章ブロックからHTMLを作り、CSSやSVGで動きを付けて録画する。Playwrightでの録画や、Reactのコードで動画を組み立てるRemotionが使えます。動きの自由度が最も高い道です。
- PowerPointに書き出し、人が手で動きを付けて、PowerPoint本体の機能で動画にする。
- 字コンテブロックから画像生成AIで絵を作り、動画生成AIで動かす。2026年時点では、Veo 3.1、Kling 3.0、Runway Gen-4.5、Seedanceなどが主な選択肢です。1本は数秒から30秒程度で、人物の見た目を保つことがまだ課題です。
人が判断するのは、元だけ
この仕組みで人が判断するのは、Markdownの中身だけです。何を書くか、図で何をどの順に見せるか、どこを山場にするか。そこが決まれば、出力の形式はAIと道具に任せられます。
道具は毎年入れ替わります。動画生成AIの顔ぶれは、この1年でも大きく変わりました。それでも、元をMarkdownに置き、道具を交換できる部品として扱う限り、積み上げた内容は失われません。生成AIの時代に人が持つべきなのは、出力の技術よりも、元を書く力です。
