Shoot First: The Craft | Animation Principles: The Bouncing Ball
Shoot First: The Craft

The Bouncing
Ball

Every principle of animation is hiding inside a ball hitting the floor. Learn to read it here and you can read motion anywhere: a punch, a whip pan, a title card, a character taking a step. Play with the demos, then build the bounce yourself at the bottom of the sheet.

Start here

Animation is only ever two decisions repeated: how long something takes, and where it sits in every frame along the way. Everything else on this sheet is a refinement of those two.

Timing and spacing

Time: how many frames. Spacing: where you place the animation inside those frames. Both of the balls below take exactly the same time to complete a bounce, but changing the spacing makes a world of difference to the weight.

Even spacing: same distance every frame, so it reads as a floating machine Eased spacing: tight near the top, wide near the floor, so it reads as gravity
Rule: even spacing is mechanical, so look to break it, even for mechanical objects. Frames bunch up where the movement is slow, and spread out where it is fast.

Chart it yourself

DO IT YOURSELF YOU LAZY BUM. Drag the numbered marks to set where the ball sits on each frame, then watch it play.

Slow in and slow out

Also called ease in and ease out. Same thing. However fast your car gets from 0 to 100, it doesn't do it linearly. It starts slow and gets faster. Unless you smash into a wall, getting back to 0 is also gradual. Slow in, slow out. Most things in life follow this rule, so beware of linear motion, and if in doubt, eeease it up baby.

Squash and stretch

Weight and material

Deformation tells the audience what the ball is made of and how hard it hit. The critical rule is volume: whatever you take off the height you add to the width, or the ball looks like it is inflating and deflating instead of being squashed. Traditional animators will squash and stretch skulls to push the storytelling. With luck that won't happen to any of us, but squashing and stretching will make a huge difference to how believable and pleasing your animation is.

Rigid: correct spacing, no deformation, reads as a marble Squash and stretch: same path, reads as rubber

Arcs and tangents

Arcs and curves are huge for animation. In traditional animation they're used to bring life to movement. Just as we've seen that spacing shouldn't be linear, movement shouldn't either. Most things will have an arc to them, even a bullet, since gravity will push it down.

In 3D animation, curves become a part of the animation process. You should have as few keyframes as possible, and control the movement between them with curves. Hit Enable tangents below, which will give you handles you can use to sculpt out the movement of the ball between the keyframes and give it a nice smooth arc.

Anticipation and follow through

What happened before you clicked on this cheat sheet? Most people squeal with expectation. That's anticipation. What are you going to do afterwards? Most people leave a glowing Trustpilot review. That's reaction, or follow through. How will you feel for the rest of the day? Wibbly. That's settling.

Most movements need anticipation, follow through and settle. If you want to jump, you'll do the opposite movement first: instead of going up, you bend your legs and go down. Anticipation. When you land, you'll bend your legs to absorb the shock, or snap your knees and collapse to the ground. Either way, that's the follow through. Then you might need an extra step to soak up more energy, or a painkiller if you smashed your knees. That's the settle.

No prep: the ball simply leaves, and the eye misses the start Anticipation: compress down, hold one beat, then launch, then land and settle
Of course in this example the ball can't anticipate its own movement. But because we made it do it, it suddenly feels like a little character.

The workspace

Enough fun. Time to lay down your own keyframes. For your first pass you'll probably want a guide. Pick a ball, then place each key as you are prompted and see the reason for it. Once you've spent some time on that, switch over to The Lab, just to remind yourself that in 3D you can also simulate animation. Which is better? It depends on the task. Animation wins hands down for directability, and simulation wins every time at scale. It's very normal to combine the two: block in simple animation, and use simulation over the top for nuance.

Step 1  Choose your ball

Step 2  How to place a key

Drag the ball on the stage to place it. That writes a key on whichever frame you're currently parked on. To place your next one, move along the timeline first: click or drag anywhere on the timeline strip under the stage to change frame, then drag the ball again. If you don't change frame, you're just editing the same key, so nothing new appears. Drag the square handle above the ball to squash or stretch it, width is corrected for you so volume stays constant. The frames in between are worked out from your keys.

done

Shoot First / The Craft / Animation Principles: The Bouncing Ball