生成的UIでインタラクティブエージェントを作る

The Batch / 2026/5/7

💬 オピニオンDeveloper Stack & InfrastructureTools & Practical UsageModels & Research

原文を読む →

共有:

要点

この記事は「生成的UI」という考え方を用いてインタラクティブなエージェントを作ることに焦点を当てた短期・中級レベルのコースを紹介しています。
認定/指導はAtai Barkaiが担当し、約1時間25分の実践的なトレーニングとして位置づけられています。
コースの題名が示す通り、UIを単なる固定の見た目として扱うのではなく、生成的なUI主導の対話でエージェント体験を設計することを重視しています。
提供された本文は主にプロモーション（ランディングページ）要素ですが、開発者がエージェント体験を一連で作り込むことに関する内容であることがうかがえます。

短期コース中級1時間 25分

生成UIでインタラクティブエージェントを構築する

講師: アタイ・バルカイ

今すぐ申し込む

中級

1 時間 25 分

8 件のビデオレッスン

5 つのコード例

講師：アタイ・バルカイ

CopilotKit

学べること

Generative UI スペクトラムにおけるエージェント・インターフェースを構築する3つのアプローチ（Controlled、Declarative、Open-Ended Gen UI）を理解し、それぞれをいつ使うべきかを学びます。
LangChain のエージェントを CopilotKit と AG-UI プロトコルを使って React フロントエンドに接続し、エージェントが必要に応じてチャート、カード、フォームを描画するフルスタックのエージェントアプリを構築します。
MCP Apps を使ってエージェントをサードパーティのアプリケーションに接続し、その後チャットウィンドウを超えて、エージェントとユーザーが同じデータを並行して扱う製品を構築します。

このコースについて

CopilotKit の共同創業者であり、AG-UI プロトコルのチームでもあるアタイ・バルカイによって教えられる「Generative UI でインタラクティブなエージェントを構築すること」を紹介します。

現在のほとんどのエージェントは、まだユーザーとただのテキストで会話しています。しかしユーザーは、応答を読むだけではなく、見て操作できる何かを求めています。このコースでは、そのインタラクティブ性の作り方を学べます。つまり、エージェントが必要に応じてチャート、フォーム、ホワイトボード、インタラクティブなコンポーネントを描画する、フルスタックのエージェントインターフェースを構築します。

あなたは、Generative UI スペクトラムの全領域にわたって取り組みます。精密に制御できる手作りのコンポーネントから、エージェントがビルディングブロックから組み立てる宣言型レイアウトまで、さらに MCP Apps によって駆動される、終わりのない（オープンエンドな）体験まで対応します。最後には、共有データをもとにエージェントがユーザーと並行して作業するキャンバスアプリケーションを構築します。最終的に、CopilotKit と AG-UI を土台にした、本番投入可能なフルスタックのエージェントを手に入れます。AG-UI は、LangGraph、Google、AWS、Microsoft などにまたがる、第一者による統合を備えたオープンプロトコルです。

詳細には、あなたは：

Generative UI スペクトラムの3つの柱と、それぞれをいつ使うべきかを学びます。
CopilotKit と AG-UI を使って、LangChain Deep Agent と Google ADK Agent を React フロントエンドに接続します。
Controlled Generative UI を構築します。エージェントが要求に応じてレンダリングする、円グラフやフライトカードのようなカスタムコンポーネントを定義します。
Google と共同開発したオープン仕様 A2UI を使い、エージェントが再利用可能なビルディングブロックのカタログからレイアウトを組み立てられるようにします。
エージェントを MCP Apps に接続し、エージェントが最初から作り出す、完全にオープンエンドなインターフェースを探索します。
チャットウィンドウの外まで含めて、エージェントとフロントエンドがライブ状態（ステート）を共有するキャンバスアプリを構築します。

コースを通じて、オープンソースの AG-UI プロトコルに基づいて学習します。そのため、これらのスキルはエージェント型エコシステム全体にわたってあなたと一緒に活用できます。

参加すべき人は？

より豊かで、よりインタラクティブなユーザー体験を作りたいと考えている AI エージェント開発者。React と Python に慣れていることが推奨されます。また、AI エージェント、または LLM アプリケーション開発に関する基本的な理解があると役立ちます。フルスタック開発者、AI エンジニア、そしてフロントエンド寄りのビルダーが、エージェント機能を本番アプリに組み込んで出荷するのに適しています。