I am here today to take a brief minute or two to explain a beautiful and wonderful relationship. Honestly its like something out of a Shakespearian novel. If you call yourself a “motionographer” at any level you already know about this romance of “Bennifer” proportions, or at least know of it’s reputation. A lot of applications work great together and share data from platform to platform. However, in my experiences, none can compare to the love between Maxon’s Cinema4D and Adobe’s After Effects. The main beauty of it all is how well Cinema4D translates and packages up all of its data into a nice comfortable package for After Effects to unwrap and rebuild. For the sake of keeping it short and sweet (because believe me there is a lot you can do with integrating these two applications) I will cover 2 simple points and give a few examples as to why I think these two apps are made for each other. I’ve actually just finished a project where I used the C4D/AFX integration and will use a few examples from that piece.

The first ingredient to this wonderful little love affair comes with a simple click of a checkbox in a field called, “compositing project file”. On checking the Save box C4D will create a file in your file structure with the extension aec. Inside of this file, that opens with After Effects, holds a number of very important things. First it holds all of the 3D camera data that existed exactly how it was inside of C4D. Second it holds all of the file target information for all of your rendered passes out of C4D. Third it opens all that data up in a neat and easy to understand way. When opened it creates a folder tree inside of your project window that packs all of your data into specifically named sub-folders so it is easier to find later. It places all of your separate passes and object buffers into a folder called “Special Passes”. It then creates a folder called “Solids” which is where it will place all of your nulls, lights, anything else you put an External Compositing Tag on. But I’m getting a head of myself with that one. Lastly, in the root folder that the aec created is where you will find your main comp that encompasses all of your camera data, nulls, and footage to start to piece your project back together and begin adding all of your After Effects assets. If all this did was give you simply the camera data, it would be invaluable! Being able to take the true 3D camera moves you made inside of Cinema4D and now add assets in After Effects directly into the scene is crazy. I can’t imagine trying to do that while creating a brand new camera in AFX that matches the camera from C4d.

Second on my list is the External Compositing Tag. This is and does exactly what the name implies. Any null you put into the 3D environment and attach the tag to will then be saved as an XYZ position null for After Effects to use when you open the aec. Right off hand it might not sound like much, but believe me it is so much more powerful than it sounds. In the Easton trailer I placed a number of these nulls in the scene to be used later as light sources for the lens flares. Of course once I was in After Effects I could have guessed and eyeballed the correct position for any one of the nulls, but this comes much simpler and takes the time of positioning the null out of the time equation. Of course it can be used for placing things like pictures or videos in an exact position as well like I did with the pictures and the video of the band. Again, to make it look like it fits perfectly in the scene it simply makes more sense for me to know out of C4D the precise point at where this is supposed to live so all the movement and parallax looks correct. The last example I have for the beauty of the external compositing tag is if you plan on adding a moving asset in later. Something like that can be done in AFX alone, but again, to match the correct depth and position would simply take too long to justify not using the tag. When creating 3D strokes or particle streaks in AFX you could animate the null spinning around an object from C4D then in AFX attach a light to the null and point the particle emitter to that light. Simple.

There are a lot of other things you can do to help these two applications get along better. For example, rendering out the lights as separate passes so that you can adjust the brightness or color temperature later if you feel the need. You can render out object buffers in case you need objects in Cinema to move behind or in front of objects using track mattes. You can even render out the different shadow layers and all the layers that light up your textures. There is nothing better than realizing after an eight hour render that you made that light “too blue” and now you can simply adjust to a point inside of AFX and hopefully save yourself another eight hours. We’ve all been there, and we’ve all thought about kicking a cute animal across the room in a fit of frustration. Well, it looks like Cinema4D and After Effects are looking out for you and the cute animal you may or may not being thinking about punting across your living room.

If you guys have any questions, or want me to go into a little more detail about it feel free to ask me. You can of course leave a comment here and I’ll make sure to help out in any way that I can.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Cinema 4D

Creating A Camera

To create a camera in Cinema 4D all you have to do is go up to the light menu (the button with the ball of light with four arrows coming out of it), click and hold the left mouse button and two camera options will appear among an array of light options. The first is a regular camera.

