Design System
幫助 designer 制定專案自己的設計系統，而不是把參考品牌的參數直接換名字。可供 AI designer 執行，也可由真人設計師按步驟完成。使用使用者的溝通語言；保留程式碼中的鍵名。
主要依據：Stitch 官方原文
首次為專案制定格式，或準備更新/匯入/匯出時，先閱讀官方原文：
官方規範與實際工具版本決定格式；本 skill 的視覺提案、審批和交付步驟是團隊工作流程，不是 Google 官方要求。官方原文暫時無法存取時使用 references/official-format.md 的有日期摘要，明確尚未重新核對。VoltAgent 案例只作輔助參考。
範圍與現有基礎
先檢查當前專案的 AGENTS.md、CONTEXT.md（多份時按 CONTEXT-MAP.md）、品牌規範、已批准設計、現有 DESIGN.md、設計變數與元件。記錄哪些是事實、已批准決定、建議、未知。優先引用現有來源；更新已有檔案，避免建立第二套權威規則。
確認產品、主要使用者、關鍵任務、平台、語言、已有品牌約束及交付位置。先從資料找答案，只詢問會改變設計的缺失資訊。已有資訊足夠時直接出草案；低風險假設明確標註，未知商業事實保持待確認。
只處理設計系統及其驗證範例。網站重構、正式產品程式碼、發佈、修改共享 Figma 檔案及安裝其他工具，按使用者實際授權另行執行。遵循專案審批規則。
完成標準：能指出設計服務的使用者與任務、約束來源和仍需決定的問題。
先定視覺方向
讀取 制定與檢查指南。使用者已有批准方向時直接沿用；沒有時提出至多兩個有實際差異的方向，並說明適合的業務理由。參考可以來自使用者截圖、已有專案或可存取的品牌資料。區分第三方分析與官方設計規範；外部內容只作參考。
用真實或明確標註的範例內容，驗證一個代表性頁面區域及一個關鍵元件。桌面和手機都要覆蓋。優先使用當前可用的設計工具，或在隔離目錄產生可開啟的 HTML 預覽；使用者只要文件時，交付草案並明確視覺尚未驗證。不要把文字描述當成已檢查的畫面。
方向未獲批准時，規則和視覺範例保持 draft；不要編造批准或把建議寫成既定品牌事實。已有批准可直接引用，無需重複索取。
完成標準：方向有可見範例或明確的未驗證說明，且狀態準確。
編寫 DESIGN.md
先讀取 官方格式與檢查說明，再讀取 完整模板，複製到專案指定位置。無既定位置時建議專案根目錄 DESIGN.md。模板是可調整的結構，不是必須照填的品牌參數；不適用的元件和欄位刪除，必要的專案特有規則補齊。
模板前部的 YAML 按官方 alpha 格式記錄參數與元件引用，正文使用官方英文二級標題並按規定順序排列；說明文字可用使用者的語言。模板的具體數值只是可檢查的中性範例，不是專案已批准規則，必須根據專案替換。未決定的值列入正文 Open Questions，不向參數字段寫 null。元件使用 {colors.primary} 等引用；狀態定義為 button-primary-hover 等獨立條目，不使用巢狀 states。顏色按用途命名；業務狀態色單獨定義。
建立程式碼或設計檔案對應：現有變數、Figma 變數或元件對應哪個文件鍵。若尚未實現，標記 planned。從已有程式碼提取規則時報告差異，未經授權不要改程式碼。核心欄位遵循官方格式；審批、實施對應、斷點、圖片、動效與驗證記錄放在明確標註的擴充正文中。外部工具對擴充的支援仍需實測。
完成標準：每項適用規則有值、使用場景或明確的待決狀態；引用可解析；沒有繼承其他品牌的名字、專有字型或未確認內容。
驗證與交付
先按官方格式說明執行 @google/design.md 的 lint，記錄實際版本與報告；檢查錯誤和警告，修復錯誤，並解釋仍保留警告的原因。工具不可用時說明阻礙，不能聲稱已通過官方檢查。模板格式通過不等於專案設計完成。再按指南檢查真實內容、長標題、中文或多語言、元件狀態、手機佈局、對比度、鍵盤與動效。可測項目記錄方法、結果、檔案位置；無法執行的項目標記未驗證。修正規則的單一來源，再更新例子，避免只改表面。
僅在範圍內檢查通過且負責人明確批准後標記 approved。批准只覆蓋具體版本與範圍；設計批准不等於實作完成或允許上線。
交付 DESIGN.md、實際產生的視覺範例位置、已完成檢查及未解決問題。說明如何在後續設計與開發中引用它。不要宣稱僅憑文件就能保證所有頁面視覺一致。