ui-design-review

ui-design-review 技能使軟體代理能夠利用 Gemini 的多模態視覺能力進行嚴格的視覺與功能設計檢測。此技能專為前端開發者、UI 設計師與 QA 工程師設計，透過自動化 UI 驗證的繁瑣過程，確保實作內容嚴格遵循設計原稿與產業標準。透過深度視覺分析，它能識別佈局、排版、色彩準確度與組件一致性方面的差異，是維護整個軟體開發生命週期中設計系統完整性的必要資產。

• 進階 UI 分析：自動將實作截圖與設計稿或 Figma 參考資料進行比對。

• WCAG 2.1 AA 合規性：執行全面的無障礙審計，包括對比度檢查、觸控目標大小與語意結構驗證。

• 設計系統驗證：根據設計標記（Design Tokens）驗證間距、排版比例、圓角與顏色使用。

• 多格式支援：透過檔案路徑、Base64 編碼或 URL 參考處理影像，無縫整合至現有的 CI/CD 或開發流程中。

• 自適應模型路由：包含適用於 Gemini 直接 API 與 OpenRouter 整合的智慧路由邏輯，優化執行效能與成本。

• 執行審核時，確保影像清晰並正確對應分析提示詞，以獲得最佳效果。

• 使用提供的提示詞模式來為可用性、無障礙性或一致性檢查等特定任務建構輸出格式。

• 執行一致性或比較性檢查時，務必定義設計參考資料，以取得可行的偏差報告。

• 此技能依賴 claudish CLI；在執行前請確保已正確配置 GEMINI_API_KEY 或 OPENROUTER_API_KEY 等環境變數。

• 預期輸入包括 UI 截圖、線框圖或高擬真設計稿，輸出結果為結構化的 Markdown 表格或詳細的可用性報告，標識出問題位置、嚴重程度（CRITICAL 至 LOW）以及改進建議。