Readings 3: Principles of Animation

by Mike Gleicher on January 27, 2011 · 35 comments

in Assignments,Readings

Many of you have already been given this assignment in another class (either Games or Visualization). But this stuff is so fun/useful that you’ll want to see it again.

  • The “reading” part of this assignment is to read one of the Illusion of Life versions (either Chapter 3 or the 1981 edition, or the preface and Chapter 1 of the newer version below), and the Lasseter paper. If you have already read these for a previous class, (and that is a lot of you!) or if you are just into the topic, try to find another paper to read where these principles are applied in user interfaces or presentations or something (some ideas are below).
  • The “watching” part of this assignment is to find some cartoon (that is NOT discussed in a reading) to watch and see if you can identify the principles. There are tons of things on the web. Note: some genres of animation do not show the principles as much as others. Badly done animation (or some genres that explicitly try to not follow the principles to achieves a particular look) are notable because you will notice how they do not follow the principles.
  • The second “watching” part is to observe things in the real world, paying attention to how they move. Try to develop an appreciation for the qualities of movement in the real world, and how this contrasts with cartoon movement (and with movement of things on a computer screen).
  • The “writing” part of this assignment is to post a comment to this note, after you’ve done the readings. In it, say what you’ve read, and what you’ve watched. Give your thoughts on the principles (especially things that might have suprised you when you read them). And gives some examples of what you saw from the watching parts.
  • Finally the “try it out” part: for Assignment 2B you will be making an animation, and you’ve been asked to try to incorporate some of these principles. Probably, the main thing you’ll learn is that its hard.

Please do the reading and writing parts of this assignment before Tuesday night, February 1st, so I can read over it before we discuss it in class on Wednesday, Feb 2.

The readings:

We’ll be discussing / trying to learn about the “traditional” principles of animation. Much of this was developed by artists at the Disney studio in the late 20s and 30s.

The classic reference is actually a “popular press” art history book about Disney Animation (its a coffee table book), that animators discovered – and then realized it was out of print. It’s a coffee table art book – not necessarily something meant for either animators or computer scientists to learn from. But it is fabulous, and full of great examples from classic Disney films:

  • Johnson and Thomas. Disney Animation: The Illusion of Life. Several editions (Aberville Press, 1981 is the “original” I think). Chapter 3:The Principles of Animation. (26MB download)

Because so many artists wanted this book, it has been reprinted many times (I own 3 different reprints). Curiously, one of the editions is more focused on teaching artists. In this version, Chapter 1 is the principles (very similar to Ch3 in the original). The preface is a good introduction to animation pre-“Principles” (which is good for understanding them). And Chapter 2 is a great summary of how they made the movies (irrelevant for class).

John Lasseter was a Disney animator who went to work with a small company of graphics hackers. The company grew and grew and grew and now everyone knows Pixar. His SIGGRAPH 1987 paper was a seminal work where he introduced the graphics world to the principles of animation. The basic content is the same as the Johnson and Thomas chapter, but its more condensed, and the examples are from Pixar films. 20+ years later, this paper is like the Disney paper in that its historically interesting as well as artistically/technically important.

  • John Lasseter. Principles of traditional animation applied to 3D computer animation. SIGGRAPH 1987. (acm site with PDF). Note, there are many summaries of this paper on the web. Here’s one by a well-known animator. But do read the original. (well, you’re even better off reading a Disney thing first, then reading this for historical context).

There are many papers that explore how the animation principles can be used to make user interfaces and presentations more appealing and effective, and try to relate it to psychology and education. (the disney folks did not consider this when they invented them). I searched for “animation principles in the user interface” and got a ton. Some that I think are notable :

  • “Animation: from cartoons to the user interface” by Chang and Ungar. (circa 1993, but a first try). (acm DL)
  • “Applying cartoon animation techniques to graphical user interfaces” by Thomas and Calder (acm DL). I haven’t read this one myself, but it is in a good journal.
  • “On Creating Animated Presentations” by Zongker and Salesin. (acm DL – the project page is unfortunately gone). This is interesting, although I am not totally convinced about the actual system they built. I am not sure he used this for “Chicken, Chicken, Chicken, …”

{ 34 comments }

xlzhang January 30, 2011 at 9:10 pm

Read: Preface – Ch. 1 of The Illusion of Life (newer version), Lasseter Paper.

Watched: Clips of Snow White, Cinderella, The Princess and the Frog

When reading The Illusion of Life and observing the illustrations within the chapters, my first impression was that the principles treat with mostly non-human subjects. This struck me because I remember that when watching early animated films as a child, it was mostly the non-human characters that evinced the most emotion. For instance, in Cinderella and Snow White, I always felt that the titular characters were not as sympathetic as their supporting cast, because in these earlier films not enough emphasis was placed on their facial expressions and other movements as was placed on the mice, and the dwarves. After reading these papers I have come to the conclusion that this is because animating a human subject forced the animator to be more restrained than in the treatment of anthropomorphic, non-human subjects.

The most important sentence in the Illusion of Life chapters, in my opinion, was the observation made by an animator that Walt Disney always wanted more realism in the work that was shown to him, but then consequently always complained that it wasn’t exaggerated enough. This seemingly paradoxical point of view is actually vital to the quality of animation. Many of the principles of animation, such as follow through and squash/stretch, focus on making movements more exaggerated, and therefore somehow more believable, pleasing, and emphatic. This is the difference between the old treatment of humanoid characters and the approach adopted in later animated films. Whereas Snow White rarely evinces much in the way of facial expression, the human characters in The Princess and the Frog, for instance, have just as exaggerated facial expressions and movements as non-human characters have always had. When I watch Cinderella and Snow White I get the distinct impression that the main characters are not the stars of the show, I do not feel that way about more recent films starring human characters.

After reading and watching things in real life and in animation, I wonder if the actors on live action films unconsciously apply principles analogous to the principles of animation, and this theme of making things seem more real through carefully applied exaggeration. Certainly the way that human beings move in real life seems much more subtle than they do in animation. So does a good actor deliberately place exaggerated emphasis on mundane lines, make sure movements are anticipated, draw out movements unnecessarily to give a similar effect to squash/stretch? I think so, and that is why characters in the best films can sometimes seem larger than life.

gleicher February 1, 2011 at 7:46 pm

The connection between animation and acting is quite big actually. And it goes both ways…

