Figma:Claude 將概念快速轉為程式碼、一天可建一個網站

DW
分享
Figma:Claude 將概念快速轉為程式碼、一天可建一個網站

Figma 的工程師表示在 Anthropic 出現前,AI 模型明顯缺乏設計品味和個性,你讓它們生成設計,結果往往千篇一律,Claude 讓 Figma 擁有具設計品味的 AI 模型,簡化大量溝通修改流程,誠如黃仁勳所說,SaaS 軟體與 AI 非敵對關係,而是讓工作團隊更有效率的完成工作。

Figma 透過自然語言生成應用程式

Figma 產品經理 Alex Mullans 指出,傳統設計工作流程中,設計交付後常因實作限制而與原始構想產生偏差,透過將設計與程式碼生成整合於同個平台,團隊能在開發過程中持續維持對設計意圖的掌握,減少反覆溝通所帶來的成本。Figma 使用 Claude 的自然語言操作,讓設計師省下大量實作時間,將靜態設計轉換為具備互動行為的原型或應用程式,縮短從概念到驗證的距離。

Claude 為 Figma Make 提供支援,平台使用者可在不撰寫程式碼的情況下,快速建立可運作的互動原型或應用程式。設計師、開發人員與產品經理可在數分鐘內完成過去需耗費大量時間的工作,將重複性高、流程繁瑣的任務交由系統自動處理。Figma 指出這樣的模式讓團隊能投入更多時間於探索不同設計方向與產品構想,同時也讓非設計背景的成員能以視覺化方式表達想法,擴大參與設計流程的範圍。

廣告 - 內文未完請往下捲動

使用 Claude 可以在一天內建立網站

在選擇人工智慧模型時,Figma 著重於程式碼品質、對設計意圖的理解,以及執行速度之間的平衡,Mullans 表示 Claude 在多次評估中展現出穩定表現,能同時兼顧準確性與使用者需求。Figma 團隊也指出,Claude 在設計感上的表現,使生成結果不僅具備功能性,也較能符合設計美學。Figma Make 的產品經理 Holly Li 分享,她曾花費約 30 小時自學 React 建立網站,而在 Claude 的協助下,僅用一天便完成程式碼重構與功能擴充。

Holly Li 表示Claude 每次更新都帶來顯著改進,現在只需一個提示就能生成包含漸變、多樣化字體和巧妙動畫效果的精美設計,Figma 團隊裡的設計師甚至說:Claude 太棒了,感動得想哭了。

Claude 讓自然語言驅動程式,帶來設計大革命

Figma 將 Claude 整合在 「Figma Sites」、「Figma Make」兩款產品中,讓程式碼驅動創意概念、快速轉為設計。設計師可在 Figma Sites 中以自然語言為既有設計加入互動效果,而 Figma Make 則能根據文字描述或既有設計檔案,生成包含邏輯、動畫與響應式的設計原型與應用程式。

  • Figma Sites:設計師可透過描述他們的需求,為現有的網站設計添加互動性,只需選擇元素、輸入自然語言提示,例如,「添加滑鼠懸停時傾斜的效果」,Claude 就能快速產生高品質程式碼,同時保留原始設計的細節。
  • Figma Make: 根據描述現有的 Figma 設計創造互動式原型或應用程式。Figma Make 可以將想法轉化為真正的軟體,設計原型可從零開始,也可選擇 Figma 中創造的現有設計開始執行, 使用者輸入描述需求的提示,或者從 Figma Design 複製他們像素級精細的​​模型,讓 Claude 轉換成具有複雜邏輯與動畫的完整原型。

人工智慧正在改變美術設計師的工作方式,透過簡單提示即可生成互動體驗,設計與開發團隊不再需要手動建立原型或撰寫大量程式碼,就能快速驗證設計方向,這項發展讓設計師與開發工程師之間往來繁瑣的溝通問題獲得解決。

風險提示

加密貨幣投資具有高度風險,其價格可能波動劇烈,您可能損失全部本金。請謹慎評估風險。