12 Principles Of Animation

(1) Squash and Stretch

(2) Anticipation

(3) Staging

(4) Straight Ahead Action and Pose to Pose

(5) Follow Through and Overlapping Action

(6) Slow in and Slow Out

(7) Arcs

(8) Secondary Action

(9) Timing

(10) Exaggeration

(11) Solid Drawing

(12) Appeal

Squash and Stretch

Squash and Stretch gives the illusion of weight to an action. For realistic animated characters squash and stretch is subtle, but for stylized characters squash and stretch can create extreme distortion.

Squash and Stretch

One important concept to keep in mind when creating squash and stretch is to maintain volume. If you consider a sack of flour, when you push down on one part of the back the flour moves to another part of the sack. This is the same way squash and stretch should be handled on a character.

Squash and Stretch

The method used to squash and stretch a character is based on how the character is rigged. The character does not have to deform to produce squash and stretch. When a character takes a step and falls forward with the step they crouch down to simulate the weight falling on the front foot.

Different Methods of Creating Squash and Stretch

• Posing the Skeleton

• Scaling

• Skeletal Deformation

• Lattices and other Deformers

• Dynamics

Anticipation

Anticipation prepares the viewer for an action that the animated character is about to perform. When an animated character is going to make a long jump for example they wind up and and move backward before they make a move forward toward the jump. Anticipation is used for “announcing the surprise” in addition to building suspense for any action that is about to occur.

Follow Through and Overlapping Action

When a characters main body comes to a stop, there is still movement in other parts of the character like hair and arms. The weight from the main body is transferred to the other parts of the body and they continue to move even the the main body has come to a stop.

StagingStaging is the “presentation of any idea so that it is completely and unmistakably clear.” An animated characters location and position should clearly communicate to the viewer the attitude and mood of the character in that particular scene. Staging directs the viewer’s eye toward the intended action or “story point”.

Mise en scèneStaging is about the translation of the mood and motivation of a scene into character positions and actions, including camera locations. Staging is sometimes referred to as Mise en scène. Mise en scène can be defined as everything that appears before the camera and its arrangement which include sets, props, actors, and lights.

Slow In and Slow Out

In order to animated action more life-like, animators put more frames at the beginning and end of an action with fewer in the middle during the main action. This allows the viewer to clearly see the strong poses during an action.

Slow In and Slow Out

Slow In and Slow Out is achieved by slowing the beginning and the end of a character action while at the same time speeding up the motion in between. Holding the beginning and end of the action also creates anticipation and follow through.

ArcsThe actions of most organic objects follow an arc or circular path rather that an linear path. Arcs create a visually pleasing action with better flow. When a character’s head turns, arm moves or jumps the motion is created in a circular path

.

Arcs

Linear motion that does not follow an arc comes off as sinister, constrained or mechanical. In order to give animated character more organic motion, animators pay specific attention to the paths of motions.

Secondary Action

Secondary action reinforces the main action. When a character is walking the basic walk is the main action and arm swings, head, hair, and neck movement are thought of as secondary action.

Secondary Action

Secondary actions are small motions that complement the main action of the shot. They are usually created after the main action has been animated. Once the dominant action of shot is completed, subtle motion is added to accentuate the main action.

Timing

The amount of key frames in an animation determines the amount of time needed for the action to take place. It is important for the action to not be too fast or too slow or it will not read correctly. The length of time needed for an action take place can also be used communicate a characters attitude or personality.

Timing

Timing is the exact moment and amount of time a character spends performing an action. Adjusting timing allows animators to add emotion and reason to a character’s motions. Character actions can be moved to different points in the timeline or the action can be sped up or slowed down.

Exaggeration

Exaggeration is the caricature of realism. In order to convey that a character is performing an action, an animator needs to create a convincing performance by exaggerating the action. This involves pushing the action to extremes without distorting it from its original intention.

Key FramesKeyframes are key moments that define an animated sequence. This process is based on traditional hand drawn animation where an animator draws the key positions of an animated sequence. In betweening is the process of filling in all the frames in between the key frames. In some cases a more experience senior animator creates all of the key frames for a sequence, and then a junior animator goes in a fills in all the frames in between.

Key Frame Interpolation

In most 3D software packages key frame interpolation is used to fill in the frames in between key frames. This process involves averaging the animation information of the key frames to find the characters position at a position in time in between the key frames.

Linear Interpolation

Linear interpolation is the simplest form of key frame animation. Linear interpolation averages the animation information from each keyframe and produces evenly spaced in betweens. This can produce mechanical looking motion due to the fact that abrupt changes in speed and direction occur at every keyframe. In the graph editor linear interpolation creates straight lines that connect keyframes to one another.

Curved Interpolation

Curved interpolation averages the animation information from each key frame taking into account the change in variation over time. In the graph editor this produces a smooth curve that connects the key frames. By default most 3D packages use curved interpolation to create the frames in between key frames.

Cartoon Animation by Preston Blair

The Animator’s Survival Kit by Richard Williams

The Illusion Of Life by Frank Thomas and Ollie Johnston

Animals In Motion by Eadweard Muybridge

The Human Figure in Motion by Eadweard Muybridge

*Digital Character Animation 2 by George Maestri

Animation Reference