Camera: The ordinary camera is fully controlled by you. This means you control what it sees and how it is animated.

The second is a target camera.

Target Camera: The exact same thing as the regular camera, except it targets an object. This comes in especially helpful when you want to track an animated object or want to move the camera around that object while still keeping it in frame.

When you first create your Target Camera, you should see a Camera object and a null object called Camera.Target.1 in your Objects menu. To have the camera target an object, you must tell it what the target is. You do this by dragging and dropping that object in the Target null object.

After this is done, you must line the camera up with your target (or vice versa). The easiest way to do this is to view the target object’s coordinates and change the X, Y and Z coordinates to 0 and adjust from there, but if the object is exactly where you want it to be, you will have to copy the target’s coordinates into the camera’s coordinates and adjust. From here on, your camera will follow your target.

Camera Settings

Basic

We’re going to skim over the Basic tab because it is pretty self explanatory. You can, and should, change your camera name as well as visibility options and more. As I said earlier, the Help menu does a good enough job on the basics. You can find all the answers you need by viewing the help menu under Help > Help… and searching for Camera Object: Object Properties.

Coordinates (Coord.)

These change the X, Y and Z coordinates. P is position of the camera, S is size of the camera and R is rotation.

Object

Projection: This list (seen below) contains a bunch of different views for your camera: the standard left, right, front, back, top, etc.; plus not-so-standard views such as isometric, military and bird.

Because the camera moves around a lot when switching through the different views, they work best with the target camera because you won’t lose your object, but they can be used with either camera. There are more than a few interesting angles you should definitely try before you spend all your time trying to maneuver the camera into the right position. Using anything other than Perspective Projection makes the Focal Length, Aperture Width and Field of View settings nonadjustable.

Cinema 4D simulate a lens system as found on a camera. For the next settings I go over, keep in mind this diagram below. It’s a simplified diagram representing a lens system on a camera. Your Field of View is what you see (in C4D, the box in front of the camera). The Aperture Width and Focal Length are two things you won’t be able to physically see, but changing them will impact what you see in the Field of View. As you can see in the diagram, they are all connected.

Focal Length: These mimic the different lenses you can use on your camera. Focal length directly affects your Field of View. By adjusting the Focal Length up and down (anywhere from 1 to 10,000) you are moving the center of the X (in the image above) closer to the front of the lens or closer to the back. What this accomplishes is distortion of the image you are looking at. A short focal length gives a wide-angle view and a large focal length acts like a telephoto lens. This is how it fits more or less of the object in the Field of View.

Fish-eye 20 mm

Wide-angle 35 mm

Normal 50 mm

Portrait 85 mm

Telephoto 200 mm

Super telephoto 1000 mm

Aperture Width: The aperture is what allows light to pass through the lens onto the film in the camera. The ratio of the Aperture Width to the Focal Length determines how much of the scene can be viewed. Doubling the Focal Length and the Aperture Width will not change the viewing volume.

Field of View: This is what you’re looking at through the camera and is directly proportional to the Focal Length and the Aperture Width.

Zoom: The zoom is just that. It allows you to scale the image without moving the camera in and out. It can not be used in Perspective Projection.

Film Offset X/Y: This allows you to animate film much like you would traditional film.

Enable Near Clipping: Creates a vertical imaginary plane which causes all objects in front of the plane to be clipped.

Near Clipping: Use this to define the distance of the clipping plane.

Show Cone: Turns on and off the viewing cone in front of the camera.

Rotation: This allows you many different options of rotating the camera.

The options are as follows:

• Default: It’s the default setting you can always revert to. It is set by going to Edit > Preferences > Document > Camera Rotation
• Position: When this option is selected, the Pivot menu is opened up allowing you to choose two options: Object and Custom (view Pivot below).
• Center: Centers the rotation to the center of the active view.
• World: The world coordinate origin will become the point of rotation.
• Camera: The camera’s origin will become the point of rotation.

Pivot

The pivot point is the point which your camera rotates around. This can be moved based on the options you choose.

