Animations and Interaction - Working the Timeline
(Page 3 of 11 )
The Timeline in Flash Pro is best envisioned as a strip of movie film. On that strip of film you can see individual frames, and as the playhead moves across the frames they're shown sequentially so that images appear to move. As noted in Chapter 1, the frames can be keyframes (including blank keyframes) or regular frames (simply called frames). The keyframes contain images, and the frames between the keyframes have the in-between images to fill in the changes in object position, thus creating smooth animation.
Animation Is Always an Option - Of course, you're not required to have animated objects in the keyframes; Flash Pro can be employed as a tool for developing general Web pages or sites. For example, you can use keyframes to place different pages in a menu-driven application. However, the main purpose of using the Timeline is animation, and this chapter focuses on creating different types of animation.
Shape Tweens You create shape tweens by placing a drawing in one keyframe and a different drawing in another keyframe. The differences in the drawings are automatically filled in by the intervening frames when the first keyframe (the one on the left) is set as a shape tween. To set a keyframe, simply select the keyframe and select Shape from the Tween pop-up menu in the Property Inspector.
You can use shape tweens for changing shape colors and positions on the Stage. If two identical shapes are used in different positions, the shape simply moves from one position to another. You can create interesting effects using shape tweens by changing solids into linear or radial color gradients, without changing the shape of the drawing.
Morphs A morph is rooted in the term metamorphosis, where one object morphs into another. Perhaps the best known such transformation is that of a caterpillar into a butterfly. Getting a good morph in Flash Pro is a matter of what changes occur in a drawing as well as having solid single colors versus many colors. For example, Figure 4.5 shows a drawing of a pheasant on the ground. By creating another drawing of a pheasant in flight (see Figure 4.6), an attempt was made to transition the standing bird to the flying one using a simple shape tween.
Figure 4.5 - Original drawing in Frame 1.
Figure 4.6 - Second drawing in Frame 40.
Using 40 frames for the transition, the bird appears to fall apart and then be reconstructed. Figures 4.7 and 4.8 show the tweened frames created between the keyframes.
Figure 4.7 - In Frame 15, the bird appears in disjointed pieces.
Figure 4.8 - By Frame 30, the bird is coming back together as the bird in flight, but it's still disjointed.
One solution to remove the in-between frames that display unwanted disjointed elements is to have fewer frames between the original drawing (bird standing) and the final drawing (bird in flight). A quick change generates what could be taken as the flapping effect of a bird taking off. For example, if you change the number of frames from 40 to 5, the in-between frames are not as noticeable as being drawings in the process of morphing. However, such half-measures, although sometimes convincing, generally don't work well. A better solution is to use more keyframes and less morphing. Morphing works best with solid, mono-colored objects, and for professional-looking results, more drawings and judicious use of morphing is in order.
 This chapter is from Macromedia Flash MX Professional 2004, by Bill Sanders (Sams, 2004, ISBN: 0672326051). Check it out at your favorite bookstore today.
Buy this book now. |
Next: Using Shape Hints to Morph Fonts >>
More Flash Articles
More By Bill Sanders
