Anthropic Labs 的 Claude Design 讓您可以透過與 Claude 對話來建立設計、互動式原型、簡報等。本指南將引導您建立第一個專案、反覆改進設計，以及充分利用該工具。
Anthropic Labs 的 Claude Design 現已在研究預覽版中提供給 Pro、Max、Team 和 Enterprise 方案使用。此功能在 Enterprise 方案中預設為關閉。
本指南假設您的組織設計系統已經設定完成，因此您建立的所有內容都會自動使用您品牌的顏色、排版和元件模式。如果您是需要設定或修改設計系統本身的設計主管，請參閱 在 Claude Design 中設定您的設計系統。
Claude Design 的運作方式
Claude Design 有兩個主要區域：左側的聊天介面和右側的畫布。您在聊天中描述您想要的內容，Claude 會在畫布上產生可運作的設計。從那裡，您可以反覆改進—透過對話和內嵌註解進行精煉，直到完美為止。
典型的流程是：
建立專案並新增任何相關內容（螢幕截圖、程式碼庫）。
描述您想要建立的內容。
檢視 Claude 在畫布上產生的內容。
使用聊天訊息和內嵌註解進行反覆改進。
當您對結果滿意時，匯出或分享。
建立新專案
當您建立專案時，它會自動繼承您組織的設計系統。您不需要上傳品牌資產或設定任何內容—您的品牌顏色、字型和元件已經就位。
為您的專案新增內容
您提供給 Claude 的內容越多，您的輸出就會越好。您可以在專案的任何時間點附加參考資料。
螢幕截圖、影像或現有資產：上傳現有設計、競爭對手產品、線框圖或視覺靈感的螢幕截圖。您也可以附加現有的投影片組或包含您想要複製的設計風格的文件。適用於「讓它看起來像這樣」的請求。
程式碼庫和現有設計檔案：連結程式碼儲存庫，以便 Claude 了解您現有的元件、架構和樣式模式。這使得原型從一開始就更接近生產就緒。匯入也支援多種方式來上傳現有的產品設計工作。
撰寫有效的提示
您不需要是設計師就能獲得出色的結果。請具體說明您正在建立的內容、它的目標使用者以及最重要的事項。
好的提示包括目標（您正在建立的內容）、版面配置（事物應如何排列）、內容（要顯示的資訊）和受眾（誰將使用它）。如果 Claude 需要更多資訊，它也會提出澄清問題。
以下是一些效果良好的提示範例：
「建立一個顯示月度收入的儀表板，並提供地區和產品線的篩選器。」
「設計一個行動應用程式入門流程，包含 4 個螢幕，引導使用者了解我們的核心功能。」
「為我們的新 API 產品建立登陸頁面，包含英雄區段、程式碼範例和定價。」
「建立一個表單來收集客戶回饋，並根據類別提供條件式問題。」
「為我們的營運團隊設計一個內部工具，以審查和批准內容提交。」
反覆改進您的設計
第一代是一個起點。真正的價值來自於反覆改進。
使用聊天
聊天最適合影響整體設計的廣泛變更：
「讓色彩配置更深色和更簡約。」
「重新排列儀表板，使指標位於頂列，圖表位於下方。」
「在右側新增設定面板。」
「向我展示此頁面的 2–3 個替代版面配置。」
您也可以要求 Claude 解釋其設計決策、建議改進或檢視設計的無障礙性。
使用內嵌註解
內嵌註解讓您可以直接點擊畫布上的特定部分並要求進行有針對性的變更。這比在聊天中描述位置更快。
好的內嵌註解範例：
「讓此按鈕的內邊距更大。」
「將此變更為下拉式清單而不是單選按鈕。」
「在此處使用主要品牌顏色。」
「讓此區段可摺疊。」
注意：如果您的註解未被拾取，請將回饋直接貼到聊天中。這是一個已知的解決方法，用於解決註解在 Claude 讀取之前可能消失的間歇性問題。
何時使用聊天與註解
使用註解進行有針對性的元件級變更（「修復此按鈕」、「調整此間距」）。使用聊天進行結構變更、新增區段、美學轉變或任何需要解釋或內容的事項。
管理版本和修訂
如果您想探索不同的方向而不失去目前的工作，請告訴 Claude：「儲存我們所擁有的內容並嘗試完全不同的方法。」Claude 將儲存您目前的專案並確認其儲存位置，以便您可以在對話中輕鬆參考早期的反覆改進。
匯出和分享
設計完成後，您可以與同事分享或將其匯出以供其他地方使用。正確的格式取決於您的使用案例—無論您是獲取利益相關者回饋、交接給工程部門還是向群組進行簡報。
在檢視您的專案時，使用右上角的「匯出」按鈕從以下匯出格式中選擇。
下載為 .zip
匯出為 PDF
匯出為 PPTX
傳送至 Canva
匯出為獨立 HTML
交接至 Claude Code
傳送至本機編碼代理
傳送至 Claude Code Web
您也可以使用可分享連結在組織內分享專案。分享選項包括僅檢視、評論和編輯存取權。
訂閱使用情況和定價
如需詳細資訊，請參閱此處：Claude Design 訂閱使用情況和定價。
獲得最佳結果的提示
從簡單開始，然後逐層增加複雜性。從核心版面配置和內容開始，然後新增互動、邊界情況和潤飾。Claude 對增量請求反應良好。
在您的回饋中要具體。「這看起來不對」很難採取行動。「將表單欄位之間的間距緊縮至 8px」給 Claude 提供了它所需的確切內容。
參考您的設計系統。如果您知道您品牌系統中存在某個元件，請按名稱提及它：「使用主要按鈕元件」或「套用卡片版面配置模式。」
盡早考慮回應式設計。提及您的設計是否需要在行動、平板電腦和桌面上運作，或僅在其中之一上運作。
要求變化。如果您不確定某個方向，請要求 Claude 向您展示 2–3 個選項。比較替代方案比猜測快得多。
要求 Claude 提供回饋。Claude 可以檢視您的設計是否具有無障礙性、對比率、資訊層級和一般可用性。將其視為設計協作者，而不僅僅是產生器。
已知限制
Claude Design 作為 Anthropic Labs 的實驗性預覽版提供。需要注意的幾點：
註解持久性：內嵌註解偶爾會在 Claude 讀取之前消失。若要解決此問題，請將註解文字貼到聊天中。
緊湊檢視中的儲存錯誤：緊湊版面配置模式可能會觸發儲存錯誤。如果發生這種情況，請切換到完整檢視並重試。
大型程式碼庫：連結非常大的儲存庫可能會導致延遲或瀏覽器問題。連結特定的子目錄而不是整個 monorepo。
聊天錯誤：如果您遇到「聊天上游錯誤」，請嘗試在同一專案內啟動新的聊天標籤。