transition-sequences

Installation
SKILL.md

Transition Sequence Animations

Apply Disney's 12 principles to choreographed multi-step motion.

Principle Application

Squash & Stretch: Each element in sequence can compress/expand independently for organic feel.

Anticipation: Sequence starts with a setup phase. Brief pause or gather before motion begins.

Staging: Direct attention through the sequence. Most important element animates first or last.

Straight Ahead vs Pose-to-Pose: Plan keyframes for each step. Map the entire sequence before implementing.

Follow Through & Overlapping: Elements don't move in unison. Stagger starts by 50-100ms. Let motion cascade.

Slow In/Slow Out: Each step eases. The sequence overall should ease too - faster middle, slower ends.

Arcs: Transitions across space follow arcs. Page sliding left curves slightly, not linear slide.

Installs
207
GitHub Stars
44
First Seen
Jan 24, 2026
transition-sequences — dylantarre/animation-principles