跳至主要內容

在 Claude Design 中設定您的設計系統

今日已更新

建立設計系統可讓 Claude Design 產生符合您規格的輸出。它會從您提供的資產(程式碼庫、投影片組或其他設計參考資料)中提取可重複使用的元件、顏色、排版和模式,並將其作為在您帳戶內建立的每個專案的基礎。

Anthropic Labs 的 Claude Design 現已在研究預覽版中提供給 Pro、Max、Team 和 Enterprise 方案使用。此功能在 Enterprise 方案中預設為關閉。

本指南適用於將設定設計系統的設計師或品牌擁有者。您只需執行一次;設定後,所有團隊成員的專案會自動使用它(適用於 Team 和 Enterprise 方案)。

先決條件

  • 您的組織管理員授予的設計系統設定權限。

  • 至少提供以下其中一項作為來源資料:

    • 包含您的設計系統或元件庫的程式碼庫

    • 反映您視覺識別的投影片組或文件

    • 品牌指南資產(標誌、色彩調色板、排版規格)


步驟 1:建立或切換到您的組織

若要設定您組織的設計系統:

  1. 開啟 Claude Design

  2. 在專案選擇器的左下角,按一下目前的組織名稱。

  3. 選取您的組織,或建立新的組織。

  4. 您將被重新導向至上線流程。完成它。

步驟 2:上傳您的品牌和產品資產

在上線期間(或之後從您的組織設定),上傳定義您的品牌和產品的資產。Claude 將分析它們並提取可重複使用的設計系統。

要上傳的內容:

  • 程式碼庫:如果您的設計系統存在於程式碼中(例如 React 元件庫),您可以連結或上傳儲存庫。Claude 將讀取元件和樣式。

  • 原型:螢幕截圖、網頁流程和現有設計檔案。

  • 投影片組或文件:即使是反映您品牌的設計精良的 PowerPoint 或 PDF 也可以使用。Claude 會提取顏色、版面配置模式和排版選擇。

  • 個別資產:標誌、色彩調色板檔案、排版樣本。

您只需要一個來源即可開始,但提供多個來源可讓 Claude 有更多可用的資訊。

步驟 3:檢閱產生的設計系統

上傳後,Claude 會為您的組織產生設計系統 (UI 套件)。這通常包括:

  • 色彩調色板:從您的資產中提取的主要、次要和強調色。

  • 排版:字型系列、大小和粗細。

  • 元件:按鈕、卡片、導覽元素和其他可重複使用的 UI 模式。

  • 版面配置模式:間距、網格系統和頁面結構。

若要驗證您的設計系統,請建立測試專案,並查看輸出是否符合您的品牌期望。嘗試以下提示:

  • 「為 [您的產品] 建立登陸頁面。」

  • 「設計顯示 [相關指標] 的儀表板。」

  • 「製作關於 [您的團隊通常呈現的主題] 的簡報。」

步驟 4:將其提供給您的團隊

一旦您對設計系統品質感到滿意,請確保「已發佈」切換開關已開啟。發佈後,在您的組織中從 Claude Design 首頁建立的任何專案都將使用您的設計系統,而不是預設系統。


獲得最佳結果的提示

  • 包含真實範例,而不僅僅是規格。完成的登陸頁面或行銷網站比單獨的色彩調色板更能向 Claude 說明您品牌的感受。

  • 反覆運算。如果第一次提取未能很好地捕捉您的品牌,請嘗試上傳其他或不同的資產。

更新您的設計系統

品牌會演變。當您的設計系統變更時,您可以在 Claude Design 中更新它。從您的 Claude Design 組織設定,按一下您要編輯的設計系統旁邊的「開啟」按鈕。按一下右上角的「重新混合」按鈕,以在視窗左側開啟聊天介面。從這裡,您可以與 Claude 合作來變更您的設計系統。

是否回答了您的問題?