生成AIでスライドを作るなら、reveal.jsが最強という話 • one more think

生成AIにスライドを作らせると崩れるのは、パワーポイントという形式がAIにとって扱いづらいから。文章でできているreveal.jsなら、相性が抜群だという話。

最近、「生成AIにスライドを作らせたいけれど、どうもうまくいかない」という相談をよくいただきます。

今回は、私自身がたどり着いた「生成AIでスライドを作るなら、これがいちばん相性がいい」という方法を紹介します。結論から言うと、reveal.js（リビール・ジェイエス）という仕組みを使うのがおすすめです。

AIにスライドを作らせると、なぜか崩れる

生成AIに「この内容でプレゼン資料を作って」とお願いしたことがある方なら、心当たりがあるかもしれません。

PowerPoint（パワーポイント）形式で出力させると、文字がはみ出したり、レイアウトが崩れたり、微妙に思った通りにならない。結局、細かい位置合わせを自分で延々とやるはめになって、「これなら最初から手で作ったほうが早かった」となる。あの感じです。

これは、AIが苦手だからというより、パワーポイントという形式そのものが、AIにとって扱いづらいことが原因です。

パワーポイントの中身は、図形やテキストボックスの座標を細かく指定する複雑なデータでできています。AIはそこを直接いじるのが得意ではないので、どうしても崩れやすくなる。

そこで登場するのが reveal.js です。

reveal.js は、HTMLでスライドを作るための仕組みです。HTML（エイチティーエムエル）というのは、ふだん私たちが見ているウェブページを作るための、いちばん基本的な書き方だと思ってください。

ポイントは、reveal.js を使うと「ウェブページを1枚めくると次のスライドが出てくる」という形で、ブラウザ上でそのままプレゼンができること。特別なソフトはいりません。ブラウザさえあれば、パソコンでもタブレットでも同じように表示できます。

そしてここが肝心なのですが、reveal.js のスライドは中身がすべてHTML、つまり「文章」でできています。座標を指定する複雑なデータではなく、テキストの並び。

だからこそ、文章を書くのが本業である生成AIと、相性が抜群にいいのです。「この内容をreveal.jsのスライドにして」と頼むと、レイアウト崩れに悩まされることなく、きれいなスライドが一気に出来上がります。

実際に作らせるときのコツは、次の4つです。

スライドにしたい内容を渡す：箇条書きのメモでも、文章の下書きでもかまいません。「何を伝えたいか」がまとまっていれば十分。すでにPowerPointで作ったファイルがあるなら、それをそのまま渡してもかまいません。中身を読み取って、reveal.jsのスライドに作りなおしてくれます
HTMLで、1枚のファイル（index.html）として作らせる：ファイルがひとつにまとまっていると、あとで扱うのがぐっと楽になります
reveal.jsを使うよう指定する：これを伝えないと、AIは通常のウェブページとして作ってしまいます。「reveal.jsでスライドにして」と明示するのが大事
オフラインでも表示できるようにする（必要な場合）：セミナー会場や客先など、インターネットにつながらない環境で見せる予定があるなら、「オフラインでも表示できるようにして」と指示します

この4点を伝えるだけで、たたき台としては十分なスライドが出てきます。あとは中身を読みながら、気になるところを「ここはこう直して」と会話で調整していけば完成です。

もう一歩進めて、「会社の雰囲気に合ったデザインで揃えたい」という場合。

そのときは、Claude Design（クロード・デザイン。AIでデザインを作れる機能）であらかじめデザインの雛形を作って、それをスライド作成時に一緒に渡します。色づかいやフォント、全体のトーンを雛形で指定しておくと、中身が変わっても見た目が統一された、まとまりのあるスライドになります。

内容はAIに素早く組ませ、見た目は自分の「型」で揃える。この分担がうまくはまると、資料づくりの時間は驚くほど短くなります。

実際に、私自身がこの方法で作りなおしたスライドがあります。

2010年ごろ、私はドナルド・ノーマンの『誰のためのデザイン？』という本を読んで、そこで語られる「ユーザー中心デザインの7つの原則」を自分なりにスライドにまとめたことがありました。当時はもちろん手作業です。図を並べ、レイアウトを整え、それなりに時間をかけて作ったものでした。

ただ、15年も経つと、当時使った事例はどうしても古びてきます。そこで、内容を今の身近な例、スマートフォンやアプリの操作などに置きかえたうえで、Claude Design でデザインを整え、reveal.js を使って丸ごと作りなおしました。

出来上がったのがこちらです。

「ユーザー中心デザインの7つの原則」
https://works.crssrds.jp/learn/ucd_7principles/

手作業でゼロから作っていた頃を思うと、かかった手間はまるで違いました。

かつて自分が時間をかけて組んだ資料を、AIの助けを借りて、しかも今の時代に合った中身に更新して蘇らせる。この体験は、私にとってちょっとした発見でした。過去の蓄積を捨てずに、現在の道具で磨きなおせる。AIの使い方として、これはかなり実用的だと感じています。

スライド作りは、多くの人にとって「地味に時間を取られる作業」です。だからこそ、AIとの相性がいい方法をひとつ知っておくだけで、日々の負担はずいぶん軽くなる。

パワーポイントの体裁に振り回されるのをやめて、「伝えたい中身」に集中する。生成AIをスライド作りの相棒にするなら、まず試してみる価値のあるやり方なのではないかなと思っています。