Generative UI

ジェネレーティブUIとは何か、AIデザインツールでUIを作ることとどう違うのか？

ジェネレーティブUI（generative UI）とは、インターフェース自体が実行時にAIによって生成・調整されることを指す。ユーザーが何をしているかに応じて、AIがどのコンポーネントを出し、どう並べ、どんなインタラクションにするかを決める。よくある定義は、UIの一部がAIエージェントによって実行時に生成、選択、または制御されるというものだ。

v0、Lovable、Figma AIのようなツールとの違いは時点にある。それらは開発段階で固定のインターフェースを作る手助けをし、完成したら出荷する。ジェネレーティブUIは利用時に働き、操作のたびに異なる画面になりうる。

なぜジェネレーティブUIが登場したのか、何を解決しようとしているのか？

従来のインターフェースは「平均的なユーザー」向けに設計された固定レイアウトだが、ユーザーの目的は毎回違う。素早く数字を知りたい人もいれば、三つの選択肢を比べたい人もいる。AIアシスタントが普及すると、AIがその場の意図を理解できるなら、インターフェースも合わせて変わるべきではないか、という自然な疑問が生まれた。テキストや固定フォームを返し続けるのではなく。

Googleが2025年末に公開したA2UI仕様は、エージェントがフォームやスライダーのようなインラインウィジェットを生成できるようにするもので、GeminiのDynamic Viewもプロンプトから対話型UIを生成する。どちらも、何を表示するかの判断の一部をAIに委ねるという同じ流れの具体例だ。

ジェネレーティブUIは具体的にどう動くのか？

CopilotKitの整理では、AIにどれだけの自由を与えるかで三つのパターンに分けられる。静的パターンでは、アプリがUIを持ち、エージェントは事前に定義されたコンポーネントを選んでデータを入れるだけだ。宣言的パターンでは、エージェントが構造化されたUI記述（カード、リスト、フォーム）を返し、フロントエンドが自分のスタイル規則で描画する。開放的パターンでは、エージェントがUI領域全体を提供し、フロントエンドは主にそれを載せるだけだ。

前者から後者に向かって制御は減り、自由度は増す。関連技術には、Googleの宣言的仕様A2UIや、エージェントとフロントエンドの間の双方向イベントプロトコルAG-UIなどがあり、層が異なるため互いに置き換えるものではない。

デザイナーやプロダクトチームにとって実際の影響は何か？

最大の変化は、デザインの対象が一つの固定画面から、一組のルールに移ることだ。AIが選んでよいコンポーネントはどれか、変えてよい領域はどこか、変えてはいけないものは何か。Elekenの記事が挙げるリスクには、筋肉記憶が壊れること（開くたびに見た目が違えば学び直しが必要になる）、同じプロンプトでも同じUIになるとは限らないこと、AIの幻覚が誤ったコンポーネント挙動を招くこと、そして整理され制約されたデザインシステムがないと生成物が不統一になることがある。

同記事が勧める折衷案はハイブリッドUIで、全体のナビゲーションと構造は安定させ、特定の領域だけを適応させる。高リスクなタスクでは、慣れた予測可能なUIを保つ。