ui-skills

核心用法

ui-skills 是一份面向 AI Agent 的 UI 开发规范文档，旨在约束和引导生成高质量的前端界面代码。该技能通过一系列强制性的「MUST」、推荐性的「SHOULD」和禁止性的「NEVER」规则，为开发者建立清晰的技术决策框架。核心用法包括：在组件层面强制使用 Base UI、React Aria 或 Radix 等无障碍原语库；在样式层面优先采用 Tailwind CSS 默认设计系统；在动画层面严格限制仅使用 transform 和 opacity 属性以保证合成器性能；在交互层面要求对破坏性操作使用 AlertDialog 确认，并禁止阻塞用户的粘贴操作。

显著优点

该技能的最大价值在于其「观点鲜明」的约束设计。首先，它大幅降低了技术决策成本——开发者无需在无数等效方案中纠结，直接遵循规范即可产出符合现代标准的代码。其次，规范内置了性能优先原则：动画时长限制 200ms、禁止布局属性动画、强制尊重 prefers-reduced-motion 用户偏好，这些规则从根本上避免了常见的性能陷阱。第三，无障碍访问被置于核心位置，从 aria-label 到键盘导航再到安全区域适配，确保产出界面的包容性。最后，规范与主流技术栈深度绑定（Tailwind CSS、motion/react、tw-animate-css），具有良好的工程落地性。

潜在缺点与局限性

作为纯规范文档，ui-skills 本身不提供可复用的代码组件，开发者仍需自行实现符合规范的具体代码。此外，其「Opinionated」特性意味着对技术选型的强约束——例如强制使用 Tailwind CSS 和特定动画库，这可能与团队现有技术栈冲突。规范中大量「NEVER」规则（如禁用渐变、禁用自定义缓动曲线）在追求一致性的同时，也可能限制特定场景下的设计表达。对于需要高度定制化视觉风格的项目，这些约束可能显得过于僵化。

适合的目标群体

该技能最适合以下场景：快速启动的 MVP 项目需要统一的设计规范；中后台管理系统追求开发效率而非视觉独特性；技术团队希望建立可维护的 UI 代码标准；以及 AI 辅助编程场景下需要降低生成代码的随机性。对于追求极致品牌差异化的 C 端产品，或已有成熟设计系统的团队，建议选择性采纳而非全盘接受。

使用风险

该技能本身无代码执行风险，但需注意：规范中的性能建议（如 will-change 使用限制）需要开发者正确理解浏览器渲染机制才能有效落实；强制依赖 motion/react 等第三方库会引入供应链风险；无障碍规范的正确实现需要开发者具备相应知识储备，否则可能出现「合规但不实用」的形式主义实现。