• Object: The camera will pivot around the object the you drag and drop in the object field.
• Custom: You choose the position the camera pivots around.

Show Pivot: Having this option checked will show the pivot point on screen as a small colored cross.

Depth

Target Distance: Determines distance from the camera that objects appear sharp. Depending on if you have Front or Rear Blur checked, you will be able to blur whatever is in front or behind the target distance.

Use Target Object:

Front/Rear Blur: You can specify which areas you want out of focus. You have the option of blurring what’s in front or behind the object targeted and where the blur starts and ends.

After Effects

Does this design look familiar? It should. Like I said in the beginning, all software based cameras are based on real world cameras, so they all share similarities.

In the camera options you have all the same settings you had in C4D and they all act the same so it would be redundant to go over them. Suffice to say, these are the same, so you should treat them the same.

There you have it. Through all three parts of the Know Your Camera series I’ve shown you Shot Lengths & Angles, Movement and, now, Settings of the camera object in Cinema 4d and After Effects that you can apply across all software. Play around with these settings to get a good feel for what they do because many interesting things can come of them. Good luck!

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

It goes without saying that movement is important in motion graphics. The whole industry is based on movement, and through the use of the camera, and creative motion of your object, your work can really shine. Because we work in mostly user created environments, the cameras and objects can move in any direction or rotation that you can think up; however, by following the basics you can achieve better quality work that will appear less confusing to your audience. Let’s take a look at the basics of movement.

Camera Movements

Dolly

A simple movement toward or away from an object, or from side to side. This is not zooming, though they share similarities. The camera physically moves, but no settings of the camera (other than the coordinates) change.

Follow

Also called a tracking shot. The camera follows the object as it moves on the Y and Z planes.

Pan

The camera rotates across the object, but does not physically move it’s position.

Pedestal

A vertical movement as the object stands still.

Tilt

The camera rotates up or down to or from an object.

Arc

A 180 degree movement around the object.

Object Movement

The camera isn’t the only thing that moves in your scene; your objects can also have movement. The way the object moves depends on many factors including what it is and how it’s being used in the scene, so it can have natural or unnatural movement depending on what you choose and what the object is. A good rule of thumb is to keep true to the project and to what the idea of the object is. If the movement fits the object and the scene, then it’s a good bet it’s the right move. For more information on object movement and animation, check out The Principles of Animation for Motionographers – Part I, Part II and Part III.

The Foundation is Set

That’s the basics of camera movement. Hopefully this allowed you to grasp (or remember) the fundamentals which you can apply to your work. There are more camera moves and combinations of moves that you can apply to your work to make it flow better, but using these tried and true methods will give you a good foundation to start from. When striving to create better projects, you can never have too many tools, or too much knowledge, on your side.

Please check out my next article, Know Your Camera, Part III: Settings, in which I will go over the many different settings your camera has for you to play around with to create more interesting shots.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

Throughout the history of cinema, clever camerawork has given individual meanings and emotions to certain angles and shot lengths that help push the message of the scene even further. These feelings don’t end just because you aren’t using a physical camera. They can, and should, be created with the virtual cameras included in the software you are using to tell your story. At the very least, it will make your work look more professional and make you look more proficient at the software you use.

In this article, the first of a three part series, I will explain the different shot lengths and angles and how you can use them to spice up your work and make it more exciting. So, without further ado, lets get to know the camera better by first focusing on shot lengths and angles.

Shot Length

When you hear people throwing around the terms “framing a shot” or “shot length” they are talking about the distance the camera is from your subject. There are many different types of shot lengths used, and each is used for a different reason and conveys a different meaning. Traditionally, the closer the camera is to your subject, the more intimate the feeling. It also should go without saying the further away the camera is from your subject the more you can see.

A lot of your work will be stuck in the long shot area, but when it is possible try to vary your shot length. You would be surprised at how little an audience needs to see in order to recognize an object. Also, you would be surprised at how certain objects naturally frame your scene the closer you dolly in on the subject. Don’t be afraid to try out different shot lengths and see how they play out with your project.

Let’s take a closer look at the more common shot lengths and how they can be used to make your work look better.

