版本：2.0.0
UI/UX Pro Max 技能
這是 nextlevelbuilder/ui-ux-pro-max-skill 的 Codex 適配器。當任務會改變介面的外觀、感覺、動態、回應方式或使用者理解方式時，請使用此技能。
核心工作流程
- 分析使用者的產品、目標受眾、工作流程、UI 表面、品牌調性及實作技術棧。
- 在做出重大設計決策前，查詢本機的 UI/UX Pro Max 資料。
- 將查詢結果與現有專案設計模式及 Codex 前端指引整合。
- 實作或審查 UI，然後驗證響應式佈局、無障礙性、對比度、互動狀態及視覺細節。
搜尋腳本
從此技能目錄解析路徑：
python3 src/ui-ux-pro-max/scripts/search.py "<query>" --design-system -p "<Project Name>"
python3 src/ui-ux-pro-max/scripts/search.py "<query>" --domain <domain> -n 3
python3 src/ui-ux-pro-max/scripts/search.py "<query>" --stack <stack> -n 3
對於新頁面、新應用程式、著陸頁、儀表板，或當風格方向不明確時，請優先使用 --design-system。
對於特定細節，請使用領域搜尋：
| 領域 | 用途 |
|---|---|
product | 產品類別模式及建議的風格方向 |
style | 視覺風格、效果、實作關鍵詞 |
color | 產品感知色板及語意色彩選擇 |
typography | 字體搭配與排版氛圍 |
landing | 著陸頁結構與轉換模式 |
chart | 資料視覺化選擇 |
ux | 無障礙性、動畫、佈局、表單、導覽、回饋 |
react | React 與 Next.js 效能指導 |
web | 網頁與應用介面無障礙細節 |
icons | 圖示風格與函式庫建議 |
google-fonts | 字型探索 |
可用的技術棧包括 react、nextjs、vue、svelte、astro、swiftui、react-native、flutter、nuxtjs、nuxt-ui、html-tailwind、shadcn、jetpack-compose、threejs、angular 及 laravel。
實用參考
- 上游中繼資料：
skill.json - 上游 README：
README.md - 原始 Claude 技能：
.claude/skills/ui-ux-pro-max/SKILL.md - 搜尋資料與腳本：
src/ui-ux-pro-max/ - 來自上游的 Codex 平台範本：
src/ui-ux-pro-max/templates/platforms/codex.json
僅在需要時載入這些檔案。README 與原始技能檔案較大；建議優先使用搜尋腳本取得精準結果。
品質檢查
在最終交付 UI 工作前，請檢查：
- 文字對比度、焦點狀態、語意標籤與鍵盤導覽。
- 小寬度下的行動版佈局，以及常見中斷點下的桌面版佈局。
- 觸控目標大小、懸浮/按下/停用/載入狀態，以及錯誤狀態。
- 工具列、卡片、網格、圖表與媒體的穩定尺寸。
- 動畫持續時間、減少動畫行為，以及避免佈局位移。
- 一致的圖示函式庫、排版級距、間距級距與語意色彩代號。