Aaron Bartholomew January 31, 2011 at 9:21 pm

What I read:
To me, the Principles of Animation presented here suggest the techniques to achieve the underlying goal of “amplification through abstraction”; or, how simplicity can ultimately convey a greater representation of emotion than realism (which may lose the emotion in the nuances of so much detail). This is most apparent with: squash&stretch (that bag of flour is more lifelike than a lot of people I know), anticipation (where the character’s “whole body must relate” to one action), exaggeration, and appeal. Although the other principles mostly focus on achieving ‘fluidity’ of motion, they are the methods needed to facilitate this abstracted form of life (suggested by the aforementioned principles).

I hate to borrow from xlzhang, but I completely agree that the most important part of the Illusion of Life is the way in which Walt Disney interpreted realism as heightened exaggeration. He’s indirectly addressing the value of the abstract in animation, where realism is not defined to be how closely the character adheres to the constraints of reality but rather the degree to which you can express the intended feeling. Exaggeration amplifies this abstraction and provides the potential to elicit much greater emotional responses than realism. In my opinion, this is the true value of animation; this ability to create such powerful experiences that simply cannot be cannot expressed with the same intensity in reality (case in point, Toy Story 3. If attempted with live actors, the movie would appear melodramatic, but with amplification through abstraction, if your heart wasn’t torn out at the ending then you must be heartless).

On a side note, this is why I’m a little put off by the tendency in gaming (especially PC gaming) for realism. Although I’m all for progressing graphics, I think the emotional impact is lessened as developers make things more ‘real’ than ‘lifelike’. The illusion of life is lost as more time is spent on the visuals rather than the emotions those visuals should instill.

What I watched:
I made the misguided decision to watch the first episode of David Lynch’s Dumbland. As far as I can tell, the series seems to serve as the director’s excessive criticism of cartoons as a cause for ‘dumbing down’ our society; this assumption is pretty much verified by the fact that the two minute clip consists of: a man poo-ing his pants, a screaming rant about helicopters, and an armless individual admitting that he uses ducks to satisfy primal urges. For this reason, the clip is entirely devoid of any of the discussed principles of animation.
The characters transition from binary states, as a consequence there is no anticipation, squashing/stretching, overlapping action, slow in/out, arc, or secondary actions. Everything jerks from one extreme pose with seemingly random timing so as to create spasms, which provides no illusion of life. Lynch made an obvious attempt to create as little appeal in his characters as possible, since one is a poorly drawn fatso and the other is creepy armless dude. Finally, staging doesn’t extend beyond an incomprehensible plot of land. All principles are absent, which is exactly what Lynch wants.

In all honesty, David Lynch has made some great things, but Dumbland is just his way of being a crotchety A-hole. His intent is to take a dump on the idea of animation and this is the result; he wants to parallel his feces with cartoons (and other animations). Clearly, he doesn’t see animation through our perspective; this is most likely due to his ignorance and unwillingness to appreciate the value in something that has occasionally contributed to some atrocities of film as well as some high-profit movies (something Lynch probably despises). Check it out if you want to be disgusted:
(Warning 18+ only!!!): http://www.youtube.com/watch?v=ILJnO14I8K0

Leslie February 1, 2011 at 4:20 pm

Your comment about video games reminded me of this Slate article I read a while back. It’s surprisingly relevant to this assignment, so I’ll share it just in case anyone is interested: http://www.slate.com/id/2241438/

Aaron Bartholomew February 1, 2011 at 5:19 pm

This article is perfect…

gleicher February 1, 2011 at 7:46 pm

I agree on prefering “lifelike” or “alive” to “real”

Exageration has many forms though…

Aaron Bartholomew February 2, 2011 at 7:42 pm

What do you mean by exaggeration takes many forms?

I certainly agree that exaggeration has many forms and by no means is it limited to cartoons; I’m just arguing that the general usage of it in animation helps sets the medium apart from realism. Exaggeration in (cartoon-ish) animation seems to amplify the response to the feeling the animator is trying to convey. Because everything is abstracted/simplified, by itself the intended emotion is already clear, exaggeration just takes it a step further to make for, in my opinion, something more powerful.

I guess this all boils down to my belief that abstraction and realism are both better suited for eliciting different emotional responses. Abstraction seems to be more capable of creating ‘heightened’ response from the observer because of its directness; the simplification makes for conveying an emotion that is unambiguous in its intent. On the other hand, realism seems more suited for creating an emotional response that comes from internal reflection on the perceived intent which is more ambiguous due to complexity. Although I think direct and perceived intent can be achieved in both abstraction and realism, it just seems that one medium is better suited than the other.

gleicher February 2, 2011 at 8:03 pm

An actor can exaggerate his expressions. It’s real, but not real.

I am not sure there’s a best way to communicate things: I prefer to think of it as a palette of choices that an artist has available.

sandrist February 1, 2011 at 3:58 pm

What I read: Preface – Ch. 1 of The Illusion of Life (newer version), Lasseter Paper.

It was interesting to first learn about the principles of animation in The Illusion of Life, and to then see Lasseter repeat and reemphasize those same principles for use in computer animation. Most surprising was the fact that not only do all of the old principles still apply, many of them directly apply without any need for reinterpretation. This fact makes it all the more disappointing to see some computer animators (especially in PC games as pointed out by Aaron) choose to willingly ignore these animation principles in the pursuit of “realism”, not understanding that a squashed, exaggerated sad face can be much more effective (and therefore more “real”), than a face striving for photorealism moving its eyebrows slightly.

Watched: an episode of Rocko’s Modern Life, “Wacky Delly” http://www.youtube.com/watch?v=0F7uqPVB4mA

I picked this show because it was a favorite of mine when I was little, but I picked this specific episode at random. Crazily, the plot of this episode involved Rocko and pals creating their own cartoon animation, so it really works on two levels. In the show, Ralph Bighead is the animator of a very popular cartoon, but wants to quit cartoon animation so he can focus on “real art” (something to do with fruit sculptures apparently). He is contractually obligated to create yet another cartoon show, so he recruits Rocko, Filbert, and Heffer to do it for him, thinking that they will create something terrible and get Ralph fired (which he wants). The bulk of the episode shows the process of Rocko and his friends creating a cartoon about deli meats called “Wacky Delly”.

