AIチャットとAIエージェントの違い
みなさんこんにちは、矢野 哲平です。 この番組は、耳で学ぶAIをコンセプトに、初心者・中級者向けに、AIを分かりやすく解説する番組です。
今回のテーマは、AIエージェントにスライドを作ってもらうについて話していきます。 この番組は、3倍早くメモできる音声入力アプリNOKIの提供でお送りします。
はい、ということで今日は、AIエージェントにスライドを作ってもらう方法について話します。 みなさん、AIを使ってスライドを作っていますでしょうか。
以前この番組でも紹介しましたけど、AIを使ってスライドを作成する、この方法たくさんあります。例えば、スライド制作に特化したAIツールを使う方法。
チャットGPTやGemini、クロードのようなチャット画面でスライド作成をする方法。 そして、クロードコードやコーデックスのようなAIエージェントにスライドを作ってもらう方法。
今回話すのは、AIエージェントにスライドを作ってもらう方法についてです。 今日話すポイントは主に3つです。
1つ目に、AIエージェントにスライドを作ってもらうということはどういうことなのか。 2つ目に、スライド作成をAIチャットに依頼する場合と、AIエージェントに依頼する場合の違い。
そして3点目に、AIエージェントにスライドを作成してもらう具体的な流れ。 これら3点を中心に話していきます。
はい、では早速話していきましょう。 今回AIを使ったスライド作成についてかなり深掘った話をしていきたいと思います。
AIを使ってスライドを作成したいと考えている人や、すでにAIを使ってスライドを作成している人、でももっと何かいい方法ないかなと考えている人にとって持ち帰れるものが多いエピソードにしたいと思います。
なので、ちょっと内容的には取っ付きにくい部分もあるかもしれないんですけど、最後までお付き合いいただければ嬉しいです。
はい、では早速本編に入ります。 AIを使ってスライドを作成する。このような使い方している人多いと思います。
冒頭でも触れたように、AIを使ってスライドを作成する方法を大きく分けて3つのパターンに分けられると思います。
1つはスライド作成に特化したAIツールを使う方法。 2つ目は普段私たちが使っているような
ChatGPT、Gemini、CloudのようなAIのチャット画面でスライドを作成する方法。 例えばGeminiとかではCanvasといった機能でチャット上からスライドを作成することができます。
そしてそれをGoogleスライドとして出力したりもできます。 3つ目の方法はクロードコードやコーデックスのようなAIエージェントを使ってスライドを作成する方法。
今回話す内容はこの3つ目の方法です。 わざわざAIエージェントを使わなくても先ほど紹介した1つ目2つ目の方法でスライドを作成することはできます。
じゃあなぜ3つ目のAIエージェントを使ってスライドを作成する方法、 これを今回話すのかというと、
端的に言ってAIエージェントを使ってスライドを作成した方がよりリッチな見た目になったり、 より精度の高いスライドを作成できるからです。
あとはAIチャットではできないような実装をすることができます。 私もAIエージェントを使ってスライドを作成しています。
なのでそういった経験談ベースの話も交えながら話していきたいと思います。 私はもともとChatGPTやGeminiのチャット画面でスライドを作成していました。
ですがスライドを作成していくうちに色々課題を感じるようになりました。 例えばスライドのページ送りをした時にアニメーション追加したいとか、
もっとデザインの幅を広げたいとか、 AIにはできるだけこちらの要望通りのスライドを作成してほしいとか、
具体的な例を挙げると、例えばスライドの特定の単語、 単語の下に赤い線をサッと引くようなアニメーションであったり、
あとはナレーションの音声に合わせて自動でスライドのページが送られるような実装。 こういったことを既存のチャット上で実装するのは難しいです。
何かもっといい方法ないかなと探していくうちに AIエージェントを使ったスライド作成に行き着きました。
HTML・SVG・Canvas 2Dでスライドを作る
じゃあAIエージェントを使ってどのようにスライドを作成していくのかというと、 これもまたいくつかアプローチがあります。
以前このポッドキャストでマークダウンというテキストファイルをスライドに変換する方法についても紹介しました。
ですが現在ではHTMLというホームページなどにも使われるコード、 それをそのままスライドに転用する方法がやりやすいと思います。
会社のホームページにアクセスをすると会社紹介のページとかバーっと出てくるじゃないですか。
ああいったものはHTMLとCSSというもので構成されています。 それをそのままスライドに転用していくと。
つまりGoogleスライドやPowerPointのような見た目のスライド、ああいったものをHTMLとCSSで作成することができます。
これは以前ポッドキャストでも話しました。 そこからいろいろ実験をして、よりリッチな見た目にするにはSVGというものを使うと良いということがわかってきました。
ここでいうSVGというのはあの画像フォーマットの一つなんですけど、 スライドで使う図形などを描画することに使えます。
SVGを使うことでスライドの図形などをアニメーション付きで実装できると。 例えば円グラフとか棒グラフとかチャートとか。
ここまで聞いてHTML、CSS、SVGって何ですかと、 ちょっとよくわからないという人もいると思うんですけど、ここもAIアジェントを使うことで簡単に解決することができます。
HTML、CSS、そしてSVGを使って生成AIとはというタイトルでスライド資料を作成してください。
こんな感じの指示を投げるだけでAIが必要なコードを書いてくれます。 こうした人間の少ない指示だけでAIが必要なものを出力してくれる。
これもクロードコードやコーデックスのようなAIアジェントを使うメリットと言えます。 補足するとコーデックスというのはオープンAIが提供するコーディングに特化したAIアジェントです。
ちょっと一旦まとめます。AIアジェントを使ってスライドを作成する。 この時にマークダウンではなくHTMLやCSS、あとはプログラミングの言語である
JavaScriptこういったものを使うと。 そしてSVGを使うとデザイン性の高いスライドを作成することができます。
もちろんHTML、CSS、JavaScriptこれらだけで動きのあるアニメーション、グラフなんかも実装できます。
ただいろいろ実験した感じではやっぱりSVGを使った方がスライドのデザイン性は上がると思います。
でこういったこともAIアジェントに口頭で指示をするだけで作成ができます。 さらにここにプラスしてもう一つの選択肢として
Canvas2Dというものもお勧めしたいので補足します。 ここでいうCanvas2Dというのはざっくり言うとブラウザーの中に用意された
お絵かき用の白いキャンバスのようなものです。 HTMLで四角いスペースを1枚置いて、でそこに
JavaScriptで線を引いたり、あの円を書いたり文字を置いたりしていくと。 SVGとの違いを簡単に言うとあのSVGは図形を一つずつ
部品として貼り付けていく切り絵のようなもの。 でCanvas2Dは真っ白な画用紙に直接絵を書いていくようなイメージです。
なので図形の数が多いスライドだったり 図形や数字が動くようなアニメーション
こういった動きのある表現はCanvas2Dの方が得意だと思います。 AIエージェントを使ってHTML、CSS、あとはSVGで図形なんかを書くようなスライド
こういった場合図形が重複して表示されたり 図形に文字がかかっているような状態が発生します。
こうした何と言いますかデザインの崩れ そういったものはCanvas2Dを採用することで少なくなります。
あの全くゼロというわけではないんですけど SVGに比べると明らかに少なくなります。
もちろんこういった方法も自分でコードを書く必要はありません。 Canvas2Dを使ってこのようなグラフを作成してください。
アニメーション付きでと。 こんな感じで指示するだけでAIエージェントが実装してくれます。
ちなみにこうしたデザインの崩れ これもAIエージェントを使うことでAIチャットにはできない修正を行うことができます。
AIによる自己改善とデザイン・文章の統一
それはどういったものかというとAIにスライドのページを作ってもらった後に AIエージェントに自律的にそのページを評価させて
自分で崩れている箇所があれば修正させる こういった動きができます。つまりAIエージェントによる自己改善のフィードバックを行うことができます。
例えばAIチャットでスライドを作成する場合このような流れになります。 AIがスライドを作成します。
でそれを人間が目で見てここ文字と図形が被っていますよとか 図形の位置がおかしいですとそういったことを人間がフィードバックして
AIが修正するという流れを取ります。 一方でAIエージェントを使ったスライド作成だとこういった流れになります。
AIエージェントがまずスライドを作成します。 でその後にAIエージェントが自らそのスライドを一つの画像として視覚的に評価をします。
でここは文字が図形と被っているとか図形の位置がおかしい そういったものを自分でフィードバックして自己改善を行うことができます。
でこうした動きができるのもAIエージェントを使ったスライド作成ならではだと思います。
ちなみにこうしたあのAIエージェントによる自己改善のフィードバック この処理を挟んだ方が一発出しでスライドを出すよりも必ず結果良くなります。
これ私実際に実験してみました。 HTML、CSS、あとはSVGとCanvas2D
それぞれのアプローチで1回でスライドを作成させたパターンと スライドを作成させた後にAIエージェントに自律的にフィードバックを行なわせたパターン。
明らかにフィードバックを行った方が結果は良かったです。 AIエージェントに作ってもらったスライドをAIエージェント自身に評価させて改善させる。
こちらぜひ試してみてください。 もう一つお勧めしたい方法としてスライドの精度を安定させる方法
2つ紹介したいと思います。 一つがデザインプレートを設定する。そしてもう一つがテキストのトーンを統一する。
こちら詳しく解説します。 一つ目のデザインテンプレートを設定する。
これどういうことかというと スライドを作成させる時にAIにこんな感じのデザインのスライドを作成してくださいと
事前にデザインのテンプレートを渡しておくということです。 これは事前にhtmlファイルのようなデザインをあらかじめ用意しておきます。
こうしたAIが参照するデザインファイル これを用意しておくことでスライドのデザインを統一しやすくなります。
例えば社内向けのスライドではAというちょっと遊び心のあるデザインを使用すると
社外向けのスライドではしっかりしたデザインのBを使用する。こんな感じです。 こういったものを事前に用意しておくことで今回のスライドのデザインは
Aのデザイン案でお願いします。 Bのデザインでお願いします。このように簡単にデザインの切り分けをすることもできます。
じゃあこうしたデザインのテンプレートをどうやって作るのかというと、これもAIエージェントに指示します。
このような用途でスライド資料を作りたいです。 テーマカラーはブルー、フォントは○○というフォントを使ってください。
このような内容でデザイン案を4つ出してください。 AIが提示してくれたデザイン案をどれか一つ選んで
そこからまたさらに細部を作り込んでいく。 こうすることで簡単にデザインテンプレートを作成できます。
そしてもう一つがテキストのトーンの統一です。 これはどういうことかというと、スライドで使われる文言があるじゃないですか。
見出しの言い回し、本文の言い回し、 こういった言葉の言い回し、トーン
それをAIが参照できるものをあらかじめ作っておくと。 こうすることでAIがその内容に沿った言い回しをしてくれます。
文体を揃える、テキストのトーンを揃えると言えばいいんでしょうか。 じゃあこれどうやって作るのかというと、今まで自分が手作業で作ってきたスライド
それをAIに渡して、AIにテキストの言い回しやトーン こういったものを抽出してもらうように依頼します。
でこれをAIがスライドを作成するときに参照してもらうことで、普段人間が作っている スライドの言葉の使い方、言い回し
こういったものをAIが使ったスライドで再現しやすくなります。 こうした人間が書いた文章から言い回しやトーン
そういったものを抽出してAIに参照させる。 こうしたアプローチは他でも応用することができます。
例えばAIに普段私が書いているメールの言い回し、 トーンでメールを作成してもらうと。
いきなりあのAIにメールを作成してくださいとお願いする前に 事前に普段自分が書いているメールやレポート
そういったものをAIに渡してこのテキストから言い回しやトーンを抽出してくださいと 依頼をします。そして抽出したものをAIに渡してこんな感じの言い回しの
文章を作成してくださいと。 依頼することでAIっぽくない、自分が普段書いている自然な文章を作成しやすくなります。
こちらもあのおすすめの方法なのでぜひ試してみてください。 こんな感じでAIエージェントを使ってスライドを作成していく。
修正作業と音声連動スライド
こうすることでAIチャットでは実装が難しいことでもできるようになります。 ただAIエージェントが作成したスライド
全く修正なしでそのまま使えるのかっていうと毎回そういうわけではありません。 じゃあこうした修正指示はどうやって行うのかというとこれもいくつかアプローチがあります。
で最も簡単な方法は口頭でAIに修正指示をする方法 1ページ目のスライドここをこのように修正してくださいとか
でもう一つの他の修正方法はこれ以前ポッドキャストでも話したと思うんですけど HTMLを画面上で編集できるような環境を用意すると
イメージ的にはそうですね あの google スライドとかキャンバーのようにブラウザの画面上で人間がその要素をクリックするとテキストの
編集ができたりとかそういったものを用意すると でこれもAIエージェントを使えば簡単に実装できます
であとはもう一つの修正指示の方法が スライドを一つの画像として捉えてそこに修正指示を人間が書き込むような内容です
でその修正指示を一括でAIエージェントに処理してもらうと 一枚ずつ指示していくと結構時間もかかってしまうので修正指示を画像にこうペタペタ貼って
それが20枚ぐらい溜まったらAIエージェントにこの修正指示 全部対応お願いしますと最近はこのやり方で落ち着いています
結構昼食で履席したりあとは寝る前に一括でお願いする 結構そういったの人間がパソコンから離れている時間
結構あるじゃないですか でそういった時にAIエージェントに一括で修正作業をお願いしておくと
で後で人間でチェックするこんな感じの流れです であとはAIエージェントを使ったスライド作成ならではのアプローチとしてこういったものもあります
でそれどういったものかというとナレーションの音声とスライドのアニメーション これを連動させて一つの動画を作るそういったこともできます
でこれ私ビデオポッドキャストで使っている内容なんですけど スライドのアニメーションがあるじゃないですか
例えばテキストの特定の単語に線が引かれたりとか 話している内容に合わせてグラフが表示されたりとか
でそういったものもAIエージェントを使ったスライド作成だと実装できます 具体的にこれどうやるのかというと音声の文字起こしのAIモデルがあります
オープンAIのウィスパーこれを使ってタイムスタンプ付きの文字起こしをして その文字起こしの内容とスライドのアニメーションを連携させる
こういったアプローチです こういったことができるのもAIエージェントを使ったスライド作成ならではの機能です
ちなみにこういったことはChatGPTやGeminiのAIChatでは実装できません あとはあのさらに発展形としてこういったこともできます
自分の声を使ったAIナレーション
スライドの台本これを用意しておいて私の声を真似した AI音声でナレーションつける
このようなことも可能です スライドにナレーションつける作業って結構大変なんですよね
言い間違いがあったら修正する必要がありますし あとは収録の時の背景の雑音こういったものが入ってないか注意する必要もあります
音声を収録して音声が綺麗になるように成形してそれを動画に当てはめると結構作業としては大変です
ですがテキストからAI音声のナレーションを起こすと このようなアプローチを採用するとこうした収録作業や音声の編集作業が一切不要になります
でこうしたものはテキストから音声を作成するテキストトゥスピーチ あのTTSなんか言われたりするんですけどこうしたAIの技術を使って実装します
でここで使われる声は例えばジェミニノートブックのあのAIポッドキャスト 作った時の男女の音声があるじゃないですか
あの音声も使えますしあとはチャットGPTの音声モード あの会話の音声を使うこともできます
でこうした音声とは別に自分の声をベースにしたAI音声を作ることもできます ちょっと試してみましょうか
これはあのクエンTTSというAIモデルを使って私の声をベースにして作ったAI音声です ちょっと流してみます
皆さんこんにちはこの音声はAIで作りました はいこんな感じですどうでしょうか
ちなみに失敗版になるとこんな感じになります 皆さんこんにちはこの音声はAIで作りました
はいこんな感じです 以前に比べるとこうした人間の声をベースにAI音声を作成する
かなり精度は上がっています ただ私が試している範囲ではちょっとまだ本番で使うのは難しいかなと感じる部分もあります
でまだここらへんは私がいろいろ深掘りできていないので まだリサーチ不足もあると思うんですけど
こうしたAI音声がもっとうまく作れるようになると スライドの台本からその人がナレーションしているような動画を作成することができます
でこうした発展の余地があるのも AIエージェントを使ったスライド作成ならではだと思います
はいそれでは今日のポイントをまとめます 一つ目にAIチャットでスライドを作成するよりも
AIエージェントを使った方がより精度高くそしてできることの幅は広がります 二つ目
AIにスライドを作ってもらう場合 参照となるデザインやテキストの言い回し
トーン こういったものを事前に渡すことで成果物は安定しやすくなります
最後3点目 AIエージェントに自己改善のフィードバックをさせた方が出力は安定します
つまりAI自身にスライドを視覚的に評価をさせて 誤っている部分があれば修正させる
こういった処理ができるのもAIエージェントを使ったスライド作成ならではといえます はい今日はこのへんということで本日もお付き合いいただきありがとうございました
番組ではこのように耳で学べるAIを毎週発信しています 通勤中や火事の合間にAI情報キャッチアップできます
毎週水曜朝に更新していますぜひフォローお願いします そして私が開発している3倍早くメモできる音声入力アプリ
Nokiのリンクも概要欄に添付しています おすすめの使い方はポッドキャストを聞きながら気づいたことを声だけでメモを取るような使い方
興味のある方はこちらもぜひ お相手は耳で学ぶAIの矢野てっぺいでした
また次の配信でお会いしましょう
