所有節目›AI Engineer Europe 2026| World's Fair 2026完整場次線上軌AI in HealthcareSoftware Factories
MCP UI: Extending the frontier在 YouTube 看這一場

AI Engineer Europe 2026 · 演講 · 2026-05-06 · 22 分

MCP Apps:讓介面直接長進聊天裡

MCP UI: Extending the frontier · Liad Yosef、Ido Salomon,MCP Apps

MCPUI 的兩位創作者 Ido 與 Liad 說明 MCP Apps 怎麼把各家服務的介面經由 MCP 送進聊天,控制權怎麼分,以及這對網站與 app 的意義。

聊天框之外看原片 ↗

概要

  • 文字回應的問題他們說 MCP tool 回傳一大堆文字,使用者看不出資料來自 Shopify、Booking 還是 Expedia,公司也不想被縮成一堵文字牆。MCP Apps 的做法是讓每家服務把自己的介面送進聊天。
  • 從 MCPUI 到官方擴充MCPUI 先在社群裡發展,後來與 Anthropic、OpenAI 合作,成為 MCP 標準的第一個官方擴充,也就是 MCP Apps。他們列出 VS Code、Cursor、Claude、ChatGPT、Microsoft Copilot 等 host 已經支援。
  • 介面與 host 的來回tool 回傳的是一個 resource,裡面是 HTML,host 把它放進 sandbox 渲染。使用者在介面上的每次點擊都以訊息傳回 host,由 host 決定要不要呼叫 server 的 tool,所以一切都留在對話脈絡裡。
  • 控制權是一條光譜訊息從只通知 host 發生了什麼事,到要求呼叫 tool,再到直接把 prompt 交給 host 處理,UI 讓出的控制越來越多。UI 的產生方式也一樣,從廠商寫死的、宣告式的,到模型現場生成的,MCP Apps 都不限制。
  • 規格還在長他們提到正在處理的兩件事,一是不要每次都重新渲染同一個 app,二是讓模型能操作介面上的按鈕與表單,並與 Google 的 A2UI 等協定做互通。
  • 新的發行管道他們認為這不只是協定,而是散布應用程式的新方式,並呼籲大家把它當成重新思考產品核心體驗的機會。

原話

  • “So they control the identity, the experience.”

    所以 identity 與體驗都由 PostHog 掌控

    ▶ 07:30
  • “Perhaps in two years we won't have browsers as we know them, we won't have websites as we know them.”

    也許兩年後,我們不會再有現在這種瀏覽器與網站

    ▶ 13:42
  • “If you build an MCP app, it runs everywhere.”

    做一個 MCP app,到處都能跑

    ▶ 18:14
  • “This isn't some protocol. This is a new way to distribute applications.”

    這不只是某個協定,而是散布應用程式的新方式

    ▶ 18:33

延伸

  • 他們說 800 million 的週使用者約是世界人口的 10%,網際網路花了大約 30 年才到這個數字。
  • 宣告式 UI(例如 JSON render)由 app 宣告結構、host 渲染元件,適合想統一外觀的 host。他們舉例,Claude 大概不想在同一段對話裡接連出現 Booking、Airbnb、Expedia 三種介面。
  • LibreChat 也是 MCP app 的 client,同一份程式碼在各個 host 上都能跑。

章節

點時碼直接跳到原片的那一段。

  1. 開場與自我介紹Ido 自稱是 MCPUI 的創作者、MCP Apps 的共同創作者與 maintainer;Liad 一起做 MCPUI,也共同創作了 MCP Apps 規格。
  2. 為什麼需要 MCP AppsChatGPT、Claude 等工具裡的互動應用其實就是 MCP Apps;純文字沒有身分,也是不少公司遲遲不把資料送進 ChatGPT 的原因。
  3. 從 MCPUI 到 MCP AppsMCPUI 想做的是讓 UI 能經由 MCP 傳送、並與 host 溝通;後來與 Anthropic、OpenAI 合作,把它放進 MCP 標準,成為第一個官方擴充。
  4. 採用情形與社群Shopify 與 Hugging Face 是 MCPUI 早期採用者;標準化後 VS Code、Cursor、Copilot、ChatGPT、Claude 等都支援,並有官方 repo 與固定開會的工作小組。
  5. 核心概念:UI 怎麼走 MCP以前 tool call 回傳文字,現在回傳 HTML resource 讓 host 轉成互動應用;UI 的操作訊息先回到 host,由 host 決定是否呼叫 server。
  6. Claude 上的 PostHog 示範同一個問題,舊做法得到一段文字,改用 MCP Apps 後出現 PostHog 自己做的漏斗圖,身分與體驗都由 PostHog 掌控。
  7. 生成式 UI 與互動問 Claude 漏斗是什麼,它會現場生成一個說明用的介面,點其中一步還能針對那一步追問。
  8. 整個流程怎麼運作server 註冊 resource,host 端是一個接收 resource 與 callback 的 React 元件,在 sandbox 中渲染,點擊事件一路回到模型,可再做 tool call 或後續訊息。
  9. 新的 web 與規劃紀念日的例子他們設想不必再開一堆網站,個人助理直接帶出 Google Calendar、Amazon、Booking 的介面片段,廠商保有身分,host 也不必自己生成每種 UI。
  10. 控制權的光譜服務不再掌握使用者的整段旅程;訊息從通知、tool call 到 prompt,UI 交給 host 的控制逐級增加。
  11. 規格演進與官方 SDK他們說 2026 年要把 MCP Apps 定成聊天裡 UI 的全球標準;規格仍在演進,官方 SDK 隨規格更新,並內建 skills 讓 coding agent 代勞。
  12. 接下來:少重繪、讓模型操作 UI每次都重新渲染對 Autodesk 這類重型應用太慢,正研究沿用同一個 view;另一方向是讓 app 暴露 tool,讓模型能點按鈕、填表單,相關 PR 還開著。
  13. UI 產生方式與互通預先定義、宣告式、模型現場生成三種都能用 MCP Apps;Claude 的即時生成 UI 就是串流進一個 MCP app;也在與 A2UI 等協定做互通。
  14. 新的發行方式他們引用 Sam Altman 的說法:ChatGPT 每週有 800 million 人使用,現在已經是 a billion,再加上 Claude 與 VS Code,潛在受眾至少是 App Store 剛上線時 iPhone 使用者數的 160 倍。
  15. 怎麼開始與參與server 端用官方 repo 與 skills,host 端用 MCPUI 的 client SDK(React 元件);也可以到 repo 開 issue、PR,或加入 Discord。
  16. 結語他們希望聽眾把「網站會消失」當成重新思考核心體驗的機會,一個 app 寫一次就能在各個 host 跑。

名詞

MCP Apps
MCP 標準的第一個官方擴充,讓 tool 回傳 HTML 介面,由 host 在 sandbox 裡渲染並雙向互動
MCPUI
Ido 與 Liad 先前做的社群專案,MCP Apps 的前身,也提供推薦的 client SDK
host
承載對話與渲染 MCP app 的一方,例如 Claude、ChatGPT、VS Code、Cursor
PostHog
示範用的例子,漏斗圖由 PostHog 自己做的元件呈現
A2UI
他們說是 Google 的生成式 UI 協定,正在做互通
WebMCP
他們提到的現有做法之一,用來讓模型操作網頁介面
Autodesk
他們舉的例子:重型應用每次重新渲染都很慢

相關影片 同屬「聊天框之外」