According to a book the main characters are given to help them create the cartoon, the main steps to cartoon animation are as follows:
Step 1: Create Characters
Step 2: Write Story

Steps 47 – 7212: Draw lots and lots of little pictures

An incredibly interesting moment comes from their character design brainstorming. Filbert comes up with a character named Mr. Cheese, and draws an incredibly photorealistic wedge of cheese. Heffer says “yeah.. that’s great.. can I make one little change?” He then proceeds to erase the whole thing and draw a very simple, stylized little cartoon cheese guy with arms and legs and a face. This is a perfect statement on how concentrating solely on adding more and more realism can oftentimes result in a complete loss of personality for animated characters.

When Wacky Delly is finally completed, we see it is very reminiscent of the early “Steamboat Willie” type of animation, completely disregarding all principles of animation. It’s just a long string of sight gags, random things explode for no reason, motion is jerky and mechanical, emotions move from one extreme to the next, Mr. Cheese keeps shouting “I’m Mr. Cheese! I’m the best character on the show!” It serves as a perfect contrast to Rocko’s Modern Life itself, in which the principles of animation are clearly being adhered to. In “Rocko”, everything moves in circular arcs, with lots of smooth curves and not a lot of sharp angles. Everything that happens is very clearly staged, with only subtle secondary actions that serve to support, rather than distract from, the primary action. Lots of squash and stretch is used in faces for exaggerated motion.

I would strongly recommend a viewing of this episode (at least part 1), because I think it serves as a perfect case study of the difference between animations that do or do not follow the fundamental principles.

gleicher February 1, 2011 at 7:49 pm

This Nickelodeon style is interesting – generally done for low budget, so its not as “animated” – but it can still be quite effective. (to be honest, this one wasn’t working for me – but it could be the poor quality youtube sound). I find it amusing that they nail all of the actual animation technology (animation camera, animator’s drawing board, …). I didn’t watch it long enough to see the actual show.

Michael Correll February 1, 2011 at 4:10 pm

I read the preface and Chapter 3 of Illusions of life, the Lasseter paper, and Chang and Undar paper.

I chose to watch a scene from The Secret of Kells that has a lot going on:
http://www.youtube.com/watch?v=6djsmFvuQ1g

I’d read Illusions of Life before, but it’s always good to get a refresher. I do a lot of drawing, and it’s always interesting to see how animation principles creep in even in drawings that are meant to be “realistic.” Much like Disney’s seeming contradiction on his commands about realism, there is some extent to which these principles are “more real than real.” Simply duplicating reality becomes unnatural and stiff compared to the richness and fluidity of animation.

Take a look at Secret of Kells (the scene posted, but the whole movie is worth checking out just for its animation style, meant to resemble the art in the illuminated manuscripts of the Book of Kells). Aisling (the white haired girl) is constantly in motion, anticipating each dash or leap. While she darts everywhere in the frame, the action is staged such that she is easy to follow. Notice also that her hair keeps moving even after she stops (follow through), following curved arcs that lag behind her.

Brendan (the young monk) is slower and less fluid, but that lets you see the pose to pose actions more readily. There is a slow in/slow out example at the 0:28 mark: his final pose with the look of excitement is held for nearly an entire second, where the intermediate frames are much shorter. Also notice the avoidance of twins in his motions: even when he is standing still or sitting down his arms and legs avoid perfect symmetry, as one would expect from a natural pose.

The Chang and Undar paper was an interesting look at applying these principles (which are “natural” even when they are not realistic) to the GUI environment. You can see many of the principles in the paper implemented in the OS X environment: when windows are minimized or expanded there is a visual swoosh with slow in/out. Although it is interesting to see what elements didn’t make the cut: drop down menus still appear and disappear without warning, and the dragging of windows still occurs without motion blur or follow through. The “looking nice” constraint must, in the GUI setting, be subservient to the “doing exactly what I told it to” constraint, a situation that is very much reversed in the art world.

It must be a combination of liberating and frustrating to be able to periodically write the sorts of papers that Lasseter and Chang and Undar wrote, viz. “Hey, you know those esthetic principles that we’ve known about in some form or another for centuries? Turns out they still apply, even when we have fancy new technology to show our art.”

gleicher February 1, 2011 at 7:57 pm

I have wanted to see the secret of kells. The clips have an interesting look to them.

Getting the point that art can influence a lot of things (like Vis and UIs) is a a major lesson for everyone.

sghosh February 1, 2011 at 4:15 pm

Reading: Preface and Ch. 1 of The Illusion of Life (newer version), Lasseter Paper.
Watched: Clips from Early Mickey Mouse, Snow White, Looney Tunes, Luxo Jr., Spirit: Stallions of the Cimarron

The task of conveying a story, through a bunch of hand drawn pictures that too without voice support for the characters is pretty difficult and one that requires risky experimentation and innovative techniques to keep the audience in sync. As such, over time a set of principles or guidelines developed that could portray the story in the most convincing way. While reading through the principles mentioned in the Illusion of Life book I realized that most of these principles were thus ‘evolutionary’ – a direct result of all the experimentaions; except for exaggeration. Exaggeration is one quality that has been present from the very beginning (even the face in the Edison animation, shown in class, had it)- something the lifeless characters got to have to make any emotional connection with the viewer. And this is the very same reason that Walt Disney paid so much importance to making things “horribly distorted”, as Dave Hands says, just to make them more convincing. Exaggeration apart all the other principles were added as animation evolved and as people like Walt demanded more out of his artists – animated movies started looking more realistic.

One aspect that I found missing in the Illusions of Life book and the Lasseter paper is any mention about the importance of color. The use of ‘color keys’ (warm color for happy scenes and cold colors for evil/sad scenes) has been prevalent since the early days. For example, in Snow White there is a distinct difference in the color of the background (from blue – gray to warmer colors – yellow,red) before and after the kiss that wakes Snow White up. Evil characters and scenes accompanying them generally are given dark cool colors – the witch for example. Perhaps this comes under ‘Staging’ and partly under ‘Appeal’ and was left out because it’s a pretty subtle effect.

