Flutter GenUI SDK 公開上架 A2UI v0.9——靜態 App 畫面不再是唯一選項的那一天

Google I/O 2026 真正在改變我們團隊下一季 roadmap 的，不是 Gemini 3.5 Flash，也不是 Search 框重新設計。是 GenUI SDK for Flutter 安靜地上架到 pub.dev，搭配同一週公布的 A2UI v0.9——一份開放的、跨框架的協定。兩者合在一起回答了一個 AI in apps 這兩年一直在閃躲的問題：當代理人想讓使用者看到一個 slider、一個日期選擇器、一個多步驟表單、一張地圖、一條結帳流程的時候，要怎麼做才不必每次都重新發明一套脆弱、針對單一 App 的 schema？

如果你出貨 Flutter App，又把 LLM 接進去玩過一陣子，你知道我在說什麼。代理人給你一大段 markdown。你跟它要「rich」回應，它給你一張帶按鈕的卡片。你跟它要「可互動 widget」，它給你一條 chip 輪播。模型有表達意圖的能力，框架卻沒有給它一套表達意圖的語言。從 Flutter 3.44 開始，這個缺口被補起來。

一、GenUI 跟 A2UI 到底是什麼

A2UI 是一份開放協定，0.9 版在 I/O 2026 那週發布。它用 JSON 定義一套詞彙，讓代理人宣告一個 UI 表面：元件、佈局、狀態、事件處理。它刻意不綁框架——任何 client（Flutter、React Native、原生 iOS/Android、Web）只要實作一個 A2UI runtime，就能消費同一份宣告。

GenUI SDK for Flutter 是第一個第一方 A2UI runtime。代理人吐 A2UI JSON；SDK 把每個宣告的元件對應到你註冊的 widget 目錄裡的 widget（你自己的元件、你的家規、你的 a11y pattern）；widget 渲染出來；使用者互動；狀態變化串回代理人；代理人決定下一步。這個迴圈頻寬很高——代理人看得到使用者做了什麼，並能反應。

關鍵是：代理人不能畫任意像素。它從你註冊的 widget 目錄裡組 UI。你的按鈕、你的間距、你的暗色模式、你的多語系。「生成式」的部分是「組合」，不是「樣式」。這是讓整件事能在 production 跑的關鍵設計決策：設計師或品牌團隊把目錄出貨一次，代理人就永遠被約束在裡面。

GenUI SDK 套件下載量從年初到現在已經漲了大約 500%，而那是 I/O 2026 公布 A2UI v0.9 之前。預期下個月還會再一次跳級。

二、為什麼這對 Laravel + Flutter 工作室特別有意義

我們合作的多數工作室與 in-house 團隊跑同一套架構：Laravel 後端對外提供 JSON API、Flutter App 在 iOS 與 Android 端消費、最近不知怎地被接上一個 LLM——通常是一個會在原本 UI 上拉開抽屜的聊天框。聊天框 pattern 老化得很快。使用者不想打字說「把我上一張發票顯示成美金不是日圓」，他們會想點一下幣別切換器。他們想要代理人「把切換器放到他們眼前」。

GenUI 讓你正好能做到這件事。你的 Flutter App 把 widget 目錄向 SDK 註冊。你的 Laravel 後端開出 MCP 風格或代理人可呼叫的端點，讓 LLM 能打。代理人的回應是一份 A2UI 文件，不是一塊 markdown blob。Flutter App 在原本的畫面內部直接 inline 渲染它——不是放進聊天抽屜。

架構上的意涵很大。「頁面」不再是 UX 的單位。一個頁面變成幾個 slot，代理人可以針對當下的任務組一個小巧、目的明確的 widget 塞進去。Laravel 後端的工作從「渲染一個固定 view-model」轉為「把資料與動作能力給代理人，讓代理人去組這個表面」。這是一次有份量的重構，但這也是每一個主要 App——Toyota RAV4 儀錶板、talabat 的雜貨流程、LG 的 webOS——現在公開往那個方向走的方向。

三、這禮拜就能跑得起來的具體建置模式

我們週末原型出來、能站得住的食譜，是三層。

第一層是 widget 目錄。 把你的 App 真的在用的 20 到 40 個 widget（button、text input、currency input、date picker、address form、含 avatar 的清單、地圖預覽…）抓出來，每一個用穩定的名字加上 props schema 註冊到 GenUI SDK。把目錄當合約對待——慢慢加、永遠不刪、做版本管理。

