| The more complex the shape you tween, the more difficult it is for Flash to create the expected result. That's because Flash changes the shapes by changing the mathematical description of the graphic. Flash does not understand how the forces of gravity, light, and so on affect the ways humans see; therefore, it doesn't always choose to make a change in a way that preserves the illusion you want. You can help Flash tween better by using shape hints markers that allow you to identify points on the original shape's outline that correspond to points on the final shape's outline. To shape-tween a more complex shape: -
Create a new Flash document. -
On the Stage, in Frame 1, draw an oval with no stroke. -
In the Timeline, select Frame 5, and choose Insert > Keyframe. Flash duplicates the contents of Keyframe 1 in Keyframe 5. -
In the Timeline, select any of the frames in the Keyframe span (1, 2, 3, or 4). -
From the Frame Property Inspector's Tween pop-up menu, choose Shape. -
In the Timeline, position the playhead in Frame 5. -
Using the arrow tool or the pen and subselection tools, drag four corner points in toward the center of the oval to create a flower shape. For more detailed instructions on editing shapes, see Chapter 3. -
Play the movie to see the shape tween. Flash handles the tweening for this change well (Figure 10.13). It's fairly obvious what points of the oval should move in to create the petal shapes. Figure 10.13. Flash handles the tween from an oval to a simple flower shape without requiring shape hints.  If you modify the shape further, however, it gets harder for Flash to know how to create the new shape. That's when you need to use shape hints. To use shape hints: -
Using the animation you created in the preceding exercise, in the Timeline, select Frame 10, and choose Insert > Keyframe. Flash duplicates the flower shape in a new keyframe. -
In Frame 10, edit the flower to add a stem. Reshape the outline with the arrow tool or the pen and subselection tools, or add a stem with a brush stroke in the same color as the flower. -
Define a shape tween for frames 5 through 9. -
Play the movie. The addition of the stem to the flower makes it hard for Flash to create a smooth tween that looks right (Figure 10.14). Figure 10.14. The addition of a stem to the flower overloads Flash's capability to create a smooth shape tween. Frames 7 and 8 are particularly bad.  -
To begin adding shape hints, position the playhead in Frame 5 (the initial keyframe of this tweening sequence). -
From the Modify menu, choose Shape > Add Shape Hint, or press Shift-  -H (Mac) or Ctrl-Shift-H (Windows) (Figure 10.15). Figure 10.15. Choose Modify >Shape >Add Shape Hint to activate markers that help Flash make connections between the original shape and the final shape of the tween.  Flash places a shape hinta small red circle labeled with a letter, starting with a in the center of the object in the current frame. You need to reposition the shape hint to place it on a problem point on the shape's outline. -
With the arrow tool, drag the shape hint to a problem point on the edge of the shape. Don't worry about getting the shape hint in exactly the right spot; you can fine-tune it later. -
Repeat steps 6 and 7 until you have placed shape hints on all the problem points of your shape in Frame 5 (Figure 10.16). Figure 10.16. Start adding shape hints in the first keyframe of a tween sequence. Flash places the hints in the center of the tweened object (top). You must drag the hints into position (middle). Distribute the hints in alphabetical order around the outline of the object, placing them on crucial points of change (bottom). Here, the three points with hints a, b, and c define the points from which the stem of the flower will grow.  Each time you add a shape hint, you get another small red circle labeled with a letter. You cannot place the hints at random; you must place them so that they go in alphabetical order around the edge of the shape. (Flash does the best job when you place shape hints in counterclockwise order, but you can also place them in clockwise order.) -
In the Timeline, position the playhead in Frame 10. Flash has already added shape hints to this frame; they all stack up in the center of the shape. -
With the arrow tool, drag each shape hint to its position on the new shape. Keep them in the same order (counterclockwise or clockwise) you chose in step 8 (Figure 10.17). Figure 10.17. To complete the placement of shape hints, you need to select the second keyframe of your tween sequence. Flash stacks up hints corresponding to the ones you placed in the preceding keyframe (top). You must drag them into the correct final position (bottom).  -
To evaluate the improvement in tweening, play the movie. -
To fine-tune the shape hints' positions , select one of the tween's keyframes, and turn on onion skinning. Set the onion markers to include all the frames of the tween. Where the onion skins reveal rough spots in the tween, you may need to match the hint position better from the first keyframe to the last one (Figure 10.18). Repositioning the shape hints changes the in-between frames. Figure 10.18. It can be difficult to match up points in the two keyframes exactly when you first place the shape hints. When you've positioned the hints in the beginning and ending keyframes of a sequence, turn on onion skinning to see where you need to adjust the placement of your hints. With the initial placement, Flash starts the stem growing with an indent at the bottom (top). Moving the points closer together improves the tween (middle). When the onion skins reveal a smooth tween, you're done (bottom).  You may need to adjust the shape hints in both keyframes. If you still can't get a smooth tween, try adding more shape hints.  Tips -
To remove a single shape hint, make the initial keyframe the current frame. Select the shape hint you want to remove, and drag it completely off the Stage. -
To remove all the hints at the same time, with the initial keyframe current, choose Modify > Shape > Remove All Hints. -
Onion skins don't always update correctly when you reposition shape hints. Clicking a blank area of the Stage forces Flash to redraw them.
|
