11 Principles of Animation

Squash and Stretch Timing Anticipation Staging Follow Through and Overlapping Action Straight Ahead Action and Pose-to-post Action Slow In and Out Arcs Exaggeration Secondary Action Appeal

Notes from: ACM Computer Graphics, Volume 21, Number 4, July 1987, Digital Character Animation 2, Volume 1 Maestri, Digital Character Animation 2, Volume 2 - Maestri

PRINCIPLES OF ANIMATION
With Snow White Disney brought animation from novelty to art. Artists studied nature, motion. These studies led to the creation of the rules of the trade the 11 principles of animation.

11 Principles of Animation
1. Squash and Stretch - Defining the rigidity and mass of an object by distorting its shape during an action. 2. Timing - Spacing actions to define the weight and size of objects and the personality of characters. 3. Anticipation - The preparation for an action. 4. Staging - Presenting an idea so that it is unmistakably clear. 5. Follow Through and Overlapping Action - The termination of an action and establishing its relationship to the next action.

11 Principles of Animation
6. Straight Ahead Action and Pose-To-Pose Action - The two contrasting approaches to the creation of movement. 7. Slow In and Out - The spacing of the inbetween frames to achieve subtlety of timing and movement. 8. Arcs - The visual path of action for natural movement. 9. Exaggeration - Accentuating the essence of an idea via the design and the action. 10. Secondary Action The action of an object resulting from another action. 11. Appeal - Creating a design or an action that the audience enjoys watching.

Squash and Stretch

Defining the rigidity and mass of an object by distorting it's shape during an action. The most important principle! When an object is moved, it emphasizes any rigidity in the object. In real life, only the most rigid objects remain rigid during movement; anything composed of flesh will show a change of shape during movement. A standard test for animators is to draw a bouncing ball, represented by a simple circle. This test introduces the principles of squash and stretch as well as timing. The trick is to elongate the ball as it falls, flatten it as it hits, and return it to it's circular shape near the top of the next bounce. You do not need to deform all objects to show this principle; in the case of Luxo, Jr., you have a hinged object that is capable of folding in on itself (squash) and extending itself (stretch).

Squash and Stretch

Squash and Stretch

Bouncing ball has a lot of flexibiliity

Furniture is more rigid.

Expression/Facial changes These express changes in volume, but not mass! Volume ALWAYS remains constant!

Timing
Spacing actions to define the weight and size of objects and the personality of characters Gives meaning to movement! In order to make your idea's readable, it's important to spend enough (but not too much) time preparing the audience. This is done through three objectives:
Anticipation The action itself Reaction

Timing
Timing can define the weight of an object Hit a heavy ball vs. hit a bouncy ball.

Timing
If too much time is spent on any of these, you loose your audience. For example, with just two drawings, using this principle, we can illustrate many different things. Let's use a head that's facing first one direction, then another. Each "inbetween" drawing added between the two extremes changes the meaning of the scene.
No Inbetweens: The character was hit with something that almost took his head off. Three Inbetweens: The character is dodging a brick or frying pan Five Inbetweens: The character is more friendly Six Inbetweens: The character sees a good looking girl or sports car Seven Inbetweens: The character is trying to get a better look at something Eight Inbetweens: The character is searching for something Nine Inbetweens: The character is thoughtful Ten Inbetweens: The character is stretching

Timing
One thing at a time is also an important concept. Perceptions come best sequentially. Character stubs toe, recoils, reacts gives audience time to see and understand the action. Draw attention to whats about to move before it does.

Anticipation
The preparation for an action. There are three parts to an action:
Anticipation The action itself Reaction

Anticipation has several facets: without it, the audience does not know what to expect and can get lost. Animators use this principle to direct the audience to the right part of the scene at the right time. For example, in the short "Luxo, Jr.", the "dad" is looking off stage and then reacts. This lets the audience know something is coming.

Anticipation
Direct the audiences attention Reveal what a character is going to do
Shifty eyes something criminal? Lying?

To Mislead prepare audience for one thing and then jump to a surprise outcome.

Staging
Presenting an idea so that it is unmistakably clear. The eye of the audience must be led to exactly where it needs to be at the exact moment so that they will not miss the idea. Only one idea should be seen by the audience at a time. The object of interest should contrast from the rest of the scene. (something is moving at a different speed something is a different color something makes a different sound) Each idea or action must be staged in the strongest and simplest way before going on to the next idea or action. Actions should be staged in silhouette.

Staging

