エージェントのグラフィック作成に HTML が不可欠

エージェントのグラフィック作成に HTML が不可欠：AI が「空間推論」を克服する新アプローチ

コーディングエージェントはコード生成だけでなく、スライドやドキュメントの自動作成も可能だ。しかし、従来の Figma や PowerPoint といったキャンバス操作型ツールを AI に使わせようとすると、レイアウトが崩れ、要素が重なり合う「ゴミ」のような出力しか得られないのが実情だ。この課題を解決する鍵は、AI が苦手とする「空間推論」ではなく、得意とする「言語と構造（HTML）」を用いて思考させることにある。

従来のツールが AI に失敗する理由：空間推論の壁

多くの人がコーディングエージェントに期待するのは、コードを書く能力だけだ。しかし、それは誤解であり、単なる悪いマーケティングと言える。実際には、AI エージェントはほぼ何でもできる。だが、その能力を最大限引き出すには、人間のように思考させるのではなく、「エージェントとして」思考させる必要がある。

例えば、スライドやドキュメントの作成において、多くの人が使うのは PowerPoint、Figma、Canva といったツールだ。これらはすべて「キャンバス操作型」であり、クリック、ドラッグ、ドロップ、リサイズといった、人間の地理空間的な世界観に合致した動作を前提としている。

エージェントにこれらのツールを渡すとどうなるでしょうか？出力はすべて間違っています。要素がおかしい形で重なり、テキストが見えず、整列もありません。ただのゴミです。

AI 懐疑派は「エージェントには空間に関する推論能力が本質的に欠けている」と指摘する。実際に、開発者のサイモン・ウィリソン氏による有名なテストがある。「ペリカンが自転車に乗っている絵を描いてください」という命令に対し、SVG（Scalable Vector Graphics）のみを使用させるというものだ。

このテストは、モデルが空間について考えられるかどうかを即座に判断するためのものだが、結果は絶望的だった。AI は SVG のような「数字の壁」から、視覚的なイメージへと移行することができない。人間が手書きで SVG を描こうとしても難しいように、AI にキャンバス操作を強要するのは本質的に意味が通じないのだ。

HTML を思考言語として活用する新戦略

では、どうすればいいのか？答えはシンプルだ。「モデルの問題ではなく、媒体の問題」である。AI に人間のような視覚的思考を求めず、AI が得意とする「構造（タグ）」で考えさせる必要がある。

AI に必要なツールは、その思考様式に基づいて与える必要があります。人間のようにではなく、ピクセルや言語、単語、構造こそがそのネイティブな媒体です。

HTML と CSS は、レイアウトを記述する能力に優れた言語だ。モデルは数十億もの例を見て訓練されており、タグの意味（見出し、チャート、グリッドなど）を直感的に理解している。ブラウザがそれらをピクセルに変換して表示するため、AI は座標を直接配置する必要がない。

先ほどの「ペリカン」のテストでも、HTML を使用すれば状況は一変する。レイアウト、フォント、モーションといった視覚効果はすべて構造化されたタグによって実現できるため、モデルは推論しやすい環境でタスクを遂行できるのだ。

HTML タグには言語自体に意味が組み込まれています。見出し、チャート、グリッド、ブラウザがそれらすべてをピクセルに変換します。つまりモデルは座標を直接配置するのではなく、あらゆる種類の視覚効果を実現できます。

編集形式の自由化：HTML で作成し、PDF で出力

ここで重要なのは、「最終的な出力形式」と「中間の編集プロセス」を切り離す発想だ。多くの人がスライド資料を作る際、PowerPoint というツールそのものと、スライドデッキというコンテンツを混同している。

PowerPoint はスライドデッキを作るためのツールに過ぎません。スライドデッキ自体はプレゼンテーションモードのことです。そして、観客が気にするのは、どうやってそのモードに至ったかではありません。

編集形式は完全に任意だ。AI が得意とする HTML でドキュメントやスライドを構築し、必要に応じて PDF や画像など別の形式へレンダリングすればよい。これにより、ブランド準拠のデザインや複雑なレイアウトも自動化可能になる。

Nori の事例では、このアプローチを採用している。取締役会資料、営業資料、社内文書、そして動画に至るまで、すべて HTML と CSS で構築されている。究極的には、div タグの積み重ねに過ぎないが、わずかな構造と色彩を加えるだけで、ほぼすべてのコンテンツが劇的に改善される。

美しいプレゼン資料そのものは、それだけでは価値があまりありません。それでもなお、その中身を実際に詰めるためのコンテンツや要素を揃えに行く必要がありますよね？

AI エージェントにデータ（通話記録、メールなど）へのアクセス権を与えれば、モデルは資料の作成を最初から最後まで行える。人間はビジョンとストーリーに集中し、地味なレイアウト調整やブランディング作業は AI に任せる。これこそが、生産性を劇的に向上させるワークフローの変革だ。

まとめ：ユーザーのように考えず、モデルのように思考せよ

通勤中の地下鉄でスマホ一つから取締役会向けの資料全体を作成できる時代が来ている。その鍵は、AI に人間のような視覚的思考を求めないことだ。適切な言語（HTML）を与えれば、グラフィック作成にはそれだけで十分である。

ユーザーのように考えないでください。モデルのように考えてください。適切な言語を与えれば、グラフィックには HTML だけで十分です。

コーディングエージェントの適用範囲をコード生成から視覚コンテンツ制作へと広げることで、企業内のドキュメント作成やプレゼン資料制作のワークフローは根本的に変革されるだろう。開発者が手動でレイアウト調整を行う必要性を排除し、AI が構造的思考に基づいて即座に高品質なビジュアルを生成できる環境が現実のものとなっているのだ。