Art: Animation Principles

Join the #1 Art Workshop - LevelUpJoin Premium Art Workshop
Results 1 to 24 of 24
  1. #1
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0

    Animation Principles

    --this is for some lessons I gave a few years back. it is a lot of cutting&pasting from across the web, and then reworked by me. I will give credit where this is still possible, but I've used a lot of ref through eachother, and changed a lot of what's left to my liking too.
    also, I need to translate it all back from dutch, so it might be a while before I have all the pieces together again.
    still, I think it gives a pretty good list of things an artist wanting to start in animation should try and keep track off, so here it is.

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  


  2. Hide this ad by registering as a member
  3. The Following User Says Thank You to ashess For This Useful Post:


  4. #2
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    12 Character Animation Principles (A rework derived from "Disney Animation - The Illusion of Life" by Frank Thomas & Ollie Johnston)


    1. Squash and Stretch. (Shape distortion to accentuate movement.)
    2. Arcs. (Planning the path of actions.)
    3. Mass and Weight. (And preserve volume!)
    4. Slow-in and Slow-out. (Smoothing starts and stops by spacing.)
    5. Anticipation. (A reverse movement to accent a forward movement.)
    6. Follow-through and Overlapping action. (Nothing stops abruptly!)
    7. Secondary Actions. (A head might wag while the legs walk!)
    8. Staging. (The camera viewpoint to best show the action.)
    9. Timing. (Time relations within actions for the illusion of life!)
    10. Exaggeration. (Caricature of actions and timing.)
    11. Character acting. (Thinking of the character as a real actor.)
    12. Appeal. (make your character loveable)

    1. Squash & Stretch:
    Living organisms are able to squash and stretch, much like a rubber ball. Squash and stretch is caused by forces working on the body: gratify, magnetism, or an impact with another body or object. The on thing to remember is that it is always squash AND stretch; the total volume of the object should stay the same. That means that if a massive shape is squashed from an impact in one direction, it will stretch sideways to keep its total volume constant. Thus a tennis ball hitting the ground will squash in height, but widen in width.
    A long time it was thought that the animation as shown in slapstick was a gross over-exaggeration of the truth; modern science how-ever shows that the distortion caused by an impact is in reality every bit as shockingly huge as shown to us in the old tom and jerry toons; the time the distortion can be seen, however, is so much shorter then you see it in toon time, the brain doesn’t actually register it beyond the feeling of great impact. Look at http://www.youtube.com/watch?v=38e5_3UlasU for some examples. (two other principle play in this movie; namely number 3/4: mass and weight/slow in and out, and no. 6: follow through.)

    2. Arcs:
    a body part’s move is co-ordinate from its joint. But even a bouncing ball follows a curved path. To make a natural move, one should always try and go for some sort of curve.

    3.Mass& Weight:
    Animation being the 2d medium it is. (even 3d animation is shown on a flat screen), it is extremely important to keep the illusion of mass and weight consistent at all times. This means keeping a sharp eye on foreshortening and scaling down things in the distance, but also to keep the illusion of weight in the move itself. A heavy object (or a heavy part on an object) will need more time to overcome its inertia then a light object. Thus, a balloon will start moving almost at the moment of impact, while a bowling ball will need time to speed up.

    4. Slow In & Slow Out:
    Unless a move is caused by an external force, an animal will need to bring in force to cuase a movement (like, the movement of an arm). Thus, the arm will gradually speed up, and when stopping gradually slow down. This principle is linked to mass; a heavy object will again require more time (or force) to reach its target speed, a light object needs less. Not applying this principle will make your moves look robotic or weightless.

    5. Anticipation:
    Anticipation is getting ready for an action. It is as much a camera cue as natural behavior. Before catching a ball, you have to get ready to catch it. An anticipation always tries to be as different a pose as possible from the following action. When getting ready to catch a horizontally thrown ball, a person will be shown hanging forward with the arms stretched, so that in contrasts with his moment of the catch: pushed backward and arms bent. An anticipation is also used for showing thought processes and other story-related cues: a person will crouch a little, arms to chin, to show him thinking –anticipation, then leap up high and straight with a finger in the air to show he has a solution. Anticipation is also very consciously used by stage actors and the great silent film actors like Charley Chaplin.

    6. Follow Through & Overlapping Action:
    some parts of the body (or of an object) are not solidly fixed to the rest. Like hair, but also arms. They will start following an action later then the main body, and finish later too. Examples include hair swinging after a head, the arm motion while walking, or a tennis player’s body stretching after he’s just hit a ball.

    7. Secondary Action:
    while this can make animation interesting, it should be used with care. A man can tap his hand on the table while talking, or jiggle his keys while walking. Remember a viewer can only direct his attention to one action at a time. It is thus usually better to introduce the secondary action after you’re established the primary action.

    8. Staging:
    this is definitely a camera issue more then an animation issue; but you do want to show you moves as best you can so USE it! Always try and let the action of a scene play large across the screen (like, from top left to bottom, like a sweeping arc) and always try and have your characters positioned thus, that of you only showed the silhouettes, a viewer would still be able to understand what just happened.


    9. Timing:
    the speed of an action, or even a still changes its meaning. Holding a frame for half a second (that might be like a double take) gives it a totally different meaning then holding it for 3 seconds. (usually used for a moment of complete disbelieve). In the same way, a person can turn his head in a fraction of a second (shocked@!), or turn it in three, following a desirable object across the room.


    10. Exaggeration:
    make you actions as clear as possible; make your emotions as clear as possible. You are not using words, and the bridge between people and cultures is bigger then you may think.

    11.Character acting:
    to bring live to your character, he must act like a real actor. When an actor decides to hit another, he first must decide to do this. An actor will first show his thought process, and only when this is finished come to action (bewilderment at other’s words- letting them sink in- anger- decision to take action-anticipation-hit:: eyes wide, taking a step back- holding pose slowly settling- a change to an angry expression- clenches fists-draws arm back -hit.)

    12. Appeal.
    not an animation principle, but more a story telling one; we need to be engaged by the character enough to care about what happens to him

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  5. The Following 2 Users Say Thank You to ashess For This Useful Post:


  6. #3
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    Squash and stretch
    From here on we’ll use these definitions of squash and stretch:
    Squash: flatten an object or character by pressure or by its own power, usually change in speed.
    Stretch: used to increase the sense of speed and emphasize the squash by contrast. (also see ‘anticipation’ for more on this)
    Note: keep volume constant! The squash and stretch happens in the direction the force is applied to. All other directions will make up for the otherwise perceived lessening/growing of volume by widening and contracting to contrast the squash/ stretch.

    Here we see a rubber ball; but the same kind of malleability should apply for organic objects. When forces act upon such shapes, they will deform appropriately. Note here how the volume is kept constant: first, as anticipation to making contact with the ground, the ball stretches in the direction it is moving. Simultaneously to elongating, the ball also contracts in width. It is implied that the ball also contracts in depth here (the dimension parallel to our viewing angle, and thus not visible), so that the total volume of the object stays the same.
    The next frame shows the ball squashing on impact. Here again, width and debt make up for height- which is now squashed, thus less. So the ball widens in these directions to make up for this.
    The following frame is again like the one before impact, the ball overcompensating to return to its original shape. Notice the direction of the deform has changed a little, to show the direction the object is moving.
    Name:  squash_stretch1.jpg
