Animation Principles Intermediate

This one's about combining animation principles rather than learning them in isolation. It walks through how principles interact: squash and stretch paired with timing for volume preservation, anticipation matching follow through for rhythm, secondary action supporting staging instead of fighting it. The approach is practical, showing how easing applies along arc paths and how timing windows dictate deformation intensity. If you're past the basics and wondering why your animations feel disconnected even when individual principles look right, this covers the interdependencies that make movement cohesive. Short at 42 GitHub stars, but the synergy framework is solid.

GitHub stars: 70
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add dylantarre/animation-principles --skill 'Animation Principles - Intermediate' --agent claude-code

Installs into .claude/skills of the current project.

Files

Combining Principles for Stronger Animation

You can apply individual principles. Now learn to weave them together and understand their interdependencies.

Principle Synergies

Squash/Stretch + Timing

Volume preservation is key. Faster motion = more stretch. The timing dictates the degree. A 2-frame anticipation needs less squash than a 6-frame one.

Anticipation + Follow Through

These are mirrors. Anticipation magnitude should roughly match follow through. Big wind-up = big settle. They create rhythmic bookends to any action.

Staging + Secondary Action

Secondary actions must support staging, never compete. If staging says "look at the face," secondary action in hands should point attention there, not away.