The 12 Principles of Animation

In 1981, Disney Animators Ollie Johnston and Frank Thomas wrote a book that set to outline the key principles behind the magic of Disney's work. Basing their book on the work of previous Disney animators from the 1930s onwards, it details their efforts to create more realistic-looking animations by having their characters abide by the basic laws of physics and outlining more abstract matters such as character appeal and emotional timing. They created 12 principles of animation that would become stapled into the process of learning the art. Some may seem more important and recognisable in the viewing of animation than others, but they all play their part in creating smooth and believable animation sequences. I'll be looking at the "Roger Rabbit Shorts" for my examples of how each principle is shown.

Squash and Stretch

Possibly the most vital principle in truly bringing animation to life, Squashing and Stretching gives the illusion of weight and volume to an object/character as it moves. It is also primarily used in dialogue, giving faces much more expression to create believable movement. 

The rattle hits the ground which creates a squashing effect, giving the illusion that the rattle is a lot bouncier than it would be in reality.

It then bounces back up off the ground and stretches, making it a lot more obvious to the audience that it's travelling upward in a fast motion.

Anticipation
Anticipation is the preparation of an action that is about to be performed by a character. For instance, if a character is about to swing a baseball bat, they wouldn't just swing the bat from a straight position, they would bring the bat up behind their head to get some force behind it. In animation, highlighting that motion is a key factor in making these actions seem more life-like. Anticipation can also aid comical actions, such as a character falling from a great height/into danger and having them stop in mid-air for a few seconds. This is used mostly to make the character aware of what's about to happen, with the gag being their reaction. This action has been used in cartoons for decades, most notably in the Wile E. Coyote cartoons.

Roger stops in place,  realising he is about to fall into the spinning cogs. 

His reaction, in the form of a close-up and an "uh-oh".

The fall itself.

Staging
Staging, in short, is setting the scene. Using different shots, camera angles, lighting and facial expressions, the mood and tone for the scene are set so that the audience can easily follow the story. The background design is also important, as it should never obscure or compete with the animation. It should interact with the rest of the animation as a unit in a seamless way.

From the angle of the shot, to Roger and the doctor's expressions, the mood of the scene can be easily pinpointed. Here, Roger is scared about being operated on after being captured and strapped into the chair. The angle shows the doctor's surrounding him to give off a threatened and intimidating feeling.

Straight Ahead and Pose to Pose
Mainly used in fast-paced action, Straight Ahead animation uses a drawing as a starting point, then works it's way through to the end of the scene by following each drawing. Size, proportion and volume can be lost this way, but it has a fresher look to it. Pose to Pose is similar, but more planned out than Straight Ahead animation. It uses key drawings that bare done at intervals throughout the scene which helps to keep proportions etc. in balance and more consistent. This method is mainly used to aid the lead animator in putting more focus on the planning of the animation as they can pass on the keys to the assistant(s).


Follow Through and Overlapping Action
Mainly applied with clothes and hair, following through in animation is where (f example) somebody is running and suddenly comes to a stop. Their clothes/hair do not immediately stop as they do, but instead go back to a still, neutral position a few moments after they complete the path of the action. Overlapping action is where the clothes/hair are following the main body as they are moving. For example, Roger Rabbit's long ears flow behind him in the direction of movement when he performs some form of movement. The ears have to "catch up" when he goes from a still to moving position and vice-versa. 

As you can see, Roger's ears flap behind him as he is propelled forward through the air.

Ease-In and Ease-Out
This principle is the softening of an action. It is achieved by adding more frames after the start pose and before the end pose to make the action slower in certain places for a smoother transition between poses. Basically, more drawings means a slower action, and fewer drawings means a faster one. Whichever is best to use depends on the situation within the animation.


Arcs
Practically all actions, especially humans and animals, follow some form of arc or slightly circular path. This keeps characters from looking too unnatural and stiff. All arm, head and even eye movements are conducted on Arcs.

I have added a white line to show the path of Roger's arm. Here it shows that his arm lifts up in a natural, curved movement.

His arm comes back down again, using the same technique.

He then lifts his foot up with his hand, where both lift from the ground in a smooth arc to create a natural and more believable looking action.

Secondary Action
A secondary action is where the character performs certain smaller actions or expressions to compliment the bigger action. This can be something like a man angrily walking towards someone, where the stomping legs would be the main action, and the facial expression and upper body movement would be the secondary.

Here, the main action would be Roger walking with the bag. The secondary actions are his facial expression (indicating tiredness) , slow movement and his shaking muscles (showing signs of struggle).

Timing
Funnily enough, to master the ways of timing in animation you need one key thing: time. Trial and error is important factor in refining a personal technique. More drawings mean a slower action, while fewer mean a faster action. Using a variety of the two, more texture and visual pleasure is added to the scene. In animation, twos (where each drawing is shown for two frames) are used most often. 


Exaggeration
Exaggeration is the boosting of a single action/expression that is used to get the point across more clearly. Care must be taken, however, as not to excessively use this to extreme levels.

Here, Roger is riding a rollercoaster. Where he is going so fast, his face is exaggerated to pull back, with the folds of his skin going back far more than they normally would.

Solid Drawing
The principle of animation itself is based around the idea of bringing things to life. When somebody animates, they are basically using colour and movement to replicate life. Therefore, to keep things right, drawings must show the following; form, weight, volume, solidity and give off the illusion of three-dimension. If these things are not present, then the animation won't look very natural and won't draw the audience in as much.


Appeal
All animated characters must have some form of appeal to be successful. This way, the audience can be engaged in the character's happenings and even feel emotion from them. Appeal can be anything, whether it's comical, cute, heroic, villainous etc. "Like all forms of storytelling, the feature has to appeal to the mind aswell as the eye.

Roger and Baby Herman are two great characters that fit so well together, that they give off a lot of appeal.