Flash Animation 2:

 

A look at the early history of animation. (See previous Blog)

------------------------------------------------------------------

Two fundamental animations: Ball bounce and the Walk Cycle

Last week, we looked at how to tween and how to use layers to change the 'depth' of the movie clips we made. (Remember my beautiful fish?)

The first exercise, is to make a bouncing ball.

Trying this out using the tweening function from last week doesn't provide us with a 'realistic' bounce. We need to make the ball fall and rise as if it is under the effect of gravity - falling slowly at first, hitting the ground, then rising quickly and finally slowing down as it reaches the start position.

To do this, we need to use the easing property. You can find this by clicking on a tween on the timeline and then looking at the Properties pane. Play around with this and see what effect it has.

When you have done this, you should then try to make the ball squash on impact, then squeeze as it rises. To do this, use the Free Transform tool (underneath the 2 selection arrows in the Tools pane).

[ You will need to add a couple of extra keyframes around the point of impact to achieve this, as shown in the demonstration

Play around with this, making the ball appear heavier or lighter, or more or less squashy.

 

The second exercise involves making a character that walks.

There is quite a good breakdown of the walk cycle at:

http://www.idleworm.com/how/anm/02w/walk1.shtml

Notice that the cycle is analysed and broken down into 4 phases:

Contact, Recoil, Passing and High-Point.

These phases are repeated for each leg - 8 keyframes in total. Try enacting it yourself, or look at someone walking.

There are many reproducing this in Flash. You could draw 8 (or multiples of this) separate images of a character, spread out over the same number of frames - but this can be quite time consuming - and tricky to alter should you want to change the character's behaviour (running, waving, limping etc..). Another method involves making separate body parts as movieClips, then assembling these on different layers on a frame. Making the walk cycle then involves inserting keyframes for each of the phases, and rotating and moving the movieClips to the correct positions.

To get started you'll need to make MovieClip Symbols (those things in the library). I suggest the minimum should be: Head, Lower and Upper leg, Lower and Upper arm, Body and Foot.

You then need to assemble instances of these on the first frame. With a left-to-right walk, you need to have the layers arranged from the top:

Right Lower Arm

Right Upper Arm

Right Upper Leg

Right Lower Leg

Right Foot

Body

Head

..... and then the same as the above for the Left limbs.

Once you have positioned and rotated the moviClips for the 'Contact' phase, insert keyframes a couple of frames later for each layer. Then reposition and rotate the clips for the 'Recoil' phase etc...

After you have completed the cycle, try running your movie. You may want to add tweens to smooth the motion.

[ If you are feeling keen, you may later want to look at the 'Puppet' feature to make a walk cycle. This can be quite an involved process, but produces some excellent results: Tutorial:

http://layersmagazine.com/flash-cs4-animating-puppets.html]