关于 universal-solutions
一项使用 12 条迪士尼原则排查和修正动画问题的技能，将常见症状与针对性改进方法对应，并包含无障碍与性能检查。
主要功能
- 0112 条原则诊断清单
- 02症状与修正方法对应
- 03快速诊断流程
- 04无障碍与性能检查
- 05移除动画的判断标准
适用场景
- 01排查突兀或机械的动作
- 02检查动画是否干扰关键信息
- 03评估动作的无障碍性与性能
安装
复制下面的命令，在终端中运行。
npx skills add https:/安装后在 Claude Code 中输入/universal-solutions确认已加载。
详细介绍
通用动画解决方案
使用全部 12 条迪士尼原则的完整诊断框架。
12 条原则检查清单
逐条检查每项原则，诊断任何动画问题：
1. 挤压与拉伸
检查：是否具有恰当的柔韧性？ 问题迹象：动作僵硬、缺乏生气 修复：在撞击／加速时加入细微的缩放变化
2. 预备动作
检查：动作开始前是否有铺垫？ 问题迹象：动作显得突兀或令人意外 修复：加入小幅反向移动或蓄势动作
3. 演出布局
检查：重点是否清晰？ 问题迹象：用户错过关键信息 修复：突出动画元素，减少相互干扰的动作
4. 直线动作与姿势对姿势
检查：所采用的方法是否适合该效果？ 问题迹象：动作失控或过于僵硬 修复：UI 使用关键帧；有机动作使用逐帧动画
5. 跟随动作
检查：动作是否自然地稳定下来？ 问题迹象：结束得突兀、生硬 修复：加入过冲和回弹，或柔和地减速
6. 慢入与慢出
检查：缓动是否恰当？ 问题迹象：动作像机器人一样，速度始终不变 修复：入场时使用缓出，离场时使用缓入
7. 弧线运动
检查：运动路径是否自然？ 问题迹象：沿直线移动显得不自然 修复：为有机动作添加曲线路径
8. 次要动作
检查：辅助元素是否起到增强作用？ 问题迹象：动画平淡、缺乏层次 修复：添加细微的配合动作
9. 时间节奏
检查：速度是否恰当？ 问题迹象：过快或过慢 修复：微交互：100-200ms；转场：200-400ms
10. 夸张
检查：戏剧化程度是否恰当？ 问题迹象：过于含蓄或过于夸张 修复：根据情境的重要程度调整夸张程度
11. 扎实绘制
检查：渲染是否正确？ 问题迹象：视觉故障、变形 修复：仅使用 transform/opacity，检查 GPU 图层
12. 吸引力
检查：整体感觉是否恰当？ 问题迹象：难以说清哪里不对 修复：让动作符合品牌和情感意图
快速诊断
- 用一句话描述问题
- 找出最直接相关的原则
- 检查相邻原则（问题往往会聚集出现）
- 根据该原则应用有针对性的修复
故障排除综合检查清单
- 动画是否有明确用途？
- 时间是否恰当（通常为 150-300ms）？
- 是否应用了缓动（而非线性变化）？
- 是否遵循
prefers-reduced-motion？ - 是否仅对 transform/opacity 添加了动画？
- 动作是否正确地引导注意力？
- 是否符合品牌和情感背景？
- 用户能否在没有动画的情况下完成任务？
- 在目标设备中性能最差的设备上进行测试
- 使用情感词汇收集用户反馈
何时移除动画
出现以下情况时，应彻底移除动画：
- 动画没有明确用途
- 用户抱怨或跳过动画
- 动画延误了任务完成
- 动画造成无障碍问题
- 性能无法接受
- 无法说清动画存在的理由