Extreme long shots are used in film and animation to simply set up a shot. For example, if your next scene is to take place in a house, the first shot you’ll see is an exterior shot of that house. This tells the audience where the next scene will be taking place and cause less confusion.

The extreme long shot can be used in reverse as well. If you start off with a series of close-ups on your subject and only give the audience an extreme long shot in the end to reveal where that subject is, you can successfully create a mystery and your audience may feel rewarded as they finally get the answer to the mystery they have been trying to solve this entire time.

A long shot is used in film and animation to basically show the subject they want the audience to be focused on in a scene. It’s created by filming the subject from top to bottom filling the entire frame.

A medium shot is half of a long shot. In film, it would be half of your actor (usually from waist up), but in motion graphics it would just be half of your subject whether that be text or an object.

Close-ups are, in film terms, used to show one character up close and personal, usually framing the head. In motion graphics it can be used to frame a smaller part of a bigger object–a tire on a car, for example.

Extreme Close-ups are mainly detail shots. In film they may be a shot of a character’s eye like in the intros to most early episodes of Lost. In motion graphics they are more likely just a shot of individual detail located in your work.

Angles

Angles are, of course, the angle of the camera in relation to your subject. There are many different angles in traditional film that are associated with emotions, and using them in your work can help you solidify a certain feeling without having to drastically change anything about your project. They also make your work look more professional and causes it to stand out from the crowd. Again, don’t be afraid to try out different angles on your project. In fact, rarely should your project ever have the dead-on eye level camera mentioned first below. Spice it up with different angles and see where it takes your project.

Eye level is a basic shot that is filmed as if it was right where you are standing, from your height. It’s a basic shot.

High angle shots give off the emotion that the subject is weak and cowering. You have seen it in film many times when the good guy is beating the bad guy (or vice versa). The one taking the beating is always filmed lower than the one doing the beating, and the camera is always looking down at them.

The opposite of the high angle is, obviously, the low angle, and it has the opposite effect as well. The more powerful character at the time will always be filmed at a low angle to give them more of a powerful stance as if they are mightier. It, of course, also makes the letters and objects look bigger so you may see them used in “big sales” ads or something to that effect.

Bird’s-eye views are simply there to allow the scene to be set up much like an extreme long shot. It’s mostly used when the subject is traveling from point A to point B.

If something is not right you might see the dutch angle. This gives the impression that something is wrong with the subject in the scene.

Over the shoulder shots are used mainly in film when two characters are talking to each other, but there’s no reason you couldn’t use this shot to spice up your work in a fashion similar to what I have in the picture above.

End Remarks

There is no definitive guide to what shot lengths or angles you should use in any specific area, especially in motion graphics, but the ones I have listed here have been tried and true in Hollywood for decades and will work for you in your project, even if it’s only on a subconscious level. At the very least you will be giving your work a different look which, in turn, will make your work look more professional and you look like you know your camera.

Please check back for the next part in the series, Know Your Camera, Part II: Movement.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

SECONDARY ACTION

Secondary action is used to enhance the primary action. Secondary action will often give your primary action much more impact, but if overused, it will only muddle what is going on and confuse the viewer. If this happens, you should consider removing the secondary action or staging the scene differently.

Maxim Zhestkov / art film / personal project / 2006 (click to view QT video in new window)

Maxim Zhestkov’s works are great examples of using secondary action to enhance simple actions, all while using simple shapes. In the linked example above, there is a simple action: a circle moving across the screen, but it is only made interesting using the focal point due to the secondary actions of the other circles when they react.

Secondary action can take place before, during or after the primary action. The start of a secondary action during a major action can go unnoticed and the value will be lost, so staging once again must be considered to ensure that it is always obvious while not overshadowing the primary action.

TIMING

Timing refers to the number of frames it takes to complete an action. This becomes very important because of all the factors you have to take into account when planning for it. If you are making something move fast, you have to make sure that it’s still legible to the viewer, and if it’s a slow movement, it should hold their attention. Also, depending on the use of either fast or slow actions, you can establish moods of franticness, lethargy, energy, assuredness, excitement, nervousness, relaxation and drama.

