skills/dylantarre/animation-principles/Animation Principles - Deep Dive

Animation Principles - Deep Dive

SKILL.md

Complete Animation Principles Reference

Comprehensive technical guide to Disney's 12 principles with implementation details.

1. Squash and Stretch

Definition: Deformation of objects to show flexibility, weight, and motion.

Technical implementation:

  • Volume must remain constant (area preserved)
  • Stretch along motion path at velocity peaks
  • Squash perpendicular to impact surface
  • Ratio guidelines: 20-50% for cartoony, 5-15% for realistic

Applications: Facial expressions, body mechanics, object interactions, impact effects.

2. Anticipation

Definition: Preparatory action preceding main action.

Technical implementation:

  • Direction opposite to main action
  • Duration proportional to action magnitude
  • Typical ratio: 1:3 anticipation to action frames
  • Can be minimized for surprise effects

Applications: Jumps, throws, emotional shifts, scene transitions.

3. Staging

Definition: Presentation of idea for maximum clarity.

Technical implementation:

  • Silhouette test: action readable as solid black shape
  • Single focal point per composition
  • Background contrast supports subject
  • Camera angle serves story point

Applications: Every shot, pose choice, camera placement, lighting design.

4. Straight Ahead and Pose to Pose

Definition: Two fundamental animation approaches.

Straight ahead: Sequential frame creation. Organic, spontaneous, harder to control timing. Pose to pose: Key poses first, breakdowns second, inbetweens last. Controlled, plannable, can feel stiff. Hybrid: Keys pose-to-pose, overlapping elements straight ahead.

5. Follow Through and Overlapping Action

Definition: Continuation of motion after primary action stops.

Technical implementation:

  • Drag: appendages trail behind main mass
  • Follow through: continuation past stop point
  • Overlap: different parts move at different rates
  • Settle: oscillating return to rest

Hierarchy: Root leads, extremities follow. Heavy before light.

6. Slow In and Slow Out

Definition: Spacing variation showing acceleration/deceleration.

Technical implementation:

  • Ease in: bunched drawings at motion start
  • Ease out: bunched drawings at motion end
  • Middle drawings spread apart (fast portion)
  • Custom curves for specific effects (bounce, snap, drift)

7. Arc

Definition: Curved motion paths reflecting natural movement.

Technical implementation:

  • Track motion paths for all moving elements
  • Arcs created by rotation around joints
  • Projectiles follow parabolic arcs
  • Breaking arcs: mechanical, sudden, intentional effects

8. Secondary Action

Definition: Actions supporting primary without distracting.

Technical implementation:

  • Subordinate timing to primary action
  • Support emotional content of scene
  • Add on separate pass after primary is working
  • Remove if it competes for attention

9. Timing

Definition: Frame count determining speed and weight.

Reference points:

  • 1-2 frames: instant/invisible
  • 4-6 frames: fast/snappy
  • 8-12 frames: normal action
  • 16-24 frames: slow/heavy
  • 24+ frames: very slow/deliberate

Context-dependent: same frame count reads differently based on action type.

10. Exaggeration

Definition: Amplification of reality for clarity and impact.

Technical implementation:

  • Identify essence of action/emotion
  • Push poses beyond realistic range
  • Maintain internal consistency
  • Style-appropriate: match project aesthetic

11. Solid Drawing

Definition: Three-dimensional form and weight in drawings.

Technical implementation:

  • Consistent volume through motion
  • Anatomical understanding (bones, muscles)
  • Weight distribution and balance
  • Perspective and foreshortening accuracy

12. Appeal

Definition: Compelling quality that attracts viewer attention.

Technical implementation:

  • Clear, readable shapes
  • Distinctive silhouettes
  • Asymmetry in poses and design
  • Appropriate complexity level (simple reads faster)

Appeals to: visual interest, emotional connection, design quality.

Weekly Installs
0
GitHub Stars
17
First Seen
Jan 1, 1970