
Follow Through Overlapping
This teaches Claude how to animate things that don't stop all at once. When a character stops moving, their hair keeps swinging. When you dismiss a modal, background elements should settle after the foreground. The skill breaks down drag hierarchies (root moves first, appendages lag behind based on mass and flexibility), timing offsets (2-4 frames per level at 24fps), and settling curves that ease out with slight overshoot. Covers both UI work like pull-to-refresh elastic snapping and character animation like tail motion lagging behind body movement. The stagger formula and concrete frame counts make it actually implementable rather than just theory.
- skills.sh installs
- 578
- GitHub stars
- 146
- last updated
- Aug 21, 2026
Install
$ npx -y skills add dylantarre/animation-principles --skill follow-through-overlapping --agent claude-codeInstalls into .claude/skills of the current project.
Files
Follow Through & Overlapping Action Mastery
The Momentum Principle
Nothing stops all at once. When a character halts, their hair keeps moving. When a car brakes, passengers lurch forward. Follow through and overlapping action capture how different parts of a system respond to forces at different rates—the principle that makes animation feel physically grounded.
Core Theory: Two Related Concepts
Follow Through: When the main body stops, appendages continue moving due to momentum, then settle. The termination behavior of motion.
Overlapping Action: Different parts move at different rates throughout motion, not just at stops. Hair doesn't start moving when the head starts—it drags behind, then catches up. The continuous offset of timing.
The Drag Hierarchy
Parts further from the root of motion drag more:
- Root (hips, torso): Moves first, stops first
- Primary extensions (limbs, head): Slight delay
- Secondary extensions (hands, facial features): More delay
- Tertiary elements (fingers, hair, cloth): Maximum drag
Each level follows the previous, creating cascading waves of motion.
Physical Properties Affecting Drag
Sponsors
Details
- Repository
- github.com/dylantarre/animation-principles
- Category
- Design & UI/UX
- First seen
- Jun 3, 2026
More from dylantarre/animation-principles
All 144- Gaming Entertainment578
- Appeal Mastery577
- Accessibility Advocate576
- Anticipation Mastery575
- Entrance Animations572
- Modals Dialogs572
- Slow In Out Mastery572
- Spatial Thinking572
- Ux Researcher571
- Excitement Energy570
- Anticipation Payoff568
- Calm Relaxation566
- Joy Delight566
- Attention Grabbers565
- Brand Consistency565
- Timing Principle Mastery565
- Micro 100 200ms564
- Exaggeration Mastery562
- Performance Optimization562
- React Spring562
- Enterprise B2b558
- Cards Containers557
- Orchestrated Sequences557
- Universal Emotion556