ui-design-review

UI Design Review 技能是为开发者、设计师与 QA 工程师打造的专业工具包，旨在利用 Gemini 的多模态视觉能力进行自动化界面分析。通过与 Claudish 及 Gemini API 整合，此技能可将静态视觉资产（如截图、线框图与设计稿）转化为结构化且具体的可操作建议。它适用于需要高度保真、设计系统一致性以及符合 WCAG 2.1 AA 等无障碍标准的专业工作流程。

本技能通过提供可重复的提示词模式，简化了从视觉设计到代码实现的转换过程，专注于核心可用性原则，包含视觉层级、组件一致性、间距精确度与色彩保真度。它支持多种输入方式，包括直接文件路径、Base64 编码内联图像与远程 URL 引用，方便整合至现有的 CI/CD 流水线或本地开发环境。

• 自动化 UI 可用性审查：评估视觉层级、系统状态反馈与交互式组件的可操作性。

• WCAG 2.1 AA 无障碍稽核：针对对比度、点击目标大小与焦点状态进行自动化扫描。

• 设计系统验证：将实现截图与设计系统的 Token、排版规则与阴影层级进行精确比对。

• 比较性设计分析：针对 Figma 导出图与实际 UI 组件进行保真度检查，以识别布局偏差。

• 弹性路由机制：内置支持 Gemini 直连（通过 GEMINI_API_KEY）与 OpenRouter 路由逻辑。

• 用户需提供有效的 API 密钥（Gemini 或 OpenRouter）才能调用底层的多模态模型。

• 建议通过 OpenRouter 路由时使用 or/ 前缀，以避免与 Claudish 的自动路由逻辑发生命名冲突。

• 输出格式为 Markdown 表格或分类列表，适合直接贴入项目管理工具或代码审查意见中。

• 建议结合清晰的高分辨率原始图像与特定的设计文档或 Token 定义，以获得最佳分析结果。

• 针对 Claudish CLI 优化，支持批处理与自动化 auto-approve 工作流程。