Orchestrated Sequences
When you need multiple elements to animate together without looking like chaos, this gives you the timing strategies and Disney principles to make it work. It's built around staggered delays, easing families that create cohesion, and treating the whole thing like a composed performance rather than individual animations. The accelerating and decelerating stagger patterns are immediately useful for card grids and dashboard reveals. The key insight is right: you're composing in time the same way you compose layout in space. Most developers either skip orchestration entirely or overdo it, so having the concrete timing values and easing curves here keeps you in the sweet spot.
- skills.sh installs
- 557
- GitHub stars
- 146
- last updated
- Aug 21, 2026
Install
$ npx -y skills add dylantarre/animation-principles --skill orchestrated-sequences --agent claude-codeInstalls into .claude/skills of the current project.
Files
Orchestrated Sequences
Orchestrated sequences coordinate multiple elements across time. Like a conductor directing an orchestra, you control when each element enters, how it moves, and how elements relate.
Disney Principles for Orchestration
Ensemble Coordination
Squash & Stretch: Unified style - all elements should share consistent elasticity. Mix bouncy and stiff looks chaotic.
Anticipation: Staggered preparation - lead element anticipates first, others follow in sequence.
Staging: Clear hierarchy - primary action leads, secondary elements support but don't compete.
Straight Ahead/Pose to Pose: Pose to pose mandatory - choreography requires precise timing control.
Follow Through: Cascading settle - elements land in sequence with overlapping follow-through.
Slow In/Slow Out: Shared easing family - use variations of same curve for cohesion.
Arcs: Coordinated paths - elements should move in complementary directions, not randomly.
Secondary Action: Intentional support - every element has a role in the composition.
Timing: The heart of orchestration - stagger delays, duration variations, tempo changes.
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/dylantarre/animation-principles
- Category
- Design & UI/UX
- First seen
- Jun 3, 2026
More from dylantarre/animation-principles
All 144- Universal Emotion556
- Loaders Spinners554
- Forms Inputs553
- Secondary Action Mastery551
- Social Media551
- Attention Management550
- Brand Strategist548
- Exit Animations547
- Exaggerated Clarity546
- Accordions Dropdowns545
- Straight Ahead Pose Mastery543
- Timing Calibration543
- Continuous Loops542
- Lists Grids542
- Urgency Action542
- User Feedback Clarity542
- Power Confidence540
- Feedback Indicators539
- Universal Patterns539
- Continuous Infinite535
- Emotional Disconnect534
- Problem Diagnosis534
- Responsive Adaptive534
- State Changes534
Recommended
More Design & UI/UX
secondary-action-masterydylantarre/animation-principlesUse when enriching primary animations, adding supporting details, creating depth in motion, or making scenes feel alive without distracting from main action.551skills.sh installsexaggerated-claritydylantarre/animation-principlesUse when motion needs to read clearly and powerfully—broad comedy, action highlights, important story beats, or any moment that must unmistakably communicate to546skills.sh installscontinuous-loopsdylantarre/animation-principlesUse when creating ongoing animations - loading spinners, pulsing indicators, ambient motion, background effects, or any animation that repeats indefinitely.542skills.sh installsuniversal-patternsdylantarre/animation-principlesUse when creating any animation type - provides foundational timing, easing, and principle application that applies to all motion in interfaces.539skills.sh installscontinuous-infinitedylantarre/animation-principlesUse when building ongoing loop animations - loading states, ambient motion, background effects that run indefinitely without user fatigue535skills.sh installsproblem-diagnosisdylantarre/animation-principlesUse when animation "feels wrong" but you can't pinpoint why—debugging floaty movement, stiff characters, unclear action, or any motion that isn't working and ne534skills.sh installs