Justesse

將一段簡短需求、儲存庫或視覺參考轉化為連貫的生產級 UI。將品味視為在約束下的情境判斷，而非偏好的框架、美學或元件配方。

這是一個宣告式、僅供參考的能力。其設計推理、規則和驗收標準必須獨立於執行它的模型、代理運行時、命令列工具、供應商和託管環境。運行時特定的發現機制可能會瀏覽此目錄，但不得改變此技能的語義，也不得為其工作流程所必需。

鎖定操作模式

在做出設計決策之前，選擇一個主要模式。在設計解讀中陳述該模式，不要無聲切換。如果兩個模式意味著實質上不同的交付物，且請求未解決此問題，則提出一個聚焦的問題。一個任務可以指定次要模式，但主要模式控制工作流程和驗收標準。

模式	主要成果	所需參考
行銷 / 轉換	傳達價值並引導受眾執行一個可衡量行動	marketing-surfaces.md
產品 / 任務	幫助使用者了解狀態並完成重複性工作，包含儀表板	product-and-transaction.md
交易流程	安全且可恢復地完成一個重要或多步驟行動	product-and-transaction.md
重新設計：保留	在保持可辨識品牌與產品合約的同時提升品質	redesign-preservation.md
重新設計：全面翻新	在保留不允許變更的合約的同時建立新的視覺語言	redesign-preservation.md
參考轉程式碼	將提供的視覺證據轉化為目標專案的原生實作	reference-to-code.md
視覺審查	診斷層級結構、連貫性、可用性、響應式設計和生產風險	interface-quality.md
閱讀 / 文件	透過文件、指南、文章、說明或變更日誌幫助讀者理解內容	reading-surfaces.md
體驗 / 展示	讓訪客沉浸於作品集、畫廊或展覽作品中，使介面退居幕後	experience-surfaces.md
影像概念	定義或產出服務於介面的藝術指導	image-concepts.md
資料視覺化	將度量、比較、分佈、關係和不確定性轉化為可檢驗的證據	data-visualization.md
高層決策備忘錄	將有邊界的證據轉化為以結論為主導、提供給決策者的簡報	decision-memo.md

選擇主要模式後，需單獨設定設定檔。此技能內建設定檔機制，但未包含任何設定檔。僅在請求或專案說明中明確指定 personal:<name> 旗標時，才啟用該設定檔。切勿根據人員姓名、工件類型或此技能的存在與否來推斷設定檔。若無該旗標，請保持視覺語言、語調、色板、材質和表面顏色為品牌中立；淺色紙張畫布並非預設值。

啟用旗標時會開啟一個必須進行的宣告，而非授予一個視覺系統。在根據設定檔做出任何設計決策之前，必須獲得 profile-declaration.md 中全部十個欄位的具體答案，且不得透過推斷、借用其他設定檔的值、此技能的範例或其測試固定裝置的值來填寫未回答的欄位。每個欄位都應附上一個實際範例提問，並以該欄位自身的答案形式呈現；一個空泛的問題只會得到一種需要測量的形式。

核心工作流程

先檢查，再提議。 閱讀相關的專案檔案、具代表性的畫面與元件、套件與建置配置、設計權杖、資料結構、路由、測試以及提供的參考資料。辨識哪些是真實的、哪些是推斷的、哪些是未知的。
架構需求摘要。 閱讀 brief-and-direction.md。記錄目標受眾、使用者任務、商業目標、內容與品牌證據、限制條件、主要模式以及成功信號。在實作前逐一列舉所有要求的交付物。偏好一個可辯護的解釋，而非趨勢的拼貼。
宣告設計解讀。 以一個簡潔的陳述，說明模式、受眾、產品任務、視覺方向、密度與動態姿態。區分決策與假設。
保留產品合約。 除非使用者明確授權變更，否則保留現有的框架、套件管理器、元件慣例、設計系統、資料與 API 合約、狀態語義、路由、表單、分析、同意與法律行為、無障礙性、SEO、內容意義、測試以及效能預算。全面翻新模式並非破壞它們的許可。
原生實作。 重用已安裝的依賴項與已建立的基本元件。以專案自身的框架與樣式模型表達方向。不要僅僅因為此技能提及某種視覺可能性，就引入 React、Tailwind、GSAP、另一個設計系統、深色模式、字型或任何依賴項。
解析完整的狀態空間。 設計響應式佈局，以及適用的載入、空白、部分、錯誤、成功、禁用、權限、離線、驗證和破壞性操作狀態。對於儀表板和流程，要保護資料可讀性、任務連續性和復原能力。
以受限制的迭代進行渲染與驗證。 先完整建置。然後，當預覽工具存在時，在一次批量回合中同時檢查代表性的窄版與寬版視口以及真實內容的極端情況，比較層級結構、閱讀順序、溢出、對比度、焦點、互動回饋以及合約保留。一次性修復該回合顯示的所有問題，最多再確認一次後停止打磨：開放式的自我品質驗證循環會耗盡預算而無法收斂，且此限制涵蓋了完整的週期，包括截圖、缺陷掃描、微編輯和重建。沒有相應的建置、測試和視覺證據，不要將模型稱為生產就緒。
預檢交付。 閱讀 production-preflight.md，修復適用的失敗，交叉檢查每個要求的交付物，並報告無法執行的檢查。

