概要
https://qiita.com/Takenoko4594/items/4387782ff8310427048e
詳細内容
## AIエージェントがUIを生成する「Generative UI」を広く浅く理解したい #MCP
https://qiita.com/Takenoko4594/items/4387782ff8310427048e
整理する、AIエージェントが状況に応じて最適なUIを動的に提示する「Generative UI」の概念と、その実現に向けた2つの主要アプローチおよび最新の標準化動向を。
**Content Type**: Technical Reference
**Language**: ja
**Scores**: Signal:4/5 | Depth:3/5 | Unique:4/5 | Practical:4/5 | Anti-Hype:4/5
**Main Journal**: 75/100 | **Annex Potential**: 75/100 | **Overall**: 76/100
**Topics**: [[Generative UI, MCP, A2UI, AIエージェント, JSON Lines]]
「Generative UI」とは、AIエージェントがチャットボットなどの対話インターフェースにおいて、文脈に応じた最適なUIコンポーネント（カレンダー、グラフ、予約フォームなど）を動的に生成・表示する技術手法である。筆者は、商品購入やデータの可視化といった複雑な操作を伴うユースケースにおいて、従来のテキストベースのやり取りではユーザー体験（UX）に限界があることを指摘し、UIを介した直感的な操作を可能にする本技術の重要性を強調している。
本書では、Generative UIを実現するための現在進行形の技術スタックを、2つの大きなアプローチに分類して解説している。
第1のアプローチは「既存のUIセットから適切なものを選択する」方式である。これは事前に用意されたHTML/JS/CSS等の静的コンテンツをAIが状況に応じて引き出すもので、MCP（Model Context Protocol）を拡張して実装される。具体的には「Apps SDK」や「MCP-UI」といった実装が存在するが、現在はこれらを統合・標準化する「MCP Apps」の策定が進行中であり、実装の標準化に向けた期待が高まっている。
第2のアプローチは「AIエージェントがUIの定義情報を動的に生成する」方式である。AIが直接コードを生成するのではなく、JSON形式等でUIの構造を「宣言的」に定義し、フロントエンド側がその定義に基づいてレンダリングを行う。これまで「AI SDK UI」や「CopilotKit」が独自仕様を提供してきたが、2025年12月にGoogleが発表した共通プロトコル「A2UI (Agent to UI)」がこの領域の大きな転換点となっている。A2UIはJSON Lines形式でUIデータをストリーミング伝送する仕様であり、AIエージェントとUI側の疎結合な連携を可能にする。
筆者は、これら2つの潮流（MCP AppsとA2UI）がGenerative UIのデファクトスタンダードを形作っていく過程にあると分析している。エンジニアにとって、これはフロントエンド開発の役割が「固定された画面の構築」から「AIが生成する宣言的なUIデータの解釈・描画」へと進化していくことを示唆しており、次世代のAIアプリケーション構築において避けては通れない技術領域となっている。