用途：该技能帮助团队创建并持续演进产品设计系统，作为视觉与交互契约。核心原则是 token 和组件优先于按屏幕定制的一次性实现，代码与 Figma（若存在）需保持一致。关联技能包括 better-web-interface、frontend-design、react-component-engineering、storybook-docs、better-mobile-interface。
主要能力与分层：按 Foundations（token）→ Primitives → Components → Patterns → Product screens 逐层组织，不跳层。Foundations 定义语义角色而非原始色板，如 color（background、surface、text、border、accent、feedback）、typography、space（4/8 刻度）、radius/border/elevation、motion（时长/缓动）、breakpoints；格式可为 CSS 变量、Style Dictionary、theme JS/TS 或既有工具链，主题通过换值不换角色名实现。组件层面要求一个组件一件事，用 variant+size 胜过多布尔值，必须覆盖 default、hover、focus-visible、disabled，必要时加 loading/error，并内置键盘、焦点、标签、对比度等无障碍支持，样式只走 token。Patterns 在重复 3 次以上时记录，可对结构文案发表意见但不绑定具体功能文案。
治理与采用：以 UI 包/package 加 Storybook 为唯一来源，破坏性变更走 semver 与 changelog，流程为提议→写 story→在 1–2 个屏幕采用→扩展，弃用需提供迁移路径。产品采用先盘点重复实现，再抽 primitive 与 token，替换调用点且不改变 UX，补 story/docs，团队就绪后用 lint/review 禁止新字面量，应用应从设计系统导入而非复制。
适用场景与限制：适合构建 UI kit、统一多应用界面、管理 token 与组件版本、保障无障碍与品牌一致性。文档列出反模式，如只有按钮库没有 token、语义 token 与 blue-500 混用、为单一功能造无限变体、只在 Figma 有文档而代码偏离。该资料未提供安装命令、收费、平台限制等信息。