Principles of Animation 1: Bounce, Squash and Stretch.

This principle gives life to the animate and adds impact to designs. The best example being a bouncing ball. A ball, especially an inflatable kind would squash prior to bouncing back up into the air. Almost as if it’s being fired up into the air by it’s own bounce, it adds velocity and dynamic. A ball travelling at speed will begin to stretch to further fool the eye, giving the impression of speed without actually moving at speed.

This example by Jeremy Fee, uses squash and stretch to imply the ball is able to move of it’s own accord, as it would squash before bouncing itself up the stares. It even uses the Anticipation Principle prior to it’s big leap which I’ll be going into detail in a different post.

Another example by Herman Litt features good use of the bounce, squash and stretch. This is the far more simple principle I was looking for to define it. Making it easier to watch and understand the event.

I’m going to have a go myself using flash…

Bouncing ball without effectWell… it could be better… a lot better. Let’s try it with squash and stretch.

Bouncing ball with stretchThere we go. See how much more impact the ball has now. Now for something a little bit special.

Bouncing ball heavyInteresting, I minimised the number of excess bounces and now the ball seems heavier. I also added dry brush effect (the straight lines just behind the ball mid-fall) and impact lines on landing that quickly disipate. You may also notice the slight screen shake when the ball impacts giving it that real extra weight. The screen shake is simulated simply by moving the floor (the line in which the ball lands) up and down for about 4 frames. Giving it that rapid shake.

And there we are, a few examples on the First Principle of Animation; Bounc, Squash and Stretch.

Advertisements
Principles of Animation 1: Bounce, Squash and Stretch.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s