plugin87/ux-ui-agent-skills

解决的问题

AI 代理经常产出“垃圾内容”（slop）——即看起来平庸、缺乏焦点、使用硬编码数值且无法达到基本无障碍标准的 UI。本项目提供了一个结构化的知识层与一套客观的验证工具，将 LLM（特别是 Claude）转变为资深设计架构师，使其能够在任何框架中产出可投入生产、符合无障碍标准且基于标记（token-driven）的 UX/UI 设计。

运作方式

它作为纯粹的指令与知识层运作，而非执行时期函数库。它结合了以下要素：

• 结构化指令：CLAUDE.md 与定义代理“设计准则”的规则文件。
• 设计标记：使用 DTCG 格式的三层架构（Primitive $\rightarrow$ Semantic $\rightarrow$ Component）。
• 客观闸道：52 项自动化检查（其中 34 项通过 Playwright 使用真实浏览器），用于验证 WCAG 2.2 对比度、目标尺寸、响应式溢位与“垃圾内容”侦测。
• 可执行技能：25 种技能与斜线指令（例如 /brandkit、/critique、/gate），代理可调用这些指令来执行特定的设计任务或审核。
• 框架转接器：一种允许代理针对任何技术堆叠（从 React 与 Tailwind 到 SwiftUI 与 Flutter）进行开发的协议。

适用对象

使用 AI 编码代理（如 Claude Code、Cursor、Codex 或 Aider）的开发者与设计师，他们需要高保真、符合无障碍标准的 UI 组件与全尺寸屏幕，且需遵循专业设计系统标准，无需手动交接。

特色亮点

• 反垃圾内容准则：专门侦测并拒绝常见的 AI 生成 UI 模式，如通用的渐层与不一致的圆角。
• 全面的无障碍功能：内置针对 WCAG 2.2 AA/AAA 标准的审核，包含焦点陷阱与减少动态效果政策。
• 庞大的知识库：包含 138 个品牌级设计系统与 52 个组件规格。
• 多代理工作流程：包含一个 design-critic 代理，会根据不可量化的 UX 发现来争取拒绝不合格的作品。
• 框架无关：通过灵活的转接器协议支持任何前端框架。