Views: 4169
Size:  71.3 KB

    At first, it may seem to the untrained animator that squash and stretch is only interesting for animating objects behaving somewhat like a rubber ball.
    Or that this principle is only interesting when animating in a ‘toonish’ style, but this is not true. Look for instance at this lamp: the individual parts of it are rigid, but still, as a whole is squashes and stretches to make it’s forward ‘jump’ possible.
    Name:  squash_stretch2.jpg
Views: 3766
Size:  93.6 KB

    Notice how you can apply squash and stretch in the same way as on the lamp on a ‘realistic’, non-squashing body like this:
    Name:  squash_stretch3.jpg
Views: 4673
Size:  122.0 KB

    Squash and stretch can also be used when giving emotions to characters, or even animated objects. Observe the famous flour sack.
    Name:  squash_stretch4.jpg
Views: 5768
Size:  226.6 KB


    Other bodies can be squashed and stretched the same way:
    Name:  squash_stretch5.jpg
Views: 2320
Size:  208.8 KB

    Last edited by ashess; April 23rd, 2009 at 08:59 AM.
    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  7. The Following 2 Users Say Thank You to ashess For This Useful Post:


  8. #4
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    Arcs
    In Animation, it is almost always best to avoid straight lines, since most things in nature move in arcs.
    Basically, there are two types of arc in nature.
    First of all, there is the arc caused by join rotation; for instance the parts or a skeleton move as a result of joint rotations. A hand will move from A to B due to the movements of shoulder, elbow and wrist; all 3 joint rotations; thus the resulting movement will be the some of these 3 arcs. It is possible to have the sum of such actions form a straight line, but it is not the natural way for most movements.
    Name:  arcs1.jpg
Views: 2286
Size:  73.5 KB

    The second type is the natural curve of a falling object; it is caused by the sum of a constant, forward motion (or linearly slowing) of an object, coupled by its quadratic speed up (or down) due to gratify. That’s right; it’s the bouncing ball again. Only this time it’s the arc in space we’re looking at.
    Name:  arcs2.jpg
Views: 2098
Size:  63.0 KB

    Of course, whether a movement is one or the other is often arbitrary; think if a foot. It moves through space due to the rotations of various joints. But in some walks it also ‘bounces’ off the floor and speeds up/down like a rubber ball.
    Name:  arcs3.jpg