第二層是工具層。 你的 Laravel 後端開幾個少量、代理人可呼叫的端點——讀發票、列商品、更新偏好等等。這些是代理人能造成的唯一副作用。即使代理人是唯一的消費者，也當公開 API 寫。

第三層是代理人本身。 把 Gemini 3.5 Flash（或 Claude Sonnet 4.6，或你偏好的任何模型）接上 GenUI SDK 的回應格式。代理人的 system prompt 告訴它：當使用者意圖是「想知道資訊」，回散文；當使用者意圖是「想做某件事」，回一份 A2UI 文件，從註冊目錄裡組 widget，並把事件處理指向你的工具端點。

這個三層 pattern 在我們自家測試的結果：原本要 5 到 8 個 chat turn 才會完成的中位數任務，現在 1 個訊息加 1 次 widget 互動就解掉。代理人完全不必「解釋」表單——它直接把表單秀出來。

四、talabat 與 RAV4 這兩個訊號

有兩個值得研究的早期 production 案例。

talabat——MENA 地區最大的餐點與雜貨外送 App——本月稍早完成轉移到統一 Flutter codebase，並安靜地在試跑一個 A2UI 風格的購物車助理。Flutter showcase 頁面所述的 pattern 就是上面那一套：助理看你過去的訂單、你的飲食限制、現在的時間，然後「渲染一個你可以編輯的購物車」，而不是把選項唸給你聽。試跑期的轉換率提升是兩位數；提升被歸因於拿掉了「唸出聲」這一步。

Toyota 2026 年 RAV4 出貨的車機使用 Flutter 渲染的 stack，已經在 production。Toyota 團隊從早期就是 A2UI 的專案夥伴；長期目標是讓車內 AI 助理能依照當下駕駛情境，畫出對的控制表面——空調、導航、EV 路線——而不必讓駕駛在選單裡翻找。車這個案例是 A2UI 不只是「手機限定」這件事的存在證明。

五、策略上的解讀

這背後有比「Flutter 出了一個新套件」更大的故事。代理式 App pattern 過去兩年的瓶頸一直在 UI 端。每一家主要模型公司都在加工具呼叫、規劃、記憶、computer use。輸出通道卻一直停留在「文字加幾顆 inline 按鈕」。A2UI 修的就是輸出通道——它給代理人一個型別化、schema 驗證過的方式，在 host App 內部畫出真的可互動表面。

如果 Google 賭對，預期下一季會看到 React Native（社群）、SwiftUI（Apple 自己出，可能在 WWDC 2026）、Jetpack Compose、web React 的 A2UI runtime。不論這個生態系最後怎麼標準化，「我們維護一份 widget 目錄、我們開出工具、我們讓代理人去組」會變成有 AI 能力的 App 的新預設架構。

六、要盯的三個風險

不是乾淨的勝利。三個風險值得注意。

目錄紀律。 如果你的 widget 目錄飄移——元件改名、props 改、被廢棄的條目留著——代理人幻覺的代價會很貴。目錄需要跟對外 API 一樣的版本管理 hygiene。

狀態同步。 A2UI 會把狀態變化串回代理人。如果你讓代理人視角的狀態過時（網路斷線、使用者很慢），它會提出已經沒意義的動作。從第一天就把 SDK 的狀態調合 primitive 納入設計，不要事後補。

成本。 每次代理人渲染的互動都是一次模型呼叫。如果你讓代理人在每次點擊都重新渲染，你的 token 帳單就會變成一條獨立的成本項目。正確的架構決定是讓代理人渲染一次表面，後續由表面驅動一般 API 呼叫，直到使用者意圖改變。SDK 支援這樣做；早期有些 demo 用錯了。

我的觀點

這是我過去兩年看到第一個我覺得會長出來的「AI 進 App」pattern。聊天抽屜 pattern 一直是個半套，遮掩了一個事實：我們之前沒有給代理人一套語言去「做」UI。現在有了。下一季就把這個 pattern 內化的 Flutter 工作室——註冊目錄、開工具、inline 渲染 A2UI——會在轉換率、任務完成時間、使用者滿意度上把其他人甩開。

特別給 Laravel/Flutter 代理商：遷移路徑很直接，交付物很具體。挑一個 App 裡的一個畫面，那個使用者目前會卡住的表單。把那一份表單換成由助理渲染的 A2UI 表面。量轉換率提升。用結果去向客戶賣後面的遷移。我們這禮拜在三個內部專案跑的就是這個實驗；早期數字很有說服力。