motion-design-skill

Original：🇺🇸 English

Translated

Official LottieFiles motion design principles — timing curves, easing, choreography, Disney's 12 principles adapted for UI. Implementation-agnostic: works with CSS, GSAP, Framer Motion, Lottie. Supports 40+ agents.

4installs

Sourcepodo/design-agent-skills

Added on2026-08-16

NPX Install

npx skill4agent add podo/design-agent-skills motion-design-skill

SKILL.md Content

View Translation Comparison →

motion-design-skill

Catalogue stub — full package: 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

Install command

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"

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.

When NOT to use

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

motion-design-skill

NPX Install

Tags

SKILL.md Content

motion-design-skill

Decision tree

Install command

Invoke after install

What it does

When NOT to use