While watching Snow White I did notice (as shown by the authors of ‘Illusion of Life’) that the characters, especially their faces which tend to be shaded in a single color, look quite flat when seen from a close distance. Fast forward to 2002, in the Stallions of the Cimarron movie (this movie also incorporates traditional hand drawn animation and some digital techniques) one can see that this is no longer the case. There is some amount of self shadowing in the character which gives the viewer some depth information. Movies like Snow White have normal shadows (shadow on the ground) but do not have any self shadows. Again the concept of shadows is totally missing from the Looney Tunes clips. One interesting observation while viewing the Bugs Bunny clips is that his ears hardly ever turn away from the viewer. But I must say that, as a child when I watched these movies, I mean I did understand that they were just cartoons, but the lack of realism never really stopped me from appreciating them – and I believe I’d say the same even today.

In real life and in live action movies, things are quite different. You really can’t squish and squash an actor to ‘connect’ to the people. And from my observations anticipation is also not given that importance, it’s more natural, and unless it’s an actor like Jim Carrey in some comic role you don’t come across exaggerations of the animated movie kind. More importance is given to the story and character building.

gleicher February 1, 2011 at 8:06 pm

Actually, color is dealt with in another part of the Illusion of Life book. The whole color design thing is a big deal. Actually, design in general (big deal, but not in this chapter).

Actors do “exagerate” – just not the ways that cartoons do.

The economics and artistry do change the visual style (shadows, shading). However, even in the simplest cases you mention, they are carefully considered to achieve the desired effects.

Jim Hill February 1, 2011 at 5:01 pm