Staging
Personality A personality is staged so that it is recognizable; an expression so that it can be seen;. A shy child would turn their eyes down, and slightly rotate their upper body away for the gaze of another child. The child's actions reveal the fact that he is shy. When staging a personality, it is useful to use characteristics that clearly define the character. Mood A mood is staged so that it will affect the audience. The tight composition of dark trees in a dense forest, leaning in toward a scared youth; eyes glowing from within the thick; hurried breathing filling the air; the childs eye wide open. All of these elements have been clearly staged to inspire fear.

Staging

Staging

Staging
In "Luxo, Jr.", the story, acting, and emotion were heavily dependent on this principle. The audience is asked to switch often from "Dad" to "Jr" and they do this because Jr. moves faster than dad (contrast from the scene). In "Andre and Wally B." Andre wakes up and scratches his SIDE, not his stomach, to help clarify what's happening and not confuse the audience (silhouette). In "Luxo, Jr." all the action is in silhouette; the two characters are not overlapping each other.

Staging and Symmetry

Follow Through and Overlapping Action

The termination of an action and establishing its relationship to the next action. Just as "anticipation" is the preparation for an action, follow through is it's termination. In any movement, actions rarely come to a direct stop; instead, they are carried past a termination point. For example, when hitting a golf ball, you don't stop your club at the moment of impact, but follow through the swing. In "Andre and Wally B." this principle was used extensively with Wally B., on his feet, antennae, and stinger. They all dragged behind him. Also, instead of all of his feet leaving the scene, they left a frame or two apart (not really noticible to the naked eye, but it made the scene a little more believable). This is called overlapping action and helps the scene maintain a continuous flow.

Follow Through and Overlapping Action

Straight Ahead Action and Pose to Pose Action

Two contrasting approaches to the creation of movement. straight ahead - animator works "straight ahead" from the first drawing to the last, knowing where the scene fits into the story and what it must contain. He does drawing after drawing, getting new ideas along the way until the scene is concluded. pose to pose - animator plans his actions, figures out what drawings are needed to complete the scene and creates them, concentrating on poses and the relationships between the characters.

Posing the Characters

Posing presenting the character to the camera gives the audience the first impression

Slow In and Out

The spacing of inbetween frames to achieve subtlety of timing and movement. In early animation, the action was limited to be either fast or slow; however, as more pose to pose animation action came into play, animators wanted audiences to be able to see the poses. They therefore use this principle to achieve that goal. "Slowing out" of one pose and "slowing in" to another one refers to the timing of the inbetweens. If the inbetweens are grouped closer to one extreme, better results can come about. Animators use a "timing chart" to help determine where the inbetween drawings should be placed.

Slow In and Out

Arcs
The visual path of action for natural movement. Arcs, in nature, are the most economical routes for something to move from one place to another. In animation, arcs are used to make the movement more smooth.

Arcs

Exaggeration
Accentuating the essence of an idea via the design and action. The animator must go to the heart of his scene to decide what the audience needs to see exaggerated. If the character is to be sad, make him sadder; worried, make him fret; etc. When using exaggeration, all the parts of the scene must be taken into effect; the action, the emotion, the color, etc. If only one thing is exaggerated, it will seem unrealistic; likewise, if everything is exaggerated, it will be equally unrealistic. The animator must find that delicate balance that the audience will recognize; something that seems natural to them but becomes their basis of comparison. For example, in "Luxo, Jr." the lamps were modeled after the real luxo lamp, but "Jr.'s" proportions were exaggerated to give him the appearance of a child. The movement of the lamps had the feel of real physics, but was very exaggerated in order to accentuate it.

Exaggeration

Secondary Action
The action of an object resulting from another action. This principle brings heightened interest and realism. The secondary action is always kept subordinate to the primary action, so as not to draw away too much attention or conflict with the primary action. Examples we've seen include Wally B.'s feet dragging behind him and Luxo Jr.'s cord rippling behind him as he moves along.

Secondary Action
Watch the movement of the cord behind Jr. if it didnt move, we might not buy it! How about dealing with bed covers that are too short?

Secondary Action

Appeal
Creating a design or an action that the audience enjoys watching. Appeal is really anything a person likes to see; some charming quality or pleasing design that draws in an audience. "Luxo Jr.'s" feeling of a baby and parent lamp were important for the audience to feel. Also twins are unappealing to audiences -- twins are when both arms and legs are in the same position doing the same thing. This gives a very stiff appearence and audiences are lost. So, in "Andre and Wally B.", when Andre stretches, one arm is up and one is down at an angle; his feet are rotated differently, and the action of his movements are timed such that each arm acts individually; not at the same time. All of these efforts make Andre more appealing to audiences.

Appeal