12 Principles of Animation

Anticipation

Anticipation is used to prepare the audience for an action the animation is about to take. this scene from Nichijou is a good example of anticipation, because it plays around with the timing of preparing to slam the goat onto the floor, to make the actual slam more distinct.

Appeal

While an actor may have a chrismatic personality that makes you want to know more about them, an animated character has appeal, a certain aspect of their design that generally is easy to read, and makes you more interested about them. When the Big Hero 6 trailer came out, I was instantly infatuated with the design of the main antagonist, Yokai. He's wearing a mask, who is he? What are all those things swirling around him? How can he control them so easily? Just looking at a few shots of the character raised so many questions for me. Also, he just looks downright cool.

Arcs

All naturally occurring actions follow an arc or some sort of path. If this isn't included in an animation, an action may look mechanical or robotic. Unless that is what you want, a character should move naturally in a way that makes sense to the viewer. When played around with and done correctly, the movements of the character may more easily portray the emotion they are emitting. For instance, the character's head in the gif above, from Corax's Game Grumps Animation, follows an arc that goes back and up again, along with the facial expression, makes the action look very flirtatious. Something also to keep in mind when playing with secondary action.

Exaggeration

if animation looked exactly the same as real life movement, then what would really be the point in making anything? Exaggeration is taking that movement, and expanding on it so that what you look it can be more enjoyable and distinct. If real movement were to be taken into animation form, It would look stiff, and actually more unnatural then if the movement was more exaggerated, and made to look entertaining. Take this gif from Nichijou (again sorry) I don't think anyone can take strides as long as that in reality, but if I had just thrown in a gif of some guy running, it wouldn't nearly be as fun to watch as this is.

Follow through/overlapping

Everything has a hierarchy of movement. If a cute girl had long hair and began to turn around, it would take the hair longer to catch up with the position of the body than it would take, well, the body. Anything that is attached to something heavier than it is dragged with it, so if a heavy object makes a sudden change in movement, the loose object will not realize this until a few frames later. The example from Little Witch Academia includes a bomb connected to a string that is dragged by the characters arm. It doesn't reach the location the arm is guiding it towards (by throwing it) until a bit after it happens.

Secondary action

A character may have a primary and secondary action. While a character may start walking or something, this doesn't tell us much about the mood of the scene, other than the act that they are walking. However, when we add features such as additions to their body language, the pace at which they walk, and maybe the expression on their face, we can take away a new feel from this character. In the video above, naruto arrives in his new sage mode in order to fight Pain, a strong opponent. He stands tall and firm, arms cross, and a glare in his eyes. This makes him seem confident, self assured, and ready to win.

Slow in / Slow out

All natural movement starts off slow, accelerates, then ends slowing again to a stop. This is just the way we and other things move, so replicating that into an animated version makes it look all the more natural. In this gif from Nisekoi, Chitoge starts her head turn slow, speeds up, and reaches her end destination decelerating. 

Straight ahead / Pose to pose

There are two ways to animate. One, pose to pose, is a method of drawing one pose, then drawing the next pose your object will make, then drawing the frames in between. Straight ahead, however, has none of this, its just do one frame, and then do the next how you see fit. The reason we don't use straight ahead all the time, is because things can lose their proportion, they can look unnatural, and we have less control over what we draw. However, if I wanted to make something with seemingly random movement, such as fire, It would be difficult to do that using pose to pose. In the gif above from Gurren Lagann, the character itself changes position, and is done in pose to pose. However things like the... Uh... Laser stuff coming out of the drill, and the spinning drill itself, are most likely done with straight ahead.

Staging

There will be times when you have to convey a message to your viewer in the clearest way possible. To do this, you will need to use many things, such as the position of a character, what the camera is focusing on, and especially the expression of a character and how he/she interacts with other characters. (see secondary action) In the video above, by Mike Inel, it is clear to me that the character really regrets the things shes done to mabel in the past, and is incredibly touched by her offering of kindness despite all shes done to her. I see all of this without hearing a single word about it, and to me that is impressive. 

Solid drawing

An animator, when making accurate drawings, need to understand the concepts of 3-D space, depth, volume and weight, in addition to accurate shading, colors, etc. In this gif from Toradora, the character is spinning, and we see every side of her, making her as 3 dimensional as possible. 

Squash and Stretch

The video above is surrounded by lots of controversy. Squash and stretch is used a lot in this video. As he moves, his face stretches and apparently makes him appear to look more menacing, insane if you will. However, many people think it looks stupid, and that is unnecessary to convey this. When an object moves fast, to the human eye, it seems to stretch. When it bounces, collides with something, stops, etc. it will  squash. When used in animation, it looks all the more like real life. 

Timing 

Timing can change so much in an animation. If you want to add more emphasis to something, or make it feel more drawn out, then you would want to add more frames to it, or keep it in the same position for a while. If you want an action to feel more sudden, rapid, and fast paced, you can use fewer frames. By playing around with these elements, you can play around with things like emotion, mood, or reaction to other characters around them. In the gif above, from Kill la Kill, Ryuko spins her blade very quickly, but as she lowers her arm, more frames are used, and gives the blad a sort of weight.