Skip to content

Tide Pool / A2UI

Tide Poolはエージェント駆動のビジュアルワークスペースで、Triggerfishがインタラクティブなコンテンツを レンダリングします:ダッシュボード、チャート、フォーム、コードプレビュー、リッチメディア。 チャットが線形的な会話であるのとは異なり、Tide Poolはエージェントがコントロールするキャンバスです。

A2UIとは何か?

A2UI(Agent-to-UI)はTide Poolを動かすプロトコルです。エージェントがビジュアルコンテンツと 更新をリアルタイムで接続されたクライアントにプッシュする方法を定義します。エージェントが何を 表示するかを決定し;クライアントがそれをレンダリングします。

アーキテクチャ

Tide Pool A2UIアーキテクチャ:エージェントがGatewayを通じて接続されたクライアントのTide Poolレンダラーにコンテンツをプッシュ

エージェントはtide_poolツールを使用してGatewayで実行されているTide Pool Hostにコンテンツを プッシュします。HostはWebSocketを通じてサポートされているプラットフォームの接続されたTide Pool レンダラーに更新を中継します。

Tide Poolツール

エージェントはこれらのツールを通じてTide Poolとインタラクトします:

ツール説明ユースケース
tidepool_renderワークスペースにコンポーネントツリーをレンダリングダッシュボード、フォーム、ビジュアライゼーション
tidepool_updateIDでコンポーネントのpropsを更新ビュー全体を置き換えずに段階的に更新
tidepool_clearワークスペースをクリアしてすべてのコンポーネントを削除セッション遷移、新しく開始

レガシーアクション

基盤となるホストは後方互換性のために低レベルのアクションもサポートしています:

アクション説明
push生のHTML/JSコンテンツをプッシュ
evalサンドボックス内でJavaScriptを実行
resetすべてのコンテンツをクリア
snapshot画像としてキャプチャ

ユースケース

Tide Poolはチャットだけでは不十分なシナリオのために設計されています:

  • ダッシュボード — エージェントが接続された統合からのメトリクスを表示するライブダッシュボードを構築します。
  • データビジュアライゼーション — クエリ結果からレンダリングされたチャートとグラフ。
  • フォームと入力 — 構造化されたデータ収集のためのインタラクティブなフォーム。
  • コードプレビュー — ライブ実行結果を持つシンタックスハイライトされたコード。
  • リッチメディア — 画像、マップ、埋め込みコンテンツ。
  • 共同編集 — エージェントがレビューや注釈のためにドキュメントを提示します。

仕組み

  1. 何かを視覚化するよう依頼する(またはエージェントがビジュアル応答が適切と判断する)。
  2. エージェントがpushアクションを使用してHTMLとJavaScriptをTide Poolに送信する。
  3. GatewayのTide Pool Hostがコンテンツを受け取り、接続されたクライアントに中継する。
  4. レンダラーがリアルタイムでコンテンツを表示する。
  5. エージェントがevalを使用してビュー全体を置き換えずに段階的な更新を行える。
  6. コンテキストが変わると、エージェントがresetを使用してワークスペースをクリアする。

セキュリティ統合

Tide Poolコンテンツは他の出力と同じセキュリティ強制に従います:

  • PRE_OUTPUTフック — Tide Poolにプッシュされたすべてのコンテンツはレンダリング前に PRE_OUTPUT強制フックを通過します。出力ポリシーに違反する分類データはブロックされます。
  • セッションtaint — レンダリングされたコンテンツはセッションのtaintレベルを継承します。 CONFIDENTIALデータを表示しているTide Poolはそれ自体がCONFIDENTIALです。
  • スナップショットの分類 — Tide Poolのスナップショットはキャプチャ時のセッションのtaintレベルで 分類されます。
  • JavaScriptのサンドボックス化evalを通じて実行されるJavaScriptはTide Poolコンテキスト 内でサンドボックス化されています。ホストシステム、ネットワーク、ファイルシステムへのアクセスはありません。
  • ネットワークアクセスなし — Tide Poolランタイムはネットワークリクエストを行うことができません。 すべてのデータはエージェントとポリシーレイヤーを通じて流れます。

ステータスインジケーター

TidepoolのWebインターフェースにはリアルタイムのステータスインジケーターが含まれています:

コンテキスト長バー

LLMのコンテキストウィンドウのどれだけが消費されたかを示すコンテキストウィンドウ使用量のスタイル付き プログレスバー。バーは各メッセージ後とコンパクション後に更新されます。

MCPサーバーステータス

設定されたMCPサーバーの接続ステータスを表示します(例:「MCP 3/3」)。 カラーコード:すべて接続されている場合は緑、一部は黄、なしは赤。

セキュアシークレット入力

エージェントが(secret_saveツールを通じて)シークレットを入力するよう要求したとき、 Tidepoolはセキュアな入力ポップアップを表示します。入力された値は直接キーチェーンに保存されます — チャットを通じて送信されたり会話履歴に表示されたりすることはありません。

Tide Poolをエージェントのホワイトボードと考えてください。チャットがエージェントとの

会話方法であるなら、Tide Poolはエージェントがものを見せる場所です。 :::