Helps you calibrate how far to push motion beyond realism so it actually reads on screen. The core insight is that photographic accuracy usually feels dead in animation because the camera loses dimension and feedback. It breaks down exaggeration levels from subtle (1.1x for corporate work) to theatrical (2x+ for cartoons) and what to push: poses, timing, spacing, arcs. The restraint paradox is useful: push until it's clearly too much, then pull back 20%. Works across UI micro-interactions, character animation, and game feel. Most valuable for catching that common mistake where motion feels stiff because you're being too literal with physics.

skills.sh installs
562
GitHub stars
146
last updated
Aug 21, 2026

Install

$ npx -y skills add dylantarre/animation-principles --skill exaggeration-mastery --agent claude-code

Installs into .claude/skills of the current project.

Files

Exaggeration Mastery

The Truth Beyond Realism

Exaggeration isn't about making things unrealistic—it's about making things feel true. A perfect photographic copy of motion often feels dead on screen. Animation requires pushing beyond literal reality to capture the essence of movement, emotion, and intent.

Core Theory

The camera lies: Film loses dimension, haptic feedback, and environmental immersion. What reads clearly in real life often flattens on screen. Exaggeration compensates for this loss.

Essence over accuracy: Exaggeration distills motion to its essential quality. A sad slump becomes sadder. A joyful leap becomes more joyful. The caricature captures truth the photograph misses.

The Exaggeration Spectrum

Subtle (1.1-1.2x): Corporate, serious contexts. Motion feels polished but grounded. Moderate (1.3-1.5x): Consumer products, friendly brands. Motion feels alive and engaging. Bold (1.6-2x): Entertainment, games, playful contexts. Motion has personality and energy. Theatrical (2x+): Cartoons, comedy, stylized work. Motion defines the reality.

What to Exaggerate

Sponsors

Details

Repository
github.com/dylantarre/animation-principles
Category
Design & UI/UX
First seen
Jun 3, 2026

More from dylantarre/animation-principles

All 144
1motion-team avatarcreative-mechanicsmotion-team/creative-strategy-skillsA library of creative mechanics — the structural patterns that define how an ad constructs meaning between its hook, visuals, and narrative. Use this whenever d560skills.sh installs
2motion-team avatarcreative-strategy-enginemotion-team/creative-strategy-skillsStrategic framework for mapping pain/persona intersections and messaging angles. Defines the structure for organizing creative strategy, not the tactics for exe559skills.sh installs
3dylantarre avatarorchestrated-sequencesdylantarre/animation-principlesUse when building multi-part animation sequences - staggered reveals, choreographed UI, coordinated motion where multiple elements work together557skills.sh installs
4dylantarre avatarsecondary-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 installs
5dylantarre avatarexaggerated-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 installs
6dylantarre avatarcontinuous-loopsdylantarre/animation-principlesUse when creating ongoing animations - loading spinners, pulsing indicators, ambient motion, background effects, or any animation that repeats indefinitely.542skills.sh installs