Uber用AI代理自動寫設計文件，幾分鐘就生成完整的元件規格文件

對大型企業來說，設計系統（Design System）的元件規格文件，往往是最難維護的一環。每當UI元件設計更新，相關文件也得更新，否則工程師很容易靠經驗去猜元件在不同狀態下怎麼運作，最後造成UI不一致或累積技術債。

為解決這個問題，Uber最近就打造一套AI代理（AI Agent）工具uSpec，可透過MCP直接讀取Figma設計檔、自動生成元件規格文件，讓原本可能需要幾周才完成的文件整理工作，縮短為幾分鐘。

一個按鈕背後，其實有大量文件要維護

在設計系統中，一個看似簡單的UI元件，其實有大量文件要維護。以最常見的按鈕（Button）為例，一份完整規格不只描述外觀，還包括元件結構、可設定參數、不同狀態、變體，以及顏色Token和尺寸規則等。

更複雜的是無障礙設計，因為同一個元件還得交代清楚，如何在iOS、Android和網頁上，讓輔助功能正確理解與朗讀，例如對應到VoiceOver、TalkBack與ARIA等不同機制。

但這還只是「一個」元件。Uber指出，他們的設計系統有好幾百個元件，而且每個元件通常得對應7種技術平臺的實作，例如UIKit、SwiftUI、Android XML、Android Compose、React Web等。換句話說，同一個元件的規格文件，往往得同時涵蓋多個平臺的實作方式。

只要元件設計更新，相關文件就得同步修改。長期下來，文件維護自然成了一項大工程。

AI代理直接讀取Figma設計檔，自動生成規格

為減少人工整理文件的負擔，Uber設計系統團隊開發了uSpec工具。

它的使用方式很簡單，設計師只需在AI開發工具Cursor IDE中貼上一個Figma元件連結，並補充一些背景資訊，例如元件狀態或平臺行為，AI代理就會透過Figma Console MCP連接到Figma設計檔，讀取元件結構、設計Token和變體設定，再依模板自動生成完整的規格頁面，並直接寫回Figma。

也就是說，AI可以在一次流程中，完成讀取設計到生成文件的工作。

MCP讓AI代理直接操作設計工具

這套系統之所以能運作，關鍵在於Figma Console MCP，也就是AI代理和Figma之間的橋樑。它能讓AI代理直接讀取Figma中的元件結構、樣式和變數，並把生成結果寫回檔案，例如生成表格或標註元件結構，而不是只讓AI代理看設計稿截圖。

Uber表示，這套工具的整個流程都在本地環境執行。比如AI代理在本機的Cursor IDE執行，並透過本地的WebSocket連接Figma Desktop，因此設計資料不會離開企業網路，確保資料隱私安全。

就成效來說，Uber以最複雜的無障礙規格為例，只要2分鐘，這套工具就能生成涵蓋iOS、Android和網頁等三個平臺的設定規格文件。

對Uber來說，這個應用反映出AI代理工具的新方向：AI不再只是生成文字或程式碼，而是開始直接操作企業軟體工具。透過像MCP這樣的橋接層，AI可以讀取工具內部資料、執行實際操作，例如更新設計文件或整理專案資料。

他們透露，接下來還會探索更多自動化功能，例如自動比對元件設計和規格文件、偵測文件是否過時，或是從程式碼反向生成規格文件。