Views: 2864
Size:  53.9 KB

    When staging your action (a principle we’ll discuss later), always try to show your arcs to maximum effect; for instance, if a batter is going to hit a ball, have him shot from an angle that shows the arc of his bat to maximum effect.
    many great films show the arcs principles to great effect, but one wonderful example can be found in the 1sts episode of “Samurai Shamploo”, when the two main characters first meet, and inevitably fight. Watch it if you can, and see every jump, every sweep and every turned over table is expressed in an arc.

    Last edited by ashess; May 1st, 2009 at 12:48 PM.
    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  9. The Following 2 Users Say Thank You to ashess For This Useful Post:


  10. #5
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 3: mass&weight

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  11. The Following 2 Users Say Thank You to ashess For This Useful Post:


  12. #6
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 4: slow in & out

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  13. The Following 2 Users Say Thank You to ashess For This Useful Post:


  14. #7
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 5: anticipation

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  15. The Following 2 Users Say Thank You to ashess For This Useful Post:


  16. #8
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 6: follow through

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  17. The Following 2 Users Say Thank You to ashess For This Useful Post:


  18. #9
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved7: secondary action

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  19. The Following 2 Users Say Thank You to ashess For This Useful Post:


  20. #10
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 8: staging

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  21. The Following 2 Users Say Thank You to ashess For This Useful Post:


  22. #11
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved9: timing

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  23. The Following 2 Users Say Thank You to ashess For This Useful Post:


  24. #12
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 10: exageration

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  25. The Following 2 Users Say Thank You to ashess For This Useful Post:


  26. #13
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 11: character acting

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  27. The Following 2 Users Say Thank You to ashess For This Useful Post:


  28. #14
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 12: appeal

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  29. The Following 2 Users Say Thank You to ashess For This Useful Post:


  30. #15
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    reserved 13 ( I know I got 12 now.. but I got my list up to 16 at some point I know..)

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  31. The Following 2 Users Say Thank You to ashess For This Useful Post:


  32. #16
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    and reserved 14 - that should gimme enough space.

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  33. The Following User Says Thank You to ashess For This Useful Post:


  34. #17
    Join Date
    Apr 2008
    Location
    France !
    Posts
    1,473
    Thanks
    707
    Thanked 527 Times in 473 Posts
    Follows
    0
    Following
    0
    GREEEAAAAAAAAAAAAAAT !!!!!!!! i hope you'll post some basic exercises too ! this is awesome dude ! Keep helping us


    contact: kikindaface.art at gmail.com

    Reply With Quote Reply With Quote  

  35. #18
    Join Date
    May 2006
    Location
    Minneapolis, MN
    Posts
    48
    Thanks
    3
    Thanked 6 Times in 5 Posts
    Follows
    0
    Following
    0
    slow in/out can be also called ease in/out.

    also i would like to add in that at times when a character swipes an object into his/her hand that only takes like 3-4 frames, you never draw the frame of the object being grabbed. it can also go with kicking a ball as well.

    just giving my 2 cents on this one

    Reply With Quote Reply With Quote  

  36. #19
    Join Date
    Apr 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Follows
    0
    Following
    0
    spam.

    Last edited by Black Spot; July 7th, 2012 at 10:05 AM.
    Reply With Quote Reply With Quote  

  37. #20
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    yes; thanks a Lot for the responses. it took me a little longer then expected to get my own images for the writing; but here's the first part.
    Walid: I will add the exercizes that are meant for these lessons in too; thanks for the idea.
    Blue: ease in/out is the same ye. thanks for highlighting the swipes thing. I'll see if its in there. it might fit in with action/ reaction or line of action..
    which are also still missing I see. glad I reserved at least 14 slots :p

    johon.. that's a dead link

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  38. #21
    Join Date
    Oct 2007
    Posts
    81
    Thanks
    0
    Thanked 9 Times in 9 Posts
    Follows
    0
    Following
    0
    So.. When are we going to have an update?(:

    Good work so far, very interesting and enriching!

    Reply With Quote Reply With Quote  

  39. #22
    Join Date
    Jan 2006
    Location
    Canada
    Posts
    357
    Thanks
    46
    Thanked 8 Times in 8 Posts
    Follows
    0
    Following
    0
    Looking great so far. I look forward to seeing the rest

    Reply With Quote Reply With Quote  

  40. #23
    Join Date
    Jun 2007
    Location
    amsterdam
    Posts
    3,094
    Thanks
    572
    Thanked 1,046 Times in 824 Posts
    Follows
    0
    Following
    0
    thanks for the support. I'm aiming at finishing a part at least once a week, but dont pin me up on it. sorry 'bout that last image btw. gonna see if I can find or make a better one.

    >>SKETCHBOOK. you'll visit me. I'll visit you, we'll have a tea party. with arts and shit. it'll be dreamy. stop by.
    >>mah tumbr
    Reply With Quote Reply With Quote  

  41. #24
    Join Date
    Feb 2004
    Location
    Los Angeles
    Posts
    519
    Thanks
    7
    Thanked 54 Times in 31 Posts
    Follows
    0
    Following
    0

    Anticipation and Follow-through

    Animation Principles

    I like the way the girl anticipates her big head turn (and her pig tails follow through)

    http://www.youtube.com/watch?v=TVblWq3tDwY



    Reply With Quote Reply With Quote  

Members who have read this thread: 0

There are no members to list at the moment.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
  • 424,149 Artists
  • 3,599,276 Artist Posts
  • 32,941 Sketchbooks
  • 54 New Art Jobs
Art Workshop Discount Inside
Register

Developed Actively by vBSocial.com
The Art Department
SpringOfSea's Sketchbook