Most importantly, timing can establish a sense of weight. A heavier object will take more time to ease into a motion and change directions, while a light object has less mass and is much more influenced by a force like wind and can change direction, stop and start much more quickly. Sometimes it is a good exercise to try to view the objects in your scene as silhouettes and try to tell from the timing if you can still get a sense of what that object is.

EXAGGERATION

Exaggeration may be one of the hardest concepts to master. Exaggeration doesn’t mean that everything should look like a Saturday morning cartoon. The concept is to find the most important ideas, emotions or concepts in the shot and enhance them until there is no doubt what is being communicated. You may want to think of this as the same technique that a caricature artist uses, finding the most identifiable parts of something and enhancing it until those few parts are the focus and everything else is just the periphery; connecting the pieces together. This can be done through not only animation, but through color usage, lighting, staging, sound design, typefaces or the shape of the objects. Some of these can be used selectively, but they should always work in harmony with each other to create the message. If one of the elements don’t fit, you will still get the feeling that something is wrong even if you aren’t able to pick out exactly what was off.

This Air Jordan commercial uses the lighting, time manipulation, sound design, and staging to enhance the drama. You can see in the altered version below that by changing the timing back to normal, balancing the color, and removing the sound, the impact is lost when you aren’t allowed to key in on the reactions of the people and focus in on Jordan’s slowed-down moves. The five scenes don’t really seem like much when the original 30 second spot is cut down to 12 seconds.

APPEAL

I like to think of this principle as the “make it look great” principle. This doesn’t mean that you need to apply realistic lens flares, have huge 3D models with fluid simulations and use the latest Trapcode and Sapphire plug-ins. You just need to make something that holds a person’s interest throughout and communicates your message. Simple, right?

Appeal should always be dependent on the audience and the message you are trying to communicate. There’s no universal rule or style that works for every project; it’s really up to the designer to be able to justify why their pitched idea is the best solution to communicate the message.

In these next examples, you will see very different approaches all conveying a message that’s interesting to watch from beginning to end.

Conclusion

All of these concepts are designed to help you better communicate your visual ideas, whether you’re an animator or designer. The tools are easy enough to learn, but the goal is understanding how to use them to deliver a message that is clear, convincing and hopefully interesting enough to take your work to the next level.

I hope that this short series of posts has been clear, informative and applicable to what you do. If you have any questions, please feel free to leave them in the comments below. Also, the Fuel Your Motionography team would love to see you putting “the principles” to practice. If you have anything you want to share with the community, we’d love to have you join our flickr group and upload your work. It’s a great way to get your work out there and receive feedback.

For anybody interested in animation, I would highly suggest finding a copy of Frank Thomas and Ollie Johnston’s The Illusion of Life which this article is based on. Often referred to as the bible of animation, it is full of insight on the animation process and stories behind some of Disney’s greatest works.

REFERENCES:

Thomas, Frank and Johnston, Ollie, Disney Animation: The Illusion of Life, Abbeville Press, New York, 1981

All of the linked videos are property of their respective owners.

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

STRAIGHT AHEAD ACTION and POSE TO POSE

Straight ahead action and pose to pose are two approaches to animating in 2D animation. With straight ahead action, the animator starts at the beginning of a scene knowing what actions must take place, then draws each frame sequentially. This approach allows the animator to improvise as he goes along and will usually give your animation a bit of spontaneity.

In this scene from the animated film The Iron Giant, a straight ahead action technique was used most to animate the jittery child (~31 second mark), and allows more of a free-flowing stream of consciousness feel to the shot.

Pose to pose animation is the most common approach used with modern animation using After Effects and 3D suites. With this technique, you set keyframes to create keyposes at determined times. Unlike 2D cel animators, you do not have to draw inbetweens (also known as tweening) between keyposes as After Effects will create these for you. While it may reduce your workload, it can also produce unexpected results. In my workflow, I like to review both shot and keyframe in the storyboarded key poses that I know I have to hit. I then go through and give it a second pass of keyframes, still trying to keep my timelines as clean as possible. Finally, I repeat the application of more passes of keyframes as needed. This process of animating in passes ensures that you maintain proper timing and helps eliminate unnecessary keyframes that can make revisions a giant headache.

