The Twelve Principles of Animation

In 1981 two of Walt Disney's senior animators, Frank Thomas and Ollie Johnston, distilled half a century of studio craft into a single book, The Illusion of Life. Its beating heart is a list of twelve basic principles — rules of thumb the studio had discovered, mostly by trial and error, for making a drawing look alive rather than merely moving. They were written for pencils and paper. Yet when computer graphics arrived and animators swapped light-tables for keyframe editors, the twelve survived the jump almost untouched.

That is the striking thing about this list: it is not a list of drawing tricks. It is a list of things the human visual system finds convincing. Squash, anticipation, arcs and easing work on a hand-drawn ball, a claymation rabbit, and a fully simulated CG dragon for exactly the same reason — they match how our eyes and brains expect matter and intention to behave. So each principle has two faces: the animator's intent (what feeling it buys) and the CG technique (which knob in a modern tool actually delivers it). This page walks all twelve and pins down both.

The twelve, at a glance

Here is the whole list. Read the middle column as "why an animator reaches for it" and the right column as "where it lives in a computer-graphics pipeline". Several map onto ideas you have already met — slow-in/out is F-curve tangents, arcs are curved motion paths — because the principles are precisely the perceptual targets those technical tools were built to hit.

#PrincipleAnimator's intentComputer-graphics technique
1Squash & stretch Convey flexibility, weight and impact by deforming a shape while keeping its volume. Volume-preserving deformation (scale up on one axis, down on the others); rigging with stretchy bones or lattice/blend-shape deformers.
2Anticipation Prepare the viewer for an action with a small opposite move first (crouch before a jump). An extra pre-action keyframe that dips the F-curve backwards before the main move.
3Staging Direct the eye to what matters — clear silhouette, one idea at a time. Camera framing, depth of field, composition, lighting and contrast; layout of the shot.
4Straight-ahead vs pose-to-pose Two working methods: draw frame-by-frame for spontaneity, or set key poses then fill between. Simulation / procedural (straight-ahead) versus keyframing extremes then auto-interpolating the in-betweens (pose-to-pose).
5Follow-through & overlapping action Loose parts keep moving and settle at different times after the body stops. Offset/overlapping F-curves per appendage; secondary dynamics — hair, cloth and jiggle simulation.
6Slow-in & slow-out Actions ease into and out of poses; things accelerate and decelerate rather than snap. F-curve tangent handles — flatten the slope near a keyframe (easing / smoothstep spacing).
7Arcs Natural movement follows curved paths, not straight lines. Curved motion paths (spline interpolation of the trajectory); IK arcs; path-constrained animation.
8Secondary action Supporting movements that enrich the main one (a facial expression during a walk). Additive animation layers or extra driven channels that ride on top of the primary action.
9Timing The number of frames an action takes — sets weight, mood and physical scale. Keyframe spacing along the time axis; frame rate; retiming curves.
10Exaggeration Push the essence of an action beyond reality for clarity and appeal. Deliberately scaling deformation, spacing or poses past physical values; stylised sim tuning.
11Solid drawing Draw with real form, volume and weight in three dimensions, not flat shapes. Already three-dimensional in CG — the concern becomes believable form, weight and avoiding the twinned/symmetrical "computer" look; good modelling and rigging.
12Appeal The charisma of a character — pleasing, readable design you want to watch. Character/creature design, shape language, shading and expressive rigs; the hardest to automate.

Notice how few of these are about drawing at all. Timing, staging, anticipation and appeal are directorial and perceptual; only solid drawing was truly medium-specific, and even it survived as "give the CG form real weight and asymmetry." That resilience is why the list is still taught, verbatim, in every animation programme forty years on.

Perception, not physics

It is tempting to read the twelve as folk physics — squash because things really deform, arcs because limbs really swing about joints. Sometimes that is true. But the deeper claim of The Illusion of Life is that these principles target perception: what makes a viewer believe in weight and life, which is not the same as what a physics engine computes. A perfectly physical bouncing ball, rendered with no squash and constant spacing, looks dead. A ball that squashes twice as much as any rubber could, and hangs an extra beat at the top of its arc, looks alive.

Worked example: reading a bouncing ball

The bouncing ball is the "hello world" of animation because so many of the twelve show up in one three-second shot. Follow the trajectory below and name the principle at each moment. The ball's centre traces a smooth arc (principle 7). On the way down it stretches along its direction of travel (squash & stretch, principle 1, signalling speed). At the floor it squashes flat — a wide, brief deformation that reads as impact and weight (principle 1 again, plus timing, principle 9: the squash lasts only a frame or two).

Near the top of each bounce the ball slows in and slows out (principle 6): its vertical speed falls to zero and reverses, so the frames bunch together and it appears to hang — the beloved "floaty apex." In F-curve terms the height curve is flat at the peak (zero slope) and steep near the ground, exactly the slow-in/out spacing. If the ball has a trailing ribbon or ears, they keep moving after the ball stops and settle late — follow-through and overlapping action (principle 5). Squash it a little more than rubber ever would, and you have added exaggeration (principle 10). Six of the twelve, in one bounce.

Mostly timing, then squash. A bowling ball and a beach ball can trace the identical arc, yet the bowling ball reads as heavy because it falls in fewer frames (faster), barely squashes (rigid), and hardly bounces (loses energy). Swap those settings — more frames, a big squash, a high rebound — and the same shape becomes a beach ball. The weight is entirely in the spacing and deformation, never in the geometry.

Where each one lives in the pipeline

Grouping the twelve by the CG tool that delivers them makes the mapping concrete:

The lesson for a technical director is that the principles are not vague "art talk" bolted onto the maths — they are the design brief for the maths. A spline interpolator exists because motion should arc; tangent handles exist because motion should ease; a volume-preserving deform node exists because a squashing ball must not gain mass.

Both live in modern CG, and most shots blend them. Pose-to-pose — set the strong extreme poses, let the software interpolate the in-betweens — is the natural fit for character keyframing: you control the storytelling poses and the spacing between them. Straight-ahead — generate each frame in order, following the motion where it goes — maps onto simulation and procedural animation: a cloth solver, a particle system or a physics rag-doll is straight-ahead by nature. Explosions and fluids are straight-ahead; a hero character's acting is pose-to-pose; a character with a simulated cape is both at once.

The most common misunderstanding is to treat the twelve as a physics checklist and to "fix" animation by making it more physically accurate. It is the reverse. These are perceptual principles: they describe what convinces a viewer, and a viewer is convinced by exaggeration, not by fidelity. A squash bigger than any real material allows, an apex hang longer than gravity permits, an anticipation crouch deeper than a real athlete's — these read as more alive, not less. A physics simulation with squash and easing switched off is technically correct and looks dead. So when a shot feels lifeless, do not reach for a more accurate solver; reach for the principles and push them past reality. Physics is a starting point the animator is free — and often obliged — to break.

A note on the maths of "volume preserving"

One principle has an especially clean mathematical form. When a ball of radius r squashes, an animator must keep its volume constant or it will visually gain or lose mass. If it stretches by a factor k along one axis, the other two must shrink so that the product of the three scales stays at 1:

k \cdot s \cdot s = 1 \quad\Longrightarrow\quad s = \frac{1}{\sqrt{k}}.

So a ball stretched to k = 4\times its height must thin to s = 1/\sqrt{4} = \tfrac12 its width and depth. Rigs implement squash & stretch exactly this way — a single "squash" control that drives the perpendicular axes by 1/\sqrt{k} — which is why a well-built stretchy ball never appears to swell. Break this rule and the ball balloons on impact; that is the tell-tale sign of squash without volume preservation.