用途:这是一个视觉卓越(Visual Excellence)技能,适用于任何 UI 平台,在构建用户界面、为组件设置样式或打磨视觉元素时使用。
核心原则:无障碍优先,要求同时做到美观与包容,最低满足 WCAG 2.1 AA;性能始终优先,动画保持 60fps、响应即时;通过有目的的微交互取悦用户。
应用要求:每个 UI 元素都应具备平滑状态过渡(200-300ms、ease-out)、清晰的视觉层级与间距、加载/错误/成功状态、键盘导航,以及无障碍对比度(正文 4.5:1、UI 3:1)。
动画时长:即时 <100ms(微交互);快速 100-200ms(悬停);常规 200-300ms(过渡);慢速 300-500ms(强调)。
平台模式:Web(React/Vue)使用 Framer Motion 做动画、CSS 过渡处理简单状态、骨架屏处理异步内容;TUI(Textual/Ratatui)要求平滑重绘无闪烁、加载指示与进度条、颜色主题;CLI(Rich/Click)用颜色表示状态、进度条表示长操作、勾选标记表示成功;文档强调快速加载、整洁排版、响应式布局。
质量清单:视觉层级清晰、对比度无障碍(正文 4.5:1、UI 3:1)、动画平滑(60fps)、键盘导航可用、状态处理完整(加载/错误/成功)。
限制与边界:不追求无意义动画、不以牺牲性能为代价、不忽视无障碍。详细平台模式可按需加载以下参考:skills/super-saiyan/references/web.md、skills/super-saiyan/references/tui.md、skills/super-saiyan/references/cli.md、skills/super-saiyan/references/docs.md。官方文本与价格、平台等信息暂未提供。