If given more complex objects like human character models to animate, I often try to break down passes into parts. Looking back to the robot jumping example in Part 1, I would first do a pass of animating just the position. When previewing a stiff character, you can still get a good idea if the animation is too fast or slow. Then, I like to move to animating the driving force; in this case the legs and torso, which allows the character to get from point A to B. Next, I would do a pass of animating the arms and head which help to flesh out the character’s anticipation, squash and stretch, and follow through (see next section). Now with a full rough animation, I will go through and add more passes to smooth out the inbetweens.

FOLLOW THROUGH

Anticipation, action, and follow through are the three stages of an animation. An action that comes to an abrupt end without follow through often feels unnatural, as if the object has lost all sense of mass, volume and velocity.

Just like you would account for in the anticipation and action stages, you have to think of the objects in terms of the same properties of volume, mass, velocity and weight distribution when animating follow through.

We’ll look at this animation from a recent project I had worked on as an example of follow through. As Kobe hangs on the rim after he dunks, his body and legs rocks back and forth from the momentum of his jump. Even without using the cutout model that the treatment called for, you can still get a sense of reality due to the movement on the swinging animation.

There are a few expressions that you can use in After Effects that will help automate some of these animations, but I believe that at times they can lack a natural feel to them no matter how mathematically correct they are.

SLOW IN and SLOW OUT

Slow in and out or ease in and out as it is most often referred to in motion graphics is used to distribute the inbetween frames between keyframes. The effect of this technique is most easily represented in a spline keyframe graph.

You can see that the ease ins and outs on the magenta circle gives the action a much less mechanical feel and allows you to have more natural feeling stop when actions like follow through are not available.

ARCS

When using the pose to pose process of animation, you will often get animation that is very robotic feeling where objects will move from point to point and lack a natural arcing motion. These actions lacking arc often feel as if they lack a sense of weight.

Arcs can be added to your animation by turning on bezier handles to your keyframes. You can create much smoother animations without having to add more keyframes to your timelines.

Using bezier handles in After Effects to create a circular motion path

Conclusion

All of these concepts are designed to help you better communicate your visual ideas, whether you’re an animator or designer. The tools are easy enough to learn, but the goal is understanding how to use them to deliver a message that is clear, convincing and hopefully interesting enough to take your work to the next level.

The finale, or Part 3 of this series to be published next Wednesday will cover secondary action, timing, exaggeration, and appeal. If you have any questions, feel free to leave a comment below.

REFERENCES:

Thomas, Frank and Johnston, Ollie, Disney Animation: The Illusion of Life, Abbeville Press, New York, 1981

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)

This is the first in a 3-part series where we’ll look at the Principles of Animation, developed in the early years of Walt Disney animation as they were pioneering the young animation field. Today, I’ll show you how they can be applied to your motion design work.

While previously working at a broadcast and motion design boutique, I had to go through a stack of demos for an animator position. Within the first 15 seconds of each reel, I could tell which of the applicants had filled their reel full of the latest tutorials off sites like Video Copilot (no knock on the amazing tutorials by Andrew Kramer, I have probably watched through all of them myself and learned a lot). The animation reels that really stood out were the ones that displayed an understanding of weight, velocity, object interaction, anticipation and the use of animation to communicate a feeling or emotion.

In the growing landscape of online tutorials that promise to teach you how to create “amazing effect X” or “breathtaking effect as seen in movie Z”, it’s very easy to learn the tools of the motion graphics trade. By following a step-by-step guide, you can easily learn how to apply the latest plug-ins and what each of the settings do. These posts are not going to cover anything as exciting as that, but will examine a few basic but essential guidelines to improve your work.

SQUASH AND STRETCH

Squash and stretch is perhaps the most important principle as it sets up the rigidity, mass, volume and in more complex objects, the physical structure of an object. The most common example and exercise used in teaching this principle is in the bouncing ball animation as seen in the video below:

