Morphing
Shapes in Flash
Home > Build
> Software > Flash
by Don Herion
(1)
(2) (3) (4)
5)
After seeing that groovy haircut that 'oh' expression changes into pure horror.
Use your imagination to come up with a unique shape. I chose a big drooping grimace.
It's the look of despair I had after my father gave me a crewcut when I was six.
Remember to insert your 'Blank Keyframe' (F7) first. Now select frame 15 and apply
the 'shape' tween. I set my 'ease' slider to -100 so the effect will accelerate
to frame 25.
 |
| Use your 'bezier tool' to create your mouth |
Unfortunately when I tested my animation I got a weird
distortion as my grimace rotated 90 degrees. This might happen to you depending
on how you created shapes. But this gives me the chance to tell you about 'shape
hints.' Sometimes when you morph odd or complex shapes you might get very strange
morphs. 'Shape hints' can give you a measure of control on how Flash executes
a shape tween.
I selected 'Frame 15' in my mouth layer. I
then pressed Ctrl-H. A 'shape hint' appears in the center of my shape. As you
can see it is round and has the letter 'a.' I dragged it to the top edge of my
'oh' shape. I clicked Ctrl-H again and now 'b' appears. I dragged this to the
right edge of my 'oh' shape. I then added two more, 'c' and 'd.' Shape hints must
be set in sequential order, either clockwise or counter-clockwise.
I now
select Frame 25 of my mouth layer. All you see is one 'shape hint,' the letter
'd.' If you move it you will see the other are right underneath. Move the 'd'
hint to the left corner of your 'grimace' shape. Move the 'c' to the bottom edge.
Place the 'b' in the right mouth corner. And finally place the 'a' at the top
edge.
 |
| Frame 25 - Shape Hints |
Now
when I play my animation the distortion stops. This is a great tool to control
shape tweening.
6) Now for the eyes. I want them to close slightly,
as if squinting. Starting with the left eye I set a 'Blank Keyframe' (F7) at 15
and create my new eye directly over my original eye (Use onion skinning to align
elements). Now while your new eye is still selected 'copy' it. Select Frame 15
of the right eye and insert a 'Blank Keyframe' (F7). Now 'paste' in the copy you
made and move it over the right eye. Now select 'Frame 1' of the left eye and
apply a 'shape' tween. Do the same to the right eye.
