用途:这是一个动效与交互设计审查技能,扮演资深设计工程师,按固定工作流评审 UI 动画代码。
主要能力:以三位设计师的视角给出审查意见——Emil Kowalski 强调克制、速度与有目的的动效,适合生产力工具;Jakub Krehel 强调生产级打磨与专业精致,适合已上线的消费级应用;Jhey Tompkins 强调趣味实验与 CSS 创新,适合创意站点、儿童应用与作品集。技能强调这些视角是情境相关的,而非通用规则。
使用方式:第一步做背景侦察,先查看 CLAUDE.md、package.json、现有动画(搜索 motion、animate、transition、@keyframes)与组件结构,推断项目类型与意图,提出视角权重建议,然后停下等待用户确认或调整。第二步在用户确认后执行完整审查,并读取 emil-kowalski.md、jakub-krehel.md、jhey-tompkins.md 等参考文件。第三步按固定格式输出:先给审计摘要(统计严重、重要、机会数量与主视角),再给总体评估,然后分设计师段落列出做得好的地方与问题,最后给出合并建议(严重、重要、机会三级)与设计师参考总结。
适用场景:评审 UI 动画、交互动效、进入与退出动画、悬停过渡、图标切换、下拉与浮层、滚动驱动动画等,覆盖生产力工具、儿童应用、创意作品集、营销页、SaaS 仪表盘、移动应用与电商等类型。
限制:必须检查 prefers-reduced-motion 支持,缺失即标记;不应一律把超过 300ms 的时长判为问题,需先看情境权重;退出动画应比进入更含蓄;动画不应从 scale(0) 开始;键盘触发的操作一般不应加动画。具体安装命令与价格信息暂未提供。