I read through chapter 1 of the Illusion of Life, the preface, and the Lasseter paper. I also looked through the Chang and Ungar paper and found what look to be the notes of a course taught by Lasseter in 94 (http://www.siggraph.org/education/materials/HyperGraph/animation/character_animation/principles/lasseter_s94.htm) and a paper that attempts to update the list of animation principles for the 3D realm (http://joshuamosley.com/UPenn/readings/AnimationPrinciples.pdf).

The Illusion of Life is a great read and I think very relevant to this course, however I find it interesting that Maya doesn’t have any mechanism for specifying stretch and squash or any of the other animation principles. It seems like there is a disconnect between the actual tools used to create animation and the actual animation itself. In the early years of animation, something like Maya or Blender or any other animation package would have been more related to the pencil, paper, and erasers that animators used to actually create animation. In some ways, Lasseter simply reiterated the principles without really discussing methods of implementing them in a computer system (other than translation, rotation, and scaling). A topic like computer animation is so interesting because the boundary between what the computer is supposed to do and what the animator is supposed to do is very gray. I think much of the work in automating animation is more about reducing the cost of actually hiring animators but it’s interesting to see that even in the few papers that I’ve read on some of the automation techniques, very little is said about the principles of animation. Taking that line of thought and realizing that many of the papers are attempting to automate animation with the use of motion capture data, it suddenly seems like computer animation is simply trying to duplicate real life. Which I understand might have applications. The problem with motion capture data, automation, and modeling/animation tools is that animation is first and foremost about the intent of the character. The principles of animation seem to separate into two parts. There are parts describe how to make the character move correctly and look appealing to the audience, but then there are parts that describe how to show intent. The biggest of these are anticipation and staging. I think an interesting area of research for computer animation would be in determining how to model and show the intentions of a character such that all motions of the character can be animated using the principles outlined by Disney.

The last paper that I looked at (http://joshuamosley.com/UPenn/readings/AnimationPrinciples.pdf) attempts to add more principles to Disney’s list. They include; Visual Style (how the scenes are rendered), Blend Motion (how do you blend two different animations to gain smooth follow through and Overlapping Action), cinematography (now that we have a more fluid camera and lighting system, we should consider using more complicated shots), and facial animation. These are problems that are definitely geared towards computer animation. The pdf is short and makes for an interesting read.

Usage of animation principles in user interfaces is not something that I thought about but I have to wonder whether Apple brought in some animators from Pixar to help develop some of their UI components. It seems like they where the first ones to build a really fluid and appealing OS UI.

I think one interesting insight to this entire business (which I think I pointed out in my viz post last year) is that animation and simulation attempt to solve the same problem from different ends of the spectrum (at least when it comes to making movies of things). The scientists have come at the problem by developing a rich set of mathematics that can describe the motion of systems of bodies in three dimensions. Solving the equations that have come out of this study requires a lot of computation and has really only become feasible with the advent of fast computers with lots of floating point power. Animation works towards the same goal, which is to make things move in realistic (and sometimes exaggerated) ways. They just came at it by assuming that the brain can come up with the right pictures for each frame. It’s interesting to note then that some of the principles of animation (most notably stretch and squash, anticipation, and slow in and slow out) have relations to concepts in 3D mechanics (such as deformable volume preserving bodies, reaction, and continuity of motion).

Watching part 1

I watch a lot of cartoons, but I’ve come to love the Donald Duck shorts. Two that I watched recently can be found on YouTube

Donald Duck Christmas (http://www.youtube.com/watch?v=3IfeuQ6Ayos)

and

Chef Donald (http://www.youtube.com/watch?v=FoqXzmEYcyU&feature=related)

Both of these show a lot of the animation principles. For example, you can see anticipation in how Donald sticks the recipe for roast duck into his cook book. Squash and Stretch are everywhere.

Watching part 2

If you want a good place to seen motion in real life. I recommend heading over to the SERF. I’ve found that I’m most interesting in two things, one is how hair moves and the second is how people run. Hair is more interesting to me from an art perspective, but watching people run is very interesting simply because of the variety. There are people who run with with their feet straight, there are people who run with their feet splayed, there are people who do a little “twist” with their feet when they follow through. There are people who run with a lot of up an down motion but not much speed and there are people who run very quickly but don’t seem to move up and down very much. There are people who keep their upper torso straight while their arms sway back and forth and others who swing the entire torso.

A great place to see squash and stretch in action is the weight room, especially in compound exercising like squating and bench pressing.

gleicher February 1, 2011 at 8:01 pm

The fact that tools don’t really support creating animation principles is a recurring theme. High end animators, arguably, don’t want it (a pencil doesn’t help with squash and stretch either). The ways in which animators are supported in doing this stuff is subtle.

You nailed the big issue in why most/all automated stylization fails (IMHO): cartoon style is there to convey intent. If the system doesn’t know the intent, it can’t do cartoon stylization.

sghosh February 1, 2011 at 8:13 pm

I’ll disagree on your comment on Maya. Maya has something called ‘deformers’ that can be easily used to stretch and squash your model. I believe Blender and other tools must be having the same. Any software can provide you only a limited amount of automation, but it’s ultimately the creative genius of the artist that creates wonderful animations. And that’s why these 3D tools are widely used all across the industry.

Michael Correll February 2, 2011 at 10:31 am

I suppose it’s true that the techniques are there, but wouldn’t it be somehow more “nice” (or “democratic”, or whatever) if the answer to “how do you create rich, believable computer animation” was something other than “you find yourself a really good artist and give them very good tools?”

Danielle February 1, 2011 at 8:32 pm

-Readings:
Illusions of Life: Preface & Chapter 1
Applying cartoon animation techniques to graphical user interfaces

One of the most interesting properties of the principles was how effective the flourbag model was at expressing emotion, simply from the squash, stretch, and pose of the model. This reminded me a lot of the skeleton control paper from the previous reading set as it used a simplified model as a base to convey a complicated property of the animation. One strange observation of the principles, however, is how little space was devoted to understanding how to generate appealing characters. Looking at past Disney characters, trends can certainly be spotted and generalized for creating appealing characters; however, little of that was discussed in the chapter.

The second paper presents an interesting application of the animation principles to user interface design. While this paper presents a nice survey of the general ideas underlying animation principles and provides a nice application of these principles to their own work, the thing I found most striking about this presentation of the principles is how close it echoes current understanding of human perception.

The paper defines four direct manipulation principles: attachment, reluctance, smoothness, and anticipation. Attachment implies that the object being manipulated remains attached to the cursor. This is reflected in the idea of ‘cueing’: the first place someone will look for an object is the place that they most expect it to be. Likewise, anticipation reflects the idea that the user should look for an object where they anticipate that it will be. Reluctance refers to the hesitancy of an object to move, facilitating change blindness: an object will not change position until the user is consciously aware that it is changing position as they have had to take the time to start the object into motion. Smoothness states that an object in motion should move continuously. This ties into the above as the user can follow the consistent motion path of the object without unexpected changes in position.

– The Artful:
Big Buck Bunny — BlenderFoundation (http://www.youtube.com/watch?v=YE7VzlLtp-4)
Pixar Tennis Commercial (http://www.youtube.com/watch?v=4Zv9vRz4QYM&feature=related)

These two animations adhere very closely to the principles discussed above. One of the primary ways in which these principles stand out is in the complete exaggerations of the features of both the chicks in the tennis video and the bunny in the Blender video. These characters have extremely exaggerated features which are smoothly coupled with the motions of the characters, contributing to their appeal by making them seem more lovable, innocent, and almost ‘squishy’.

The principles in these shorts appear to underlie most of the gags in the videos. For instance, when the squirrel at the end of the Blender video, his face is first shown, conveying strong emotion via staging. This causes the audience to anticipate the coming gag, where we’re exposed to the consequences of his meddling actions. The tennis commercial furthers this use of gag and staging to market cell phones. Further, the realism of the phone against the toon-like background and exaggerated features of the chicks makes the phones themselves stand out, a contrast phenomena discussed briefly in the User Interface paper.

-The Odd:
Salad Fingers (http://www.youtube.com/watch?v=M3iOROuTuMA)

In the Salad Fingers animations, a lack of adherence to the principles makes the animations look increasingly unnatural. This unnaturalness contributes to the bizarre nature of the underlying story. These animations are nearly too bizarre to attempt to analyze further.

-Human Observations:
People can’t move without contorting their shapes somehow: whether it be in the simple push-pull kinetics of muscle movement in walking or the literal contortion of the human form through acrobatics. It is striking how closely the flourbag model discussed in the Disney papers matches the muscle movement. The exaggeration of these motions in animations may help animators to avoid the Uncanny Valley by reducing the familiarity of the motion into something resembling Walt Disney’s concept of ‘realism’.

gleicher February 1, 2011 at 8:55 pm

I hadn’t actually watched big buck bunny all the way through before. But the salad fingers thing is just bizarre – I just don’t get it.

the connection between art and perception is something i keep coming back to. i am guessing we can explain a lot of artistic ideas based on perceptual principles (or vice versa)

the appealing characters point is well taken: but i think the answer is that there isn’t as much to say. it seems harder to codify how to do it. although, there’s a scott mccloud (making comics) reading that we might get to…

danieljc February 1, 2011 at 9:00 pm

I read the Preface and Chapters 1 from the newer version of The Illusion of Life, and also John Lasseter’s article from 1987. The Lasseter article seemed to follow very closely with the same principles from the Illusion of Life.

Some of the principles seem almost like common sense once you read about them, but it clearly took quite some time for them all to be discovered. In general the principles seem almost as applicable to computer animation as they do to hand drawn animation. When looking at the drawings from the book, I was surprised how some of the individual frames looked so distorted and unlike what you imagine they would look like from the combined animation. I had also never thought about the silhouette in animation, and how that can still be applied in current computer animation.

I watched several Looney Tunes and Woody Woodpecker shorts from the 1940s. These cartoons certainly followed some of the same animation rules, but also broke some others. Realism wasn’t as high a priority in these cartoons and sometimes the breaking with reality itself was part of the joke. There didn’t seem to be as much of the squash and stretch as seen in Disney animation in any of these either. These shorts instead sometimes still used the “rubber hoses” for arms and legs. Specifically, details such as the squash and stretch of faces during motion didn’t seem to be often used. The timing of the animation did seem to be a high priority in these cartoons, with split-second actions and motion. The main characters such as Bugs Bunny or Daffy Duck in the Looney Tunes shorts or Woody Woodpecker showed quite a bit of “appeal” and it seems to have increased from the earliest of their shorts. In addition, the characters did show quite a lot of personality, in some ways more than the Disney characters. I also saw quite a few uses of anticipation and exaggeration, which fit in with the more unrealistic style of these shorts.

gleicher February 1, 2011 at 9:23 pm

Looking at individual frames is surprising. If you look at Warner Bros cartoons (like Road Runner) – things are unrecognizable sometimes.

adrm February 1, 2011 at 9:31 pm

I read Chapter 3:The Principles of Animation from the Illusion of Life and the John Lasseter paper.

I’ve read the chp 3 before, but reading it again I noticed a few things that I had not before. In the squash and stretch section of the paper, the one with the ball, notice how the ball stretches into and out of the ground. In real life, even a squishy ball will squish a lot more from the impact than stretch from the acceleration of moving up and down. However, if one were to draw a ball like this, the anticipation of the ball hitting the floor would be reduced, as well as the follow through. Now look at the Lasseter, where he uses stretch and squash to relieve strobing effects. This means that fluidity and continuity are a lot more important to something looking lifelike, than realism.

I started thinking about these principles of animation and tried to come up with plausible (at least to me) reasons of why they are “principles” (i.e. what is it about them that gives “life”). To help me with this I thought about sports, specifically racquetball, since I play that a lot. During play, it is certainly possible to predict where the opponent will strike the ball. This is possible because of things like anticipation, follow though, and even staging (you have to be able to see what the opponent is doing, so you have to stage your view correctly) (interesting thought, playing against a robot might be a lot harder, since those cues will be missing) The only reason I am able to perceive such things is because of intense concentration, but move me further away and take away the competition and its a lot harder. This is where dancing comes in. In dancing, the dancer is actively trying to convey something to the viewer through pure motion and emotion. Almost every single one of the principles of animations has a parallel to dancing (and in my opinion even more than acting)

For the watching part I wanted to compare two different styles of animations that I was exposed to a lot during my childhood, the american Disney animation and anime style.
Disney style clips:
Beauty and the Beast http://www.youtube.com/watch?v=oeoPtz0F2Ck
Lion King http://www.youtube.com/watch?v=vX07j9SDFcc

Anime style:
Princess mononoke http://www.youtube.com/watch?v=pW949aZ2N0E
Avatar the last airbender (This is actually produced by nickelodeon, so it is more a fusion style) http://www.youtube.com/watch?v=qyeeHgYjL6U&feature=related

It should be noted that the anime style clips probably do not have the same production value (or budget) as the Disney clips. In the Disney clips just about every scene swims with rich examples of the principles (the stretch and squish in the beginning of the B&B clip, the staging at the beginning of lion king)

The anime style also follows some of these principles, but it is harder to notice them (for example, the timing of the in between frames makes the princess look as if shes running faster even though she isn’t moving along the screen faster). The anticipation and follow through are subtle, but definitely there. One huge stylistic difference is how in the Disney clips, EVERYTHING seems to be alive at all times, while in anime the action is usually focused on a few “actors” on any given moment.

BTW if anyone is wondering what a clash of Japanese anime and Disney animation looks like, check out the Kingdom Hearts game:
http://www.goquiz.com/upload/7d34434419bce823510056cc0519c5e5_kingdom_hearts.jpg
http://i51.photobucket.com/albums/f368/turpinator/Non-Emblems/Art%20Cleaning/OrganizationMickeyCLEANED.png

Leslie February 1, 2011 at 10:14 pm

I read the Preface and Chapter 1 of the Illusion of Life, Lasseter’s paper, and “Animation- From Cartoons to the User Interface”.

I watched the Pink Panther: http://www.hulu.com/pink-panther-cartoons. Specifically, I watched the first short, “The Pink Phink”, but they’re all in pretty much the same style. I chose the Pink Panther because it has no dialogue, and I figured that would allow me to focus more on the actual animation techniques.

All these readings make me appreciate the progress animation has made. Some very talented people have spent a lot of time and resources transforming it from what was essentially a gimmick into a legitimate art form. And I guess I kind of took it for granted, but animation is kind of an unusual art form. It has this almost self-contradictory goal of having to be real enough to engage viewers, but not realistic. In one of the papers, Walt Disney was quoted as saying “The constant battle is to find the elements that will look best in this medium and allow the strongest communication of the idea presented.”

The Lasseter paper wasn’t my favorite, probably because I was comparing it to the Illusion of Life chapters I had read just beforehand. One thing I noticed is that Johnson and Thomas list 12 principles of animation, but Lasseter only lists 11—he leaves out solid drawing. This is probably because 3D computer animation is, by definition, solid drawing, but it’s still an important principle. Many of the modeling tutorials I looked through for Assignment 2A told me to be sure I had a clear idea of what I wanted my figure to look like in all three dimensions before I even starting creating it. I did think Lasseter had some good computer animation-specific advice, and I like his definition of a successful animation as the characters having a though process, and the characters and story becoming more apparent than the techniques used to create them.

In the Pink Panther, I saw examples of things like squash and stretch, anticipation and follow-through, and exaggeration. The Pink Panther character himself is a good example of appeal; he is fun to watch. I also saw examples of staging. Since there was no dialogue, the characters thoughts and intentions had to be communicated very clearly and deliberately through their actions.

Also, on a side note, reading these papers makes me better understand the at least one of the applications of one of the first papers I was assigned to skim—“Stable Inverse Dynamic Curves”. (Someone actually asked me what the applications were, so now I can give a better answer.) When these curves are used in animated scenes, they follow the principles of anticipation, follow-through, arcs, and in some cases, squash and stretch, so I guess it’s another one of the ways computer scientists are trying to automate the jobs of animators.

gleicher February 2, 2011 at 7:40 am

I love your comment about “took it for granted.” I think one of the goals of an art form like animation (or cinematography – or even good writing) is its subversiveness: you don’t realize how the art form is working to communicate, you just get lost in the story.
The mark of truly great animation is not that you say “great motion” or “look at that squash and stretch” – its that you say “great movie” or “i empathize with the character” or “is luxo sr. the mom or the dad?”

Reid February 1, 2011 at 11:08 pm

What I read: Preface and Chapter 1 of the new version

Some of the animation principles make a lot of sense because they are grounded in natural movement: squash and stretch, follow through, arcs, secondary action. Squash and stretch is really a combination of natural movement with the exaggeration principle to ensure it is noticed by the audience. Follow through is a direct result of the Law of Inertia. Arcs are again based on natural movement. Finally secondary motion is really something all of us do subconsciously in all of our activities. We don’t just yawn, we stretch while we’re yawning. In this sense it is quite natural that these principles came to be, since they help capture the lifelike qualities of people, animals, and objects.

The remaining principles have a lot to do with human physiology and psychology. A combination of the way our visual system sees things and they way they register in our minds. In this sense many of the principles aren’t necessarily as realistic, such as exaggeration, but because of human psychology it is important or we become bored as we do in our common day to day lives. Obviously a movie cataloging some guys every waking moment of an average day would be so mundane as to be worthless in a theatrical sense, save for some with a strange taste in ‘art’. Many of these principles deal much with commanding the viewers attention or holding it if necessary, while the rest ensure the viewer notices the nuances they might not notice in real life. Certainly people do not practice staging in their day to day movements, there is no problem with me scratching my belly, my hand doesn’t vanish and it matters little if it’s ‘harder to see’. Anticipation is the same, I don’t dramatically raise my arm and point my hand at my pocket when I want my wallet, I just go straight for it. As pointed out by the papers though, this alleviated the ‘whispers’ in the theater of ‘what is that character doing?’, a psychological problem. Other things like timing and slow in/out have a lot to do with how we percieve and process images. Real life action obviously doesn’t hold for a certain time just to be sure everyone saw it, but in an animation you want the action to be seen no matter what it is, so these factors should be taken into consideration.

What I watched (cartoon): An episode from the old saturday morning sonic cartoon (I watched it as a kid)

The easiest thing for me to notice in this cartoon was anticipation. In the very first shot Sonic’s entrance is preceeded by a flash to prepare the viewer for his high speed. Whenever he is about to run, he jumps into the air and pinwheels his legs as if to rev up before launching into his characteristic blue blur. Staging was also fairly obvious since many of the secondary characters are robots with no facial features to convey emotion, but it’s still obvious that they are surprised when they realize they are about to run into a wall (in the intro).

What I watched (real life): myself

Squash/Stretch is one of the easiest to observe, given the papers mention the example of an arm. It is evident in many other human motions too such as jumping. Even walking has it, though asymetrically for each leg, one is contracting while the other is stretched (solid drawing?). Picking up a soft object, like a blanket, causes the blanket to stretch, dropping it causes it to compress again since it’s not a rigid object. Arc’s are a little harder to notice, but still quite evident. Almost never, with any action, do you actually move in a perfectly straight line. Even something as simple as reaching for a glass on a table directly in front of you become an arced motion.

gleicher February 2, 2011 at 7:45 am

The real life comment is interesting / motivation from physics and perception is a whole conversation.
Animators play with reality and use the control to better make the point. In the real world, we use a different set of cues to better communicate. (Which might mean trying to control information flow).
Your “it doesn’t matter” with your “personal staging” is an interesting thought. There are other things that you do optimize with your movement (although, sometimes, you do stage your movements so that others can “read” them). Its interesting to think of the tradeoffs – what am I giving up because I am trying to stage my movements?

sgallege February 2, 2011 at 1:30 am

What I read:
Illusion of Life preface and Chapter 1 of the newer version, and the Lasseter paper. I found the Lasseter paper to be like a compact quick reference of the Chapter One – Principles of Animation. The Principles of Animation’s illustrations really helped convey the different techniques used. Reading these papers was helpful because they introduces the various techniques as well as providing a historical context to what they became important. I also found it interesting how the Principles of Animation’s paper mentions how Walt Disney kept pushing the envelope when the animators though the drawings were acceptable (pg. 28)

What I watched:
So after hearing that the classes were cancelled I took the liberty of watching more cartoons than required and got a bit carried away too. I watched a bunch of old Tom and Jerry cartoons from the produced by MGM in 1940’s and I have listed a few below.
http://www.youtube.com/watch?v=7nEZwSZrbUw
http://www.youtube.com/watch?v=uHEsH0l5i9E
http://www.youtube.com/watch?v=Bmg7wAwQ9NI&NR=1

Tom and Jerry was my favorite cartoon growing up and looking back at them after reading the papers made me realize that the character appeal is the main reason for it’s success. Both the Tom the Mouse and Jerry the cat have a lot of personality and the interaction between them drives the story, although they are arch rivals they end teaming up against a common enemy or helping out each other in most episodes. I think their characters are representative of rival siblings.
Looking more at the technical animation elements they contain most of the items discussed in the paper. Squash and Stretch is used in many scenes including when the mouse runs in to a wall or objects fall on cats head and also when the cat tries to pull the mouse out of its hole. Anticipation/ follow through and overlapping action and exaggeration are also clearly visible throughout the episodes whenever they chase each other or surprised. As I mentioned before the character appeal is created by the emotions and actions of both character. One additional element I notices that wasn’t mentioned much on the paper is the detail in the characters eyes.

I also watched a few Warner brothers’ cartoons including an interview with Chuck Johns which I found very interesting http://www.youtube.com/watch?v=SuS2DqmzuwY&feature=autoplay&list=PLF37B2AA36FEED99C&index=96&playnext=2 as it discusses some of the same techniques seen in the papers, in addition it also discusses about the role played by the eyes in expressing emotion and the movement of the eyes can bring life to the character even when the rest of the character is still (Feed the kitty). The worms walk in the Wacky worm episode is a great example for the stretch and squash http://www.youtube.com/watch?v=SuS2DqmzuwY&feature=autoplay&list=PLF37B2AA36FEED99C&index=96&playnext=2

In real life:
I think snow storm was an interesting time to do this exercise and observe people, because I noticed people and vehicles do more cartoony things than usual. While waiting for the bus near the Memorial Union during strong winds I observed people leaning forward or sideways while walking to counter balance the winds, I even saw one guy walk backwards to avoid the winds. Other than that I don’t think we see as much Squash/stretch/exaggerations in real life. There is however one exception and that would be my dog Shadow; he definitely displays some cartoony motions when exited. They include running in place before fetching the ball, skidding and running in to the wall unable to stop in time and chasing his own tail.

gleicher February 2, 2011 at 8:01 am

This was a good excuse for me to learn about Tom and Jerry – I had no idea of the diversity of production with it. I think that explains why some of it I really liked, and others, didn’t work so much for me. I want to go back and watch the Chuck Jones T&J episode.

The eyes in animation (and communication in general) are really important. But really overlooked in the CG field.

gleicher February 2, 2011 at 7:48 am

the link to the chuck jones interview is actually a link to the worm cartoon. (i really wanted to see the chuck jones interview, since he is one of my heros!)

sgallege February 2, 2011 at 9:11 am

Sorry i must have mixed up the links heres the links to the Chuck Johns interview http://www.youtube.com/watch?v=v7VlEUqA7qA&feature=BF&list=PLF37B2AA36FEED99C&index=100

sgallege February 2, 2011 at 9:15 am

Actually here’s the documentary from the beginning Chuck Jones Extremes & Inbetweens, A life in animation (1/9)
http://www.youtube.com/watch?v=2Ca7iNqDTxs&feature=related

raja February 2, 2011 at 6:04 pm

*What I read:
I read the artists version of the illusions of life (preface, ch 1 & glanced through 2) and the Lasseter paper. As several others have mentioned, Walt’s take on realism using exaggeration is a stand out. It kind of seems paradoxical, but the realism is in a different context (in a cartoon world, where newton/rigid body physics doesn’t have too much of a say). Squash and stretch and timing the sequence adds vibrancy. Exaggeration especially to facial gestures and primary actions conveys emotion and adds immersion. Staging and the camera perspective can make/break a scene!
A lot of the principles seem so obvious when we read them now, but I guess its because we grew up watching these principles in action and never really reflected on them.

*What I watched:
**Pixar Luxo Lamp Pencil test
http://www.youtube.com/watch?v=VNF7rQeC7BI
Just stunning for its time, being computer generated. Funny how a lamp head that rotates to nod conveys so much emotion to a scene!
**Donald Duck – SnowBall war
http://www.youtube.com/watch?v=yS2PQwPqsCs&feature=related
Watching the cartoon after reading the Illusions of Life, a lot of the key principles seemed very evident: squash and stretch, exaggeration, appeal and the importance of seondary action and timing the frames stood out for me.

**Lion King Pencil Test
http://www.youtube.com/watch?v=0OtYNiX5lmE&feature=related
Lion King is something that instantly takes me back to my childhood and I just loved the film. This video shows how the pencil drawings are played (something the illusions of life reading talked about) to get a sense of how it looks. I really felt the importance of two (or more) characters in a drawing instantly being able to communicate to the viewer (i guess this would be part of appeal).

**How SnowWhite was made:
http://www.youtube.com/watch?v=mhfp6Z8z1cI&NR=1 is a fantastic overview of the process and the work that went into creating it!
250,000 celluloids, 1500 shades of color and the camera work involving placing celluloids (correctly) over watercolored backgrounds repeated over half a million times.
It just goes to show how painstaking the process was then, and even is today. There are some things that just can’t be automated.

*Other thoughts:
**South Park
Its fun to contrast the classic cartoons and shorts with a series like South Park.
It seems like quite a number of animation principles fade away here; Squash and stretch for one isn’t that evident. A lot of the focus in on expressions and sound and simplicity of art. I mean seriously, look at everyones eyes! Some of the animation principles talked about not being very repetitive in a frame (i.e. similar hand position, eyes etc created a “stiff” image to the watcher) but its amazing how repetition in art isn’t a negative in South Park.
I’d love to hear other peoples views on classic cartoon animation versus the anime sitcoms of today. Its quite amazing how the script and dialogue delivery diminish the importance of “showing” it.
http://www.spscriptorium.com/SPinfo/MakingOfSouthPark.htm was a fun read about some of the art forms and technology that went into making South park when it started off.

**About games being too realistic using more polygons and not leveraging exaggeration:
http://www.slate.com/id/2241438/ is a nice article on the topic. It talks about today’s games being way too realistic and lacking empathy and about Twisted Pixel, a company that builds character fondness through some of the principles we learned.

Sorry about the size of this comment, but I didn’t really feel like posting bits and pieces.

Nathan Mitchell February 2, 2011 at 9:56 pm

I was going to do this post yesterday, but the
unexpected snow day gave me a chance to locate a
non-American animation film to watch. In contrast
to Disney-esce animation, Japanese animation
comes from a very different tradition and gives a
very different feel to the viewer. I was able to
locate a copy of “Ghost in the Shell”, the 1995
film version.

Probably the most dramatic difference between the
animation described by the first article, Chapter
3 of the 1981 edition, and “Ghost in the Shell” is that the movie
is very ‘static’. Most of the artwork doesn’t
move. The backgrounds are highly detailed and many
of the static character sequences are as well,
giving no doubt to the skill of the artists. But
movement is extremely rare.

The movement of the mouth, for instance, during a
character’s speech is often the only movement in
the scene. The head remains fixed, along with the
body and everything else visible. In someways this
resembles the early examples of animation that we
watched in class, where the movement of the mouth
didn’t effect the general outline of the head, but
it doesn’t seem to give the same effect. I wonder
if this is due to the fact that the quality of
artwork is so well done that one overlooks the
lack of movement. Personally I would classify this
as the use of appeal, but I’m not sure if it
qualifies. I can say that the scenes are often far
more detailed and exacting than American
backgrounds, though this may be due to a film budget.

However, it is my belief, after watching the film
closely, that the sparsity of movement is actually
playing into the principles of
exaggeration. Unlike the Disney animation, where
exaggeration is an extreme version of the action,
the motion in this film seems very realistic. The
key difference is that since it is so rare, ones
eye is immediately drawn to the movement, giving
it an impression of exaggeration. It seems to be
relying on the trick of emphasis by omission,
rather than overload.

The other point I’d like to make is that, for some
reason, the characters in the film seemed far more
believable to me than regular cartoon
animation. I don’t know if that is because they
are all human, rather than semi-human
caricatures – but I suspect that the real
reason is, as I said above, that they move in
realistic patterns. While it was hard to catch if
the motion was arcing properly, it appeared
to. More importantly in my mind, there was a
distinct lack of cartoon motion – where the body
would perform physical changes impossible to do
in real life. Extreme stretching and squashing
never seemed to happen. People were not made out
of stretchy rubber.

Of course the fact that motion in the film was so
rare dispelled any idea that the characters
were real. Real people and things move randomly at
all times. No one can stay perfectly still – there
is always a wiggle or shift as a person fiddles or
maintains balance. Even when one tries to remain
still, its impossible to keep the poses that the
characters in the film do. That fact is probably
the most exaggerated part of the film.

I’d like to conclude this post with the following
remark – I don’t believe that the principles that
are outlined and described in the first article
are completely necessary for good
animation. “Ghost in the Shell” is a fairly famous
film for the genre, noted for the quality of the
animation. However, it looks nothing like films
such as Snow White or other more modern Disney
films. There is obviously some combination of
elements that will satisfy an audience without the
full list that Johnson and Thomas lay out.

———

I made a point not to read the other comments
before writing this up, so hopefully I don’t
repeat what others have already said.

{ 1 trackback }

Previous post:

Next post: