motion-design-skill

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

motion-design-skill

Catalogue stub — full package: lottiefiles/motion-design-skill

目录占位符 — 完整包：lottiefiles/motion-design-skill

Decision tree

决策树

Is the package already installed? Check: your agent's skills directory contains
```
motion-design-skill
```
with content beyond this stub.
- Yes → invoke
```
motion-design-skill
```
  and proceed
- No → go to step 2

Which agent are you on?

Claude Code →
```
npx skills add LottieFiles/motion-design-skill
```
— or send
```
! npx skills add …
```
as a chat message (add
```
-g
```
for global, omit for project-only)

Cursor →

npx skills add LottieFiles/motion-design-skill

Other →

npx skills add LottieFiles/motion-design-skill

or see GitHub README

该包是否已安装？ 检查：你的Agent技能目录中是否包含带有完整内容的
```
motion-design-skill
```
（而非仅本占位符）。
- 是 → 调用
```
motion-design-skill
```
  并继续操作
- 否 → 进入步骤2
你使用的是哪种Agent？
- Claude Code →
```
npx skills add LottieFiles/motion-design-skill
```
  — 或在聊天消息中发送
```
! npx skills add …
```
  （添加
```
-g
```
  参数表示全局安装，不添加则为仅当前项目安装）
- Cursor →
```
npx skills add LottieFiles/motion-design-skill
```
- 其他 →
```
npx skills add LottieFiles/motion-design-skill
```
  或查看GitHub README

Install command

安装命令

bash

npx skills add LottieFiles/motion-design-skill

bash

npx skills add LottieFiles/motion-design-skill

Invoke after install

安装后调用方式

Skill name:
```
motion-design-skill
```
Trigger phrases: "motion design", "animation principles", "LottieFiles", "Disney principles UI", "timing curves"

技能名称：
```
motion-design-skill
```
触发短语："motion design"、"animation principles"、"LottieFiles"、"Disney principles UI"、"timing curves"

What it does

功能说明

Official LottieFiles motion design principles skill. Covers timing curves, easing functions, animation choreography, and Disney's 12 classic animation principles adapted for UI contexts. Helps agents reason about when to animate, how to choose easing, how to sequence compound animations, and how to balance energy and weight in motion. Implementation-agnostic — the guidance applies equally to CSS transitions, GSAP, Framer Motion, Lottie, or any other animation toolchain. Supports 40+ AI coding agents.

官方 LottieFiles 动效设计原则技能。涵盖时间曲线、缓动函数、动画编排，以及适配UI场景的迪士尼12项经典动画原则。帮助Agent判断何时添加动画、如何选择缓动效果、如何编排复合动画，以及如何平衡动效的活力与重量感。与实现方式无关——该指导同样适用于CSS过渡、GSAP、Framer Motion、Lottie或其他任何动画工具链。支持40余种AI编码Agent。

When NOT to use

不适用场景

GLSL/shader-level animation (use
```
shader-dev
```
)
Specific framework implementation (use
```
gsap-skills
```
or
```
framer-motion-skills
```
)

GLSL/着色器层级的动画（请使用
```
shader-dev
```
技能）
特定框架的实现细节（请使用
```
gsap-skills
```
或
```
framer-motion-skills
```
技能）