1. 基本信息
| 项目 | 内容 |
|---|---|
| 名称 | motion-design-skill |
| 作者/维护者 | LottieFiles（官方开发者组织，GitHub 认证机构账号） |
| 来源链接 | github.com/LottieFiles/motion-design-skill |
| 许可证 | MIT（仓库 LICENSE 文件确认） |
| GitHub Stars | 706（GitHub API） |
| Forks | 41（GitHub API） |
| 最新版本 | v1.0.0（SKILL.md frontmatter 标注；仓库未创建 GitHub Release 标签） |
| 安装方式 | npx skills add LottieFiles/motion-design-skill，或手动复制 skills/motion-design/ 目录到本地 Agent 的技能目录 |
2. 功能介绍与亮点
这是一套面向 AI agent 的运动设计原则库：不直接生成动画代码，而是教会 agent 像专业动效设计师一样思考——先判断时长、缓动曲线、编舞节奏，再落地到任意动画技术栈（CSS、Framer Motion、GSAP、Lottie、Spring 均可）。
亮点：
- 纯知识库型技能，除主文件 SKILL.md 外还有 director（方法论深挖）、patterns（可直接套用的动画配方）、reference（时长/缓动查表）三组共 12 份参考文档
- 8 步检查清单 + 四种“运动人格”原型（Playful / Premium / Corporate / Energetic）+ 完整时长-缓动对照表，把“这段动画该多快、该用什么曲线”变成可直接套用的规则，而非泛泛的审美建议
- 覆盖从单元素动画到多元素编舞（1/3 法则、分层堆叠预算）的完整决策链，并把迪士尼动画 12 项原则逐条适配到 UI 场景
- 已被多个第三方 skill 目录站点收录展示（如 claudemarketplaces.com、awesomeskills.dev）
3. 适用场景
所属分类：前端与设计。适合前端开发者、产品设计师在设计 UI 动画、微交互反馈、页面转场、加载/成功/失败状态动画、品牌运动识别时使用；尤其适合不熟悉动效设计理论、只凭直觉调参数的开发者。
4. 跨 Agent 兼容性
- Claude Code：原生支持，README 明确列出，遵循标准 SKILL.md 格式，
npx skills add一条命令安装。 - Codex：原生支持，README 明确列出为受支持 agent 之一。
- OpenClaw：未验证，README 仅笼统声明“支持 40+ agents”，未点名 OpenClaw。
- Hermes Agent：未验证，同上，未点名。
5. 推荐理由
它把动效设计从“凭感觉调 duration/easing”变成有理论依据（迪士尼 12 项动画原则）、可复用的决策框架，跨任何动画技术栈通用，且由 Lottie 动画格式的官方团队出品、内容零代码执行，安全顾虑极低。
6. 评分
| 维度 | 分数 | 说明 |
|---|---|---|
| 受欢迎程度 | 9 | 出品方 LottieFiles 为 GitHub 认证（Verified）机构账号，创建于 2017 年，是被移动端/Web 端广泛采用的 Lottie 动画格式的官方维护方；仓库自身 706 stars、41 forks，创建 4 个月内保持稳定增长 |
| 可用性 | 9 | npx skills add 一条命令安装；SKILL.md 含完整速查表，另附 12 份深度参考文档，示例提示词可直接套用；License MIT 无付费依赖；最近一次提交 2026-05-18（距今约 2 个月） |
| 安全性 | 9 | 纯 Markdown 原则文档，不含任何脚本或可执行代码，运行时无网络请求、不要求 API Key 或凭据，内容全程可审计，未发现任何可疑指令 |
综合评分：9.0（三项均值；本站综合达标线为 ≥7.0，安全性 <6 一票否决——两项标准均满足）
安全检查清单
| 检查项 | 结果 |
|---|---|
| ① Shell 命令与权限范围 | 无——技能仅由 Markdown 文档组成，不包含任何脚本或可执行文件 |
| ② 运行时联网外发 | 无——纯本地知识库，不发起任何网络请求 |
| ③ API Key/凭据 | 不需要 |
| ④ 可疑指令 | 未发现；SKILL.md 及全部参考文档均为标准动效设计说明，无越权或注入迹象 |
| ⑤ 作者/组织信誉 | LottieFiles，GitHub 认证（Verified）机构账号，2017 年创建，公开仓库 51 个，为知名动画格式 Lottie 的官方维护方 |
| ⑥ License | MIT，清晰 |
| ⑦ 最近维护 | 最近一次提交 2026-05-18，距今约 2 个月 |
7. 跟同类 Skills 相比的优势
| Skill | 定位 | 与 motion-design-skill 的差异 |
|---|---|---|
| motion-anything（nexu-io） | 开源“聊天原生运动引擎”，直接把自然语言描述转成 WebGL 动画代码输出 | 定位是直接产出成品动画代码；motion-design-skill 不产出任何具体代码，而是教会 agent 判断“该用什么时长、缓动、编舞节奏”，可跨 CSS/GSAP/Framer Motion/Lottie 等任意技术栈复用 |
| web-design（xiaopu-ai） | 面向整体网页视觉与版式设计的通用 Claude Code 技能，强调“先出规格再写代码” | 覆盖范围是整页布局与视觉一致性；motion-design-skill 只聚焦动效这一个垂直环节，原则更细、更专 |
8. 用户评价
该技能目前在第三方平台尚无独立撰写的具名用户评价；多个 skill 目录站点（如 claudemarketplaces.com、awesomeskills.dev）收录了其功能介绍，但内容均转引自官方 README，不构成独立评价。
9. 其他补充
仓库按 skills/motion-design/ 单技能目录结构组织，除主文件 SKILL.md 外还含 director（方法论）、patterns（可直接套用的动画配方）、reference（时长/缓动查表）三组子文档，共 12 份，均为纯 Markdown，无需编译或构建步骤。
10. 安装使用方式
方式一（推荐）：
npx skills add LottieFiles/motion-design-skill方式二（手动）：将仓库 skills/motion-design/ 目录复制到本地 Agent 的技能目录（如 Claude Code 的 .claude/skills/）。
注意事项：安装后无需重启；技能在处理 UI 动画、微交互、页面转场、加载/成功/失败状态、品牌运动识别等场景时会自动触发，也可在提示词中直接要求“用 motion design principles 设计这个动画”来主动调用。
11. 注意事项
- 技能本身不生成任何动画代码，只提供设计原则与参数建议，仍需开发者或其他工具完成具体实现。
- 仓库自 2026 年 5 月 18 日后未见新提交，后续是否持续迭代有待观察。
- README 声称兼容 40 余种 Agent，但未逐一列出完整名单，OpenClaw、Hermes Agent 等生态的实际兼容情况需自行验证。