設計 Harness
執行一個可中斷且可恢復的網頁 UI 工作流程。讓使用者掌控意圖，並將設計生產與審查分離。
開始與恢復
將 <skill-dir> 解析為包含此 SKILL.md 的目錄；不要假設目前工作目錄包含 bundled 的指令碼。
- 在提問之前，先執行
node <skill-dir>/scripts/preflight.mjs --root <project>。閱讀其能力報告；不要安裝任何東西。將缺失的檔案系統路徑視為建議：在主機已載入的技能/外掛清單中檢查，再宣告 Impeccable 或 Jakub 不可用。 - 執行
node <skill-dir>/scripts/state.mjs init --root <project>。這會安全地升級舊版狀態，因為init是變動指令。如果狀態已存在，請執行唯讀的status指令，並從其nextPhase繼續；切勿重新開始已完成的階段。在檢查或升級舊版執行而不重新初始化時，使用明確的migrate。 - 僅讀取目前階段所需的參考文件：
- discovery/confirmation: references/interview.md
- context/direction: references/context-contract.md
- build/tool choices: references/routing.md
- optional source selection: references/optional-tool-registry.json，僅在確認啟動條件後才讀取
- review/QA/handoff: references/review-and-qa.md
- 每個階段完成後，使用
node <skill-dir>/scripts/state.mjs advance <phase> --root <project>推進狀態。對於human-feedback，也需傳入--outcome used或--outcome not-used。對於feedback-fixes，傳入--outcome applied或--outcome not-applicable。
使用此固定的單調序列：
preflight → discovery → confirmation → context → direction → build → internal-review → human-feedback → feedback-fixes → independent-review → fixes → qa → handoff → complete
僅將機器狀態儲存在 .design-harness/state.json 中；報告和螢幕截圖屬於 .design-harness/reports/。切勿儲存完整的聊天記錄、token、cookie、憑證或不相關的環境資料。
強制執行審批閘門
自適應地進行訪談，並將答案總結為一張簡潔的確認卡。包含產品、受眾、主要目標、內容、頁面/表面、期望與不期望的品質、正面與負面參考資料、限制條件、動畫、必要的狀態、技術堆疊、委派、AI 特定狀態、WebGL 容忍度、外部來源政策，以及任何付費授權的邊界。僅詢問缺少或重要的細節。
在使用者明確核准確認卡之前，請勿撰寫、編輯或產生 UI 生產程式碼。允許預檢、提問、唯讀檢查，以及在聊天中草擬確認卡或建議的意圖內容。直到核准之前，請勿建立或修改專案的意圖 .md 檔案。
如果缺少參考資料，請將描述性詞彙視為足夠。推導出兩到三個具名方向，並附上具體的取捨，然後要求使用者選擇。僅在視覺工具存在且對使用者有益時才產生視覺看板；切勿將看板設為先決條件。
建立已核准的內容
在確認之後，根據使用者回答或使用者明確核准的建議，填入以下檔案：
PRODUCT.md，包含已核准的brand或product註冊REFERENCES.mdDESIGN.mdACCEPTANCE.md- 至少一個
.impeccable/surfaces/<slug>.md
從 PRODUCT、references、design、acceptance 和 surface 範本複製結構。僅在使用者核准其內容後，才將每個意圖檔案標記為已核准。在開始建置之前，執行 node <skill-dir>/scripts/validate-context.mjs --root <project>。
保持 DESIGN.md 的 H2 章節完全按照以下順序，各出現一次：Overview、Colors、Typography、Elevation、Components、Do’s and Don’ts。
將 PRODUCT.md 和 DESIGN.md 在核准後視為受保護的檔案。對於任何後續的變更，顯示建議的差異，要求明確核准，然後再套用。切勿默默地合理化偏差。
將每個已核准的外部元件、配方、效果或回饋整合記錄在 REFERENCES.md 中，包含其確切來源、選定項目、可用的釘選版本或提交、存取日期、預期用途、目前的授權/條款結果、改編內容以及所需的退路。「使用外部函式庫」並非對特定來源的核准。
透過 Impeccable 建置
讓已安裝的 Impeccable 技能及其已核准的內容成為此輪次唯一的设计和生產權威。載入其技能和相關的領域參考資料，然後將已核准的意圖檔案和表面提供給它。不要讓它重複發現或重新解釋已核准的意圖。讓 Impeccable 產生或更新 .impeccable/design.json；切勿手動編輯該 sidecar 檔案，並且切勿未經保護的差異與核准流程就接受產生的 PRODUCT.md 或 DESIGN.md 變更。
在同一個生產輪次中，請勿載入任何其他廣泛品味或設計系統的技能。僅根據 references/routing.md 路由狹義的輔助工具。除非已核准的內容授權變更，否則保留現有的元件庫和技術堆疊。切勿自動安裝或自動複製可選的註冊條目；解釋確切的限制用途並先獲得核准。
在建置後執行 Impeccable 自我審查並記錄發現結果；這是 internal-review，而非獨立審查。一旦 UI 穩定到可以檢查，進入 human-feedback：在有用時提供已核准的 Agentation 檢查點，或記錄 Not used 並使用 --outcome not-used 推進。預設將 Agentation 保留為僅限開發和手動/本機；MCP、webhook 和自主解決方案需要單獨的明確核准。在 feedback-fixes 中，僅套用經裁定的使用者註解，並記錄 --outcome applied；當跳過回饋時，記錄 Not applicable 並使用 --outcome not-applicable 推進，且不進行編輯。在獨立審查之前，解決使用者的註解。
分離審查、修正與品質保證
對於 independent-review，使用 Jakub 目前的 better-interface 技能及其六個領域技能，啟動一個全新的唯讀子代理/內容。提供螢幕截圖、相關的實作檔案、元件庫限制以及已核准的意圖文件。在建置後要求進行完整的審查。審查者必須僅報告發現結果，不得編輯或默默地重新設計。
在根內容中，針對 PRODUCT.md、DESIGN.md、表面規格、驗收標準和元件庫，對每個發現結果進行裁決。記錄接受/拒絕/推遲及其理由。透過生產權威單獨套用接受的修正，然後要求對變更區域進行一次有重點的快速唯讀審查。
遵循 references/review-and-qa.md。執行 Impeccable 檢測器、Playwright 在行動/平板/桌面端螢幕截圖、axe 與 Lighthouse。涵蓋代表性的路由以及適用的載入、空、錯誤、長文字、懸停、焦點和減少動畫狀態。對於可選來源，也要執行其註冊閘門：語意/靜態退路、無 WebGL 行為、已核准的瀏覽器、行動 CPU/GPU 或 bundle 預算，以及適用的生產環境排除開發工具。將不支援或未執行的狀態標記為 Not reviewed；切勿將其報告為通過。
對於具有有意義的頁面滾動動畫的介面，或為了影片/示範準備，在專用的本機連接埠上啟動全新生產建置，並執行 node <skill-dir>/scripts/verify-motion.mjs --root <project> --base-url <url> --routes /,<other-routes> --config .design-harness/qa/motion.config.json，在調整 scaffolded 配置之後。驗證器預設會測試行動、平板和桌面端，在全新的環境中隔離每個路由，要求成功的路由回應、配置的內容根、預期的 URL/重新導向鏈，以及可測量的文件滾動，並且不會模擬應用程式請求或允許重新導向，除非明確的專案配置宣告每個例外。保留其 schema 版本 4 的 Playwright/瀏覽器來源以及螢幕截圖/模擬的雜湊值，並與交接資料一起保留。將第一幀/啟動探測和幀率間隔閾值視為僅該機器和瀏覽器上的證據，絕非通用的 60 FPS 保證。
使用 node <skill-dir>/scripts/scaffold-qa.mjs --root <project> 預覽通用的 QA scaffold，並在確認卡授權 QA 計畫後加上 --apply。僅在現有檔案將被取代時才再次詢問。它絕不會安裝依賴項。
交接
僅在已核准的驗收標準通過，且沒有阻斷性的發現結果或無法解釋的品質保證差距時，狀態才為 Ready；否則狀態為 Not ready。列出已變更的檔案、螢幕截圖、審查發現結果與處置、自動化檢查與結果、不支援的狀態、剩餘的差距，以及每個實際使用的外部來源及其釘選的來源與授權結果。推進 handoff，然後僅在工作流程真正完成時執行 node <skill-dir>/scripts/state.mjs complete --root <project>。