top of page
  • Emma Ford

The 12 Principles of Animation

Updated: Jan 2, 2021

As written by Frank Thomas and Ollie Johnston

1. Squash and Stretch

Objects get longer to emphasises Speed, Momentum, Weight and Mass.

more squash and stretch = softer object

less squash and stretch = stiffer object

The volume of the object must remain the same (as the object gets longer it also gets thinner.

2. Anticipation

When a character prepares for action it makes it more realistic.

Anticipation helps communicate actions to the audience, before they happen, by preparing them for the next action.

3. Staging

Staging is the presentation of any idea so that it is completely and unmistakably clear. It applies to many aspects of animation :

  • acting

  • timing

  • camera angle and position

  • setting

The idea is to be in full control of where the audience is looking. Focus on one action and don't have too many things happening at once.

Also consider the camera - when to be close up, and when to be further away.

Far away for big actions, Close up for expressions

Main action should be in the centre or on one of the thirds of the screen.

If a character is facing to the side of the screen then there should be more space in the direction they are looking

Unless someone is sneaking up on them - this means they are no longer the main character

4. "Straight Ahead" and "Pose to Pose"

This describes the two methods used to animate drawings.

Straight Ahead means to animate action as you go, frame by frame.

Pose to Pose means to a draw the beginning and the end of the action then go back and draw the in-between poses.

Pose to Pose is usually used to animate the main action because it means that you know exactly where the character is going to end up. Straight Ahead is usually used to separately animate secondary action like clothing or hair.

This mess of lines illustrates the start and the end of an action in my animation. It is part of a much larger sequence but it demonstrates how the line drawings look for each end of the action and where the character starts and ends.

This is the start (left) and end (right) pose side by side.

5. Follow Through and Overlapping Action

These are used to demonstrate appendages that drag behind the body in action. They are associated with a technique called Drag.

Follow Through refers to the way parts of the body continue to move after the main body has stopped.

Overlapping Action describes the off set between the timing of the body and it's other parts.

Drag describes the technique of delaying the movement of individual body parts in relation to the movement of the main body.

All of these words describe different aspects of the same thing and add realism to the character.

The amount of drag, follow through and overlapping action says something about the mass of an object.

A small amount = a solid or rigid object

A large amount = a soft or flowing object

The appendages affected by these things are added and animated after the main animation is finished.

6. Slow In and Slow Out

Movement starts slowly, builds speed and ends slowly.

Without slow in and slow out movement feels mechanical and unnatural.

Drawings should be evenly spaces, with the drawings being closer together at the beginning and end of the action.

More drawings = slower action

7. Arcs

Living creatures move in a circular path or arc. Animated movement should follow this arc rather than go in a straight line to make it look more realistic.

These arcs are often visible in animations that involve weapons etc though it is often a fragment of the arc that is shown.

8. Secondary Action

Often associated with overlapping action but is a very different thing.

Gestures that support the main action to add more dimension to the character.

e.g. When this is animated, the motion of my character's left arm rising as he swings the sword with his right arm here is a secondary action. His hair and clothing are overlapping actions.

9. Timing

The personality and nature of an animation is greatly affected by the number of frames inserted between each main action.

Lots of drawings close together = slow action

Very few drawings set far apart = fast action

One simple action can have ten different meanings depending on how many frames are in between.

The standard frame rate for animation is 24 fps, for film it is 30fps and for games it is 30fps but on the new generation consoles games are now running at 60fps.

If one drawing is made for each frame, that is called drawings on ones.

If one drawing is made for every two frames it is called drawing on twos and so on.

It is very common for animators to draw on twos rather than ones for several reasons. 1. It cuts the work in half

2. Slow actions look smoother because it is difficult to get the precision to draw on ones.

3.It looks better for fast action because it is more lively and evenly timed.

Drawing on ones in necessary for very fast action with big movements e.g. a scramble or flurry of activity.

10. Exaggeration

Every action, pose or expression can be taken to the next level to increase it's impact on the viewer.

Make the essence of the action more real and apparent.

Exaggeration doesn't mean more distorted, it means more realistic and convincing.

If a character is sad, make them sadder

11. Solid Drawing

This refers to making forms feel like they are in three dimensional space with volume, weight and balance. It requires knowledge of 3D drawing.

12. Appeal

Characters should be somewhat pleasing to look at - they should have some kind of charismatic aspect to like about them - this doesn't just mean good looking (though it definitely helps in my humble opinion) it can also mean interesting.

Dynamic Design boosts appeal

  1. Use a variety of shapes

  2. Play with proportions

  3. Keep it simple - with animated characters you need to pick and choose which details you want to keep and which ones you don't want, because you will need to draw them hundreds of times.

Here you can see the difference between the illustration and basic animation (the animation does still need work and shading etc, but I think this is a good demonstration in the difference in drawing detail)

3 views0 comments

Recent Posts

See All
Post: Blog2 Post
bottom of page