Motion Design Skill

Create purposeful, performant animations that enhance UX without overwhelming users.

CRITICAL: Check Existing First

Before adding ANY animation, verify:

1. Check for existing animation utilities:

cat package.json | grep -i "framer-motion\|gsap\|animat"
rg "motion\.|animate\(|useSpring" --type tsx -l | head -10

2. Check for existing CSS animations:

rg "@keyframes|animation:" --type css
cat tailwind.config.* | grep -A20 "animation\|keyframes"