MCP Apps:AIのUIが「標準化」された日(AI UIのHTML化)

に公開

背景:標準化されていなかった世界


これまで、AIの会話内にインタラクティブなUIを埋め込む試みは存在した。

結果として、各社が独自実装を積み上げ、互換性のない世界が広がっていた

何が変わったのか

MCP Appsは、これまでの知見を統合した「オープンスタンダード」として登場した。

そして重要なのは、単なる仕様公開ではなく、主要プレイヤーが同時にサポートを表明したこと。

Anthropicがリーダーシップを取り、OpenAI / Microsoft / JetBrains / AWS / Block などが並んだ。

Claude、ChatGPT、VS Code、Goose…

主要なAIクライアントが同じ規格で動く

一度作れば、どこでも動く。
標準化の力。HTMLがWebを統一したように、MCP Appsは「AIのUI」を統一する可能性を持つ。

何ができるようになるのか(UXの変化)

  • 従来:
    AIに「Jiraでタスク作って」 → テキストで結果が返る → 結局Jira/Asanaを開いて確認

  • これから:
    AIに頼む → JiraのUIがチャット内に出現 → その場で編集・確認・送信

Figmaでダイアグラム作成、Slackメッセージのプレビュー、データのインタラクティブな可視化...
すべてが会話を離れずに完結する。

仕組み:アーキテクチャ概要

MCP Appsは大きく3つで構成される。

Server(MCPサーバー)

通常のMCPサーバーに加え、ui:// スキームでUIテンプレート(HTML/JS)を宣言する。
ツール定義に _meta.ui.resourceUri を追加するだけで、そのツールはUI対応になる。

Host(AIクライアント)

Claude、ChatGPT、VS Code等。
ツール呼び出し時にUIリソースをフェッチし、サンドボックス化されたiframeにレンダリングする。
Server-View間の通信をプロキシする役割も担う。

View(iframe内のUI)

ユーザーが実際に操作するインターフェース。
postMessage経由のJSON-RPCでHostと双方向通信する。

仕組み:データフロー(重要ポイント)

  1. 検出: Host接続時、ServerがUI対応ツールを公開
  2. 初期化: HostがUIをiframeに描画。Viewはテーマ・画面サイズ・言語等のコンテキストを受け取る
  3. データ配信: Hostがツール引数と実行結果をViewに送信
    結果はモデル用テキストとUI用データに分離
  4. インタラクション: ユーザー操作をViewが処理。その操作内容がAIの文脈にリアルタイムで反映される
  5. 終了: アンマウント時、Hostが通知しViewが状態を保存

重要:ユーザーの操作はリアルタイムでAIの文脈に反映される。
AIは「ユーザーが何を見て、何をしたか」を把握しながら、次のアクションを判断できる。

仕組み:セキュリティモデル(エンプラ前提)

多層防御で設計されている。

  • iframeサンドボックス: HostのDOM・Cookie・Storageへのアクセス不可
  • CSP宣言: Serverが外部接続先を明示。未宣言ドメインへの通信は遮断
  • 監査可能な通信: UI-Host間メッセージはJSON-RPCでログ可能
  • ユーザー同意: UI起点のツール呼び出しに承認を要求可能

仕組み:Progressive Enhancement(後方互換)

MCP Appsは後方互換性を重視している。

Host接続時にUIサポートの有無をネゴシエーションし、非対応Hostでも、ツールはテキストレスポンスとして正常に動作する。

UIは「必須要件」ではなく、「漸進的拡張」。

なぜ標準化が重要なのか

ChatGPT Apps SDKは優れていた。しかし、ChatGPTでしか動かなかった。

開発者は各プラットフォーム向けに個別の実装を強いられ、SaaSベンダーは対応コストで断念された。

MCP Appsは違う。

オープン規格であることが、エコシステムの成長速度を変える。

Asana、Figma、Slack、Amplitude、Box、Canva。

主要SaaSがすでに対応を発表している。標準だからこそ、この速度で採用が進む。

何が起きようとしているのか

SaaSの在り方が変わる。

  • 今まで:ユーザーがアプリに行く
  • これから:アプリがユーザーの会話に来る

MCP Apps非対応のツールは、AIワークフローから取り残されるリスクがある。
プラットフォームの重心が、確実に移動している。

そして、AnthropicとOpenAIが協力してこの標準を推進している。
競合が手を組むほど、重要な転換点だと言える。

エンジニア・デザイナーへの示唆

「UIを作る」の定義が拡張される。

アプリ内に閉じたUIから、AIの会話に埋め込まれるUIへ。

求められるのは、人間×AI×ツール の三者関係を設計するスキル。

やっと標準化された。

リソース

MCP Apps公式ブログ(2026-01-26)
https://blog.modelcontextprotocol.io/posts/2026-01-26-mcp-apps/
ext-apps(SDK / examples)
https://github.com/modelcontextprotocol/ext-apps

Discussion