As you can see, the ball at its peak is a perfect sphere showing a state of transition from ascending and descending. As the ball falls, it becomes elongated to show the pull of gravity and at the same time, maintaining the same volume. The degree to which the ball becomes elongated tells you how rigid the object is. At the bounce, the ball immediately becomes squashed to show the impact and interaction between the ball and the floor. Once again, the ball maintains the same volume by becoming shorter as it grows wider. As the ball bounces and transfers its energy up, it transitions back to elongated. And finally, the ball transitions back to the perfect sphere shape as it reaches the next apex in the animation. This exercise can turn out looking a number of different ways when various levels of rigidity, volume, and velocity are applied.

Bouncing Ball Timeline with echo (Click for larger image)

In the next example, we’ll look at the application of squash and stretch and how it applies to a more rigid object like a robot.

Even though the skeleton of this robot consists of completely rigid parts, proper squash and stretch can still be used in which the robot’s joints fold as they land and stretch out while jumping outwards. Observe the shifting of volume and weight.

ANTICIPATION

Some of my favorite examples of anticipation come from old Wile E. Coyote cartoons. An example of anticipation is the moment where Wile E. Coyote stalls momentarily in mid-air after realizing he has stepped off a cliff, inevitably plunging to the bottom. Both you and Wile E. knew what action was coming before you even saw it. In some cases, anticipation can be more satisfying to see than the consequence itself. A prime example of this would be in animating a very fast moving object. In a pitcher’s throw, you expect to see a wind up preceding planned actions. The wind up in anticipation can be used to add a great deal of character to an action.

Example of the the anticipation action in a pitcher's throw. (Click for larger image)

Anticipation can also be used between multiple objects. One object may move in anticipation based on the action of another object. This interaction can be used to direct the viewer’s attention to the second object. Inversely, you can choose to omit anticipation to create a surprise, however, I’ve found that proper timing can still be referred to as anticipation.

STAGING

Staging is often referred to as composition in motion design. You should always stage so that only one message, action or idea is clearly the object of focus. Like in good graphic design, composition should be used to direct the eye and remove confusion. Obviously this can become either more complicated or easier due to the element of time. Unlike a poster, you can cut to a whole new composition and for a few seconds, key in on one element of a larger scene.

For motion designers using 3D applications, I have observed that it’s always everyone’s immediate instinct to create these large, sweeping and constant moving camera set-ups. Quite frankly, whenever I see that, my immediate reaction is to think that this person isn’t disciplined enough to ask themselves which composition is best to communicate the message. Sometimes fast sweeping cameras are the correct solution but most often it isn’t. Resist the urge.

Staging tips:

• Use thirds
• Point to the desired area
• Use contrast (lighting, movement, depth of field, etc.)
• Step away and look at it with a pair of fresh eyes
• Limit the action to one animation group at a time

Staging: Try to organize points of interests on either the intersections or along the lines. (Photo by Anthony Grimley)

Staging: Use depth of field to create a focus on your subject (Photo by Donovan Martin)

Staging: Example of leading the eye to a point. (Photo by John Mueller)

Staging: Shifting the point of view can elicit different feelings or moods. (Photo by Peter Allen)

Conclusion

All of these concepts are designed to help you better communicate your visual ideas, whether you’re an animator or designer. The tools are easy enough to learn, but the goal is understanding how to use them to deliver a message that is clear, convincing and hopefully interesting enough to take your work to the next level.

For anybody interested in animation, I would highly suggest finding a copy of Frank Thomas and Ollie Johnston’s The Illusion of Life, which this article is based on. Often referred to as the bible of animation, it is full of insight on the animation process and stories behind some of Disney’s greatest works.

Part 2 of this series is all about animation. We’ll be taking a look at straight ahead and pose to pose animation, slow in and outs, follow throughs and arcs. If you have any questions, feel free to leave a comment below.

REFERENCES:

Thomas, Frank and Johnston, Ollie, Disney Animation: The Illusion of Life, Abbeville Press, New York, 1981

Sponsored by

Advertise on Fuel Brand Network.
Fuel Brand Network 2010 cc (creative commons license)