AI News

Figma 與 OpenAI 透過原生 Codex 整合縮小設計與開發之間的差距

在一個有望重新定義產品開發生命週期的里程碑式舉措中,Figma 宣佈與 OpenAI 建立策略合作夥伴關係,將 AI 驅動的程式碼代理 Codex 原生整合到其設計平台中。這項合作於 2026 年 2 月 26 日發佈,引入了一種無縫的雙向工作流,允許團隊在視覺設計與生產就緒程式碼之間流暢切換,有效地拆解了長期以來分隔設計師與開發者的傳統孤島。

此整合利用了 Figma 的模型內容協定(Model Context Protocol, MCP)伺服器,這項技術充當通用翻譯層,使 Codex 能夠深入理解設計文件背後的結構、邏輯與意圖。透過將此功能直接嵌入 Figma Design、Figma Make 和 FigJam,兩家公司正將其平台定位為數位產品創作的統一作業系統。

線性「交付」(Hand-off)的終結

多年來,「交付」(hand-off)——即設計師將靜態模型交給開發者的時刻——一直是個摩擦點,經常導致誤解與細微差別的丟失。這項新的合作夥伴關係旨在透過以持續的循環工作流取代線性交付來消除這種摩擦。

此整合支援雙向運作。首先,開發者可以使用 Codex 檢查 Figma 文件,並立即生成乾淨、基於組件的程式碼,同時遵循專案特定的設計權杖(design tokens)和約束。與以往基於外掛程式的解決方案不同,這種原生整合允許 Codex 「看到」設計上下文——包括間距(padding)、排版變數和互動行為——從而生成幾乎可以直接用於生產環境的程式碼。

相反地,該工作流也支援「程式碼到設計」的功能。開發者可以將程式碼片段或邏輯輸入 Codex,隨後便會在 Figma 畫布上生成可編輯的 UI 元素。這使得工程團隊能夠在設計師觸碰像素之前就將後端更改或新功能視覺化,營造一個真正的協作環境,其中真實來源(source of truth)既可以是程式碼,也可以是畫布。

幕後推手:MCP 的力量

此整合的技術骨幹是模型內容協定(Model Context Protocol, MCP)。產業專家將 MCP 描述為「人工智慧的 USB 接口」,它為 AI 代理與外部工具和數據源進行交互提供了一種標準化方法。

透過 Figma MCP 伺服器,Codex 獲得了對設計文件內元數據的即時訪問權限。它不僅僅是分析像素;它還讀取自動佈局框架(auto-layout frames)的層級結構,識別命名的組件,並引用團隊的設計系統庫。

OpenAI 的 Codex 產品負責人 Alexander Embiricos 強調了這種架構轉變的重要性。「這次整合使 Codex 對於更廣泛的建構者和企業來說變得強大,因為它不預設你首先是『設計師』還是『工程師』,」Embiricos 表示。「工程師可以在不離開流程的情況下進行視覺化迭代,而設計師可以更接近實際實作,而無需成為全職程式設計師。」

對產業的策略影響

這一公告發佈於 AI 開發領域的關鍵時刻。就在一週前,Figma 宣佈了與 Anthropic 的 Claude Code 的類似整合,標誌著其在成為 AI 輔助產品開發中心樞紐的同時,保持模型無關(model-agnostic)的策略。然而,與 OpenAI 合作的深度,利用了 Codex 廣泛的採用率——在其獨立 MacOS 應用程式發佈後,Codex 的週活躍用戶最近突破了一百萬——暗示了這兩家科技巨頭之間特別緊密的結盟。

Figma 首席設計長 Loredana Crisan 強調了此次合作的創意潛力。「透過這次整合,團隊可以基於他們最好的想法進行構建,而不僅僅是他們的第一個想法。透過將程式碼的優點與 Figma 無限畫布所帶來的創意、協作和工藝相結合,」她指出。

此舉還應對了企業對「AI 素養」日益增長的需求。透過將代理程式編碼工具引入視覺介面,Figma 有效地降低了軟體開發的入門門檻,允許產品經理和設計師直接為原型設計和實驗貢獻程式碼庫。

工作流效率的新標準

傳統產品開發工作流與這種新型 AI 整合模式之間的對比非常鮮明。過去團隊依靠標註線(redlines)、螢幕截圖和冗長的 Jira 工單來溝通意圖,而 Figma-Codex 整合則實現了邏輯翻譯的自動化。

下表概述了此合作夥伴關係實現的工作流關鍵轉變:

表格:傳統工作流 vs. Figma + Codex 整合

功能/流程 傳統工作流 Figma + Codex 工作流
程式碼生成 根據視覺參考手動轉錄 透過感知 MCP 的 AI 立即生成
上下文感知 有限;依賴開發者的理解 完全訪問設計權杖和層級結構
方向性 線性(設計 → 程式碼) 雙向(設計 ↔ 程式碼)
更新 設計變更後需要手動重新同步 持續更新;程式碼隨上下文重新生成
原型設計 靜態點擊跳轉或獨立的程式碼 POC 從畫布產生的功能性程式碼原型

展望未來

隨著該整合在未來幾週內推廣至企業用戶,業界將密切關注這將如何影響團隊結構。從程式碼生成 Figma 設計以及反向操作的能力表明,未來「設計師」和「前端工程師」的角色可能會模糊,轉變為混合型的「產品建構者」(product builder)角色。

雖然治理和防護欄(guardrails)仍然至關重要——特別是為了確保 AI 生成的程式碼符合安全和效能標準——但 Figma 與 OpenAI 的合作代表了向未來邁出的一大步,在那個未來,想法與執行之間的距離將以秒計,而非以衝刺週期(sprints)計。

精選