參考資料路由

僅載入活躍模式所需的內容；每個參考資料都直接連結於此。

始終閱讀 brief-and-direction.md、interface-quality.md 以及 production-preflight.md。
針對行銷、活動、編輯轉換、定價、發佈或其他獲取型表面，閱讀 marketing-surfaces.md。
針對文件、指南、文章、說明、變更日誌以及以理解為目標的長文頁面，閱讀 reading-surfaces.md。
針對作品集、畫廊、展示廳以及作品本身主導的展覽頁面，閱讀 experience-surfaces.md。
針對應用程式 UI、儀表板、資料密集的工作區、表單、結帳、入門引導、設定以及多步驟流程，閱讀 product-and-transaction.md。
每當表面包含 KPI、圖表、分析圖形、度量比較、數字表格或日期/時間顯示時，閱讀 data-visualization.md。
每當現有表面發生變化時（無論是保留模式還是全面翻新模式），閱讀 redesign-preservation.md。
當螢幕截圖、模型、網站或其他視覺範例作為實作輸入時，閱讀 reference-to-code.md。
僅當圖像屬於需求摘要的一部分或影像概念是選定模式時，閱讀 image-concepts.md。
當需求摘要缺乏視覺詞彙或需要區分競爭方向時，閱讀 style-lenses.md。
最後，且僅在介面品質檢查通過後，閱讀 finishing.md 以進行交付級別的打磨和判斷極為相似的候選方案；打磨永遠不能取代層級結構、真實性或狀態。
僅當被檢查的專案已經使用 React、Next.js 或 Tailwind，或者使用者明確授權該技術棧用於全新專案時，才閱讀 react-next-tailwind.md；它不是可攜式的預設值。
針對高層備忘錄、決策簡報或任何以結論為主導的投影片序列，閱讀 decision-memo.md。
每當交付物是可編輯的簡報檔案而非頁面時，在佈置第一張投影片之前閱讀 pptx-safe-html.md。
當一個世界觀必須跨越儀表板、原創登陸頁面、案例研究、報告和簡報時，閱讀 surface-translation.md。
使用確切的 personal:<name> 旗標時，先閱讀 profile-activation.md 和 profile-declaration.md，然後在宣告完成後閱讀 profile-data-semantics.md。否則請勿載入或應用它們。
僅在執行受控的設定檔比較、陰性對照、盲審或晉升決策時，閱讀 profile-calibration.md。
僅為了歸屬、稽核、重新分發或上游比較時，閱讀 upstream-provenance.md。

請勿遞迴地從參考資料中載入不相關的檔案。

條件性能力

僅在可用、經授權且必要時，才使用圖片生成、圖片搜尋或瀏覽。對於圖片工作，優先使用現有的儲存庫資源，然後是使用者提供的資源，最後是經授權的工具。否則，交付一個具體的概念簡報或清晰標記的佔位符，且不聲稱其為最終成品。僅在真正缺少外部資源或依賴項時使用佔位符；指定每個佔位符的尺寸、角色以及下一步替換動作。請勿偽造產品截圖、客戶、指標、標誌或推薦。

使用動態效果時，僅限於它能幫助釐清層級結構、回饋、連續性或敘事。優先選擇專案現有的機制和最輕量的適當技術。確保無動態情況下內容仍然完整，尊重減少動態的偏好設定，避免滾動捕捉，並清理觀察者、監聽器和時間軸。動態效果庫是條件性的實作選擇，而非必要條件。僅當原生 CSS 過渡不再足夠，且工作需要分層編排、滾動敘事或專用動畫引擎時，才升級參考至 motion-patterns.md。

交付合約

交付實作或審查過的表面，並附上模式和設計解讀、已保留和有意變更的合約、驗證證據，以及任何佔位符或未解決的風險。對於僅審查的請求，請根據使用者影響優先排序發現項目，並引用受影響的畫面或元件；除非被要求，否則不要變更專案。

Justesse：精準設計判斷技能