コワーキングスペース 代表 鶴田 賢太 こんにちは、春日井コワーキングスペースRoom8オーナーの鶴田です。
最近ふと思ったんですよ。
「プレゼン資料って、もうスライド形式じゃなくて良くない？」って。
もちろん僕も長らくお世話になってきましたよ、PowerPoint。
でもあれってそもそも印刷文化の名残なんですよね。
「1ページずつめくって話す」って、昔のOHP（←知ってる人いる？）の延長線上の考え方。
でも今って、AIがHTMLを生成できるじゃないですか。
そしたら、1ページずつ制限されてるスライドより、レスポンシブなHTMLの方がよっぽど表現力あるんですよ。
そもそも、資料って“わかりやすく伝える”のが目的でしょ？
なのに、誰が決めたのか知らないけど、なぜか「PowerPointで作るもの」って固定観念だけが生き残ってる。
で、僕はこう言いたい。
「それ、AIがHTMLでやってくれるなら、もうスライドじゃなくてよくね？」今回の話は、HTMLプレゼン資料の話でありながら、 実は“プレゼン資料そのものの再定義”に近い話です。
常識を壊すところから、いっしょにいきましょう。
常識を疑え：「スライド＝資料」という思い込み
プレゼン資料＝PowerPoint。 この固定観念、いつの間に常識になったんでしょうね。
でもスライド形式って、そもそも映写機前提の“制限付き構造”なんです。 1画面に詰める、1枚ずつめくる、っていう時代遅れの前提が、今も続いてる。
スライド構造の限界
- 話がページごとにブツ切れになる
- 表と解説が分断される
- 一度に見せたいものが分けられる
伝え方に制限がある時点で、それはもはや表現ではないんですよ。
スライドって本当に必要？
ブログやLPは1ページで流れを見せますよね？ 資料だけがなぜ「1枚ずつ」じゃないといけないのか。 そろそろ疑ってもいい頃です。
結論：
スライドは“伝達”の手段ではなく、“制限”になっている。
では、なぜ今HTMLで資料を作るのが現実的になったのか？ その理由に進みましょう。
HTML資料の時代が来た理由：AIが書けるようになったから
「コードが書けなくてもHTMLが使える時代」
少し前まで、「HTMLで資料を作る」なんて聞いたら、
「それって専門の人がやるやつでしょ？」って思ってましたよね。
でも今は違います。
ChatGPTに「スマホでも見やすい資料をHTMLで作って」と頼むだけで、
それっぽいものが、数秒で出てくるようになったんです。
「こうしたい」を言えば、形にしてくれる
「縦にスクロールして流れるように」 「スマホでも文字が読みやすいように」 「見た目はシンプルでカッコよく」 そういう希望を言えば、AIが自動でそれに近いHTMLを作ってくれるんです。
つまり、今までは“できる人しかできなかったこと”が、誰でもできるようになったということ。 これはちょっとした便利機能じゃなくて、時代が変わるレベルの話なんですよ。
これ、何がそんなにすごいの？
- スマホ・パソコン、どんな画面でも見やすい
- URLを送るだけで誰でも見れる（アプリ不要）
- あとから自分で中身を変えられる
- 動きやデザインもAIがやってくれる
しかもこの「資料」、ふつうのWebページと同じように見れるので、
スライドより自然に、情報が頭に入ってくるんです。
結論：もう「資料づくり」で悩まなくていい
これからの資料づくりは、デザインや技術の勝負じゃありません。 大事なのは「何を伝えたいか」。 その中身さえあれば、あとはAIが全部やってくれます。
次は、そうしてできた資料がどれだけ見やすく、ストレスなく読めるかについて話していきます。
レスポンシブ資料という概念：もうPDFは死んだ
スマホで見づらい資料、まだ使ってます？
たとえば、メールで送られてきたPDF。 スマホで開くと文字が小さすぎて読めない、横にスクロールしないと見れない…。 あのストレス、もう終わりにしませんか？
HTML資料は、画面サイズに合わせてくれる
HTMLで作った資料は、スマホでもパソコンでも、自動で見やすく調整してくれるんです。 これを「画面に合わせて変わる資料」ってことで、最近は「レスポンシブ資料」と呼ばれたりします。
でも、言葉はどうでもよくて、実際に見てみたら分かります。
- スマホで開いても文字が大きい
- スクロールだけでスイスイ読める
- 表や画像もちゃんとレイアウトされる
こういう体験が、HTML資料では「標準装備」なんです。
PDFは保存向き、HTMLは“読む”ためのもの
PDFは「印刷するためのファイル」です。 だから、スマホでは見づらくて当然。 でも今の時代、読むのは紙じゃなくて画面ですよね？
だったら、最初から「読みやすい画面用の資料」を作るべきなんです。 それがHTML資料。 リンクで送れるし、共有もしやすい。 デザインだって、あとから直せます。
今後のプレゼンは「伝達資料」ではなく「体験資料」へ
説明する時代は終わった
「伝えたいことをスライドにまとめて、順番に話す」 こういうプレゼン、これまでは普通でしたよね。 でも、これからの時代は違います。
相手に説明するんじゃなく、 体験させて感じてもらう──これが新しい資料の役割です。
動く、流れる、変化する資料
HTMLで作った資料なら、ただ文字を読むだけじゃありません。
- 表がじわっと現れる
- 画像がスライドして登場する
- 文章が流れるように読める
こういう動きがあるだけで、受け手の理解度や印象は大きく変わるんです。
しかもそれ、全部AIが手伝ってくれます。 「見せ方まで考えるのは面倒…」って人でも、ChatGPTに頼めば補ってくれる時代です。
説得じゃなくて共感を生む
スライドって、どうしても「一方通行」になりがちです。 でも体験ベースの資料は、相手の視線や関心に寄り添ってくれる。
「読んでいくうちに、気づいたら理解していた」 そんな資料が、HTMLで作れるようになってきたんです。
結論：プレゼンは“語る”から“感じさせる”へ
これからの資料は、 「これを読んでください」じゃなく「これを感じてください」。 言葉ではなく、構造と流れで伝える資料が主流になります。
次は、実際にHTMLで作ったプレゼン資料を見てみましょう。 理屈抜きで「これなら分かりやすい」と感じるはずです。
実際のデモ（この記事で紹介しているやつ）
まずはこれを見てください
ここまでいろいろ語ってきましたが、やっぱり一番わかりやすいのは“見てみること”です。 Room8で実際にHTMLで作った資料のデモはこちらです：
✅ https://room8inc.github.io/ai-presentation-demo/
スマホでもパソコンでも開いてみてください。 スクロールで読み進められるように設計されたプレゼン資料です。
ブログやnoteとの相性も抜群
この資料の良いところは、「URLで送れること」。 PDFを添付したり、ファイルを送ったりする必要はありません。
ブログ記事の中に貼り付けてもいいし、
noteやX（旧Twitter）で紹介してもOK。
<iframe>タグを使えば、こんなふうにページ内に埋め込むこともできます。
もちろんあとから直せる
スライドやPDFと違って、あとから直したり、情報を追加したりするのも簡単です。 URLはそのままで中身だけ更新できるので、セミナー資料や営業資料にも使えます。
結論：HTML資料は“伝える”を超えていく
資料が「その場限りの道具」じゃなく、資産として使い続けられる。 それが、HTML資料の一番の強みかもしれません。
AI時代の資料作りは「どう動くか」まで指示できる
「HTMLで出力して」だけだと、動かない
ChatGPTに「HTMLで資料作って」と言えば、 それっぽい見た目の資料は出てきます。 でも、それって動きもインパクトも何もない、ただの“文字ページ”なんですよね。
「どう動かしたいか」まで伝えると、一気に化ける
ChatGPTは“演出家”としても超優秀です。 たとえば、こんなふうに伝えると…
- 「タイトルがゆっくりフェードインするようにして」 → スクロールに合わせてふわっと表示される
- 「背景がスクロールに合わせて少しだけ動くように」 → パララックス効果と呼ばれる奥行きある演出に
- 「このグラフは右からスッと出てくるように」 → 横スライドで登場させて視線を誘導
こういう“見せ方”をちゃんと伝えると、資料の印象がまるで変わるんです。
用語は覚えなくてもいい。でも知ってると強い
たとえば「背景が少しだけ動いて奥行きが出るやつ」＝パララックスと呼ばれます。 ChatGPTに「パララックスっぽくして」と言うだけでOKです。
他にも、AIに伝えやすくなる用語をいくつか紹介しておきます：
- フェードイン：ゆっくり現れる
- スライドイン：横からスッと出てくる
- スクロール連動：下に進むと一緒に動く
- ピン留め（Sticky）：特定の場所に固定表示される
- パララックス：背景と前景が違うスピードで動く
全部覚えなくても大丈夫です。
「フェードイン」という言葉を知らなくても、
「タイトル部分がぼやっとゆっくり現れるようにして」と指示すれば、
AIは「あ、それフェードインのことね」とちゃんと理解してくれます。
だから、「言葉を知らないと使えない」なんて思わなくて大丈夫。 日本語で感覚的に伝えるだけでも、AIは意図をくみ取ってくれるんです。
サクッと作ったデモ資料もあります
今回紹介している資料は、Room8でサクッと作ったデモ版です。 あまり派手な動きは入れてませんが、雰囲気は伝わると思います。
✅ https://room8inc.github.io/ai-presentation-demo/
ここからどこまでやるかは、あなたの指示次第。 資料に「演出」という視点が入るだけで、伝わり方は桁違いになります。
結論：「何を見せるか」より「どう見せるか」が勝負
AIがHTMLを作れる時代に、 中身だけじゃなく“見せ方”までコントロールできる人が強いんです。
つまり、良い資料を作るには
伝える力 ＋ 指示する力が求められる。
ChatGPTはその命令に100%従う、優秀な舞台スタッフです。
まとめ：資料づくりに“自由”を取り戻す時が来た
PowerPointが悪いわけじゃないんです。
でも、スライドという構造に縛られてきた僕たちは、
いつの間にか「こういうもんでしょ」って思考停止してただけ。
でも今は、AIがHTMLを書ける。
しかも、動きも、流れも、構成も、全部言葉で伝えれば形になる。
つまり資料って、もはや「作業」じゃなくて「指示」なんですよね。
- 誰でもスマホで見れる
- リンクで送れて、あとから直せる
- 感覚的に伝えて、動かせる
そんな資料、今までありました？
ないなら、もう使う理由ないでしょ。
ということで、
これからの資料は「スライドで1枚ずつめくる」じゃなくて、
“スクロールで体験させるもの”へ。
「伝える」より「感じさせる」ための資料、
AIと一緒に作っていきましょう。