design-md

design-md 技能總覽

design-md 的用途

design-md 技能會把 Stitch 專案轉成一份 DESIGN.md，用來整理畫面背後的語意化設計系統。它不是只做視覺檢查，而是給需要可被提示詞驅動的設計事實來源的人使用。如果你正在用 Stitch 產生新畫面，並希望版面、語氣、色彩與元件語言都能維持一致，design-md 技能就是為這個情境設計的。

適合誰使用

如果你正在處理一個有實際畫面的 Stitch 專案，並且想要用可重複的方法用文字描述設計系統，就很適合使用 design-md 技能。它特別適合產品設計師、AI 輔助的前端建置者，以及正在整理既有 UI、希望 Stitch 產生的新 UI 能維持一致的團隊。

design-md 為什麼不一樣

design-md 的核心價值在於轉譯：它會讀取技術性的設計訊號，再轉成自然、可重用的設計指引。這很重要，因為 Stitch 最擅長回應的是有具體數值支撐的描述性設計語言，而不是只有抽象的風格標籤。當你需要的是一份能指引後續生成，而不只是當前畫面的單次摘要時，這個技能特別有用。

如何使用 design-md 技能

在你的 Stitch 工作流程中安裝這個技能

使用 npx skills add google-labs-code/stitch-skills --skill design-md --global 來安裝 design-md。repo 路徑是 google-labs-code/stitch-skills，而這個技能位於 skills/design-md。如果你的設定不是全域安裝，請依照你本地的 skills 工作流程調整安裝方式。

提供正確的起始脈絡

好的 design-md usage 會從清楚的 Stitch 目標開始：專案名稱或 ID、要分析的畫面或流程，以及你希望產出的 DESIGN.md 要支援什麼。好的提示詞會說明要記錄什麼、為什麼要記錄，例如：「分析我 Furniture Collection 專案的 Home 畫面，產出一份可用來指引新產品列表畫面的 DESIGN.md。」這比要求一份泛泛的設計摘要更好，因為它讓技能知道應該優化什麼。

先閱讀這些檔案

若你要找一份實用的 design-md guide，先從 SKILL.md 了解工作流程，再看 README.md 掌握安裝與範例用法，最後檢視 examples/DESIGN.md 來了解預期輸出長什麼樣子、細節應該到什麼程度。如果你是在評估這個技能是否適合你的 repo 或流程，這三個檔案能最快提供判斷依據。

能提升輸出品質的工作流程

建議在你已經有至少一個設計完成的 Stitch 畫面可供分析時再使用這個技能。它依賴專案擷取與設計中繼資料，所以當你的輸入包含真實專案、明確畫面，以及足以區分刻意設計與偶發實作細節的脈絡時，產出的 DESIGN.md 品質會更好。如果你的目標不只是一個畫面，最好要求它彙整一組具代表性的樣本，而不是逼它從單一且資訊量不足的樣本去推斷整個系統。

design-md 技能 FAQ

design-md 只適用於 Stitch 專案嗎？

是，design-md 技能就是為 Stitch 專案與 Stitch MCP 存取所設計。如果你沒有使用 Stitch，通常泛用的設計提示詞或其他文件化流程會更適合。

執行前我應該提供什麼？

至少要提供一個目標專案或能識別它的方法，外加你想分析的畫面或畫面集合。目標越具體，design-md 在建立語意化設計系統時需要猜測的部分就越少。

design-md 技能適合初學者嗎？

適合，只要你能說出專案名稱和畫面名稱，就可以開始使用。初學者最常犯的錯誤，是在沒有提供真正的事實來源時，就直接要求一份設計文件。這個技能最有效的狀況，是它能檢視實際的 Stitch 資產，而不是從模糊提示詞去反推風格。

什麼情況下不該用它？

如果你只需要快速的視覺印象、行銷式描述，或是一段話的 UI 評語，就不該用 design-md。如果你無法存取 Stitch MCP 工具，或專案中沒有足夠有意義的設計資料，這也不是合適的選擇。

如何改進 design-md 技能

給它更窄、訊號更強的目標

最強的 design-md skill 輸出，通常來自聚焦的提示詞。請明確指定你要文件化的精確畫面、流程或專案區段，並說明你要的是基礎系統、元件導向系統，還是可直接用於生成的提示指南。這能幫助技能把重點放在最值得重用的部分。

分享真正重要的設計決策

如果你已經知道哪些限制應該影響 DESIGN.md，請一開始就寫清楚：品牌語氣、無障礙期待、版面密度、響應式行為，或輸出應該偏向編輯式語言還是實作細節。這對 design-md for Design Systems 特別重要，因為真正的目標是保留可重複使用的選擇，而不是把每個可見元素逐一描述一遍。

留意最常見的失敗模式

最大的風險，是把單一畫面過度擬合成整個系統，或把一次性的 UI 內容誤認為系統規則。你可以要求它區分核心 token、可重用模式，以及畫面專屬例外，來改善結果。如果第一次輸出太泛，第二次提示詞就要更明確地要求它補強色彩角色、字體層級、間距邏輯與元件行為。

從第一版 DESIGN.md 開始迭代

把第一版輸出當成設計語言的草稿，而不是最終成品。先檢查它是否已經足夠具體，能直接用於 Stitch 生成；如果還不夠，就要求它修正較弱的部分，例如色盤角色、按鈕狀態或版面規則。最有用的 design-md install 成果，應該是一份未來提示詞可以直接重用的 DESIGN.md，而不是每次都要重新解釋整個系統。