Anda di halaman 1dari 15

ANIMATION & EFFECTS

Shape Tweens

1. Creating A Basic Shape Tween


Instructions
1. Label the current layer 'shape tween'.
2. Draw a circle on your stage in frame one of the 'shape tween' layer.
3. Add a new keyframe [F6] in frame 20 of the 'shape tween' layer.
4. Draw a square over the existing circle in the new keyframe you created in the 'shape
tween' layer.
5. Select the frame segment that contains the circle you drew in step 2.
6. In your properties inspector change the 'Tween:' type from 'None' to 'Shape'.
7. Press [ENTER] to test your shape tween.

2. Controlling a Shape Tween using Shape Hints


Instructions
1. Begin by creating another basic shape tween like the one you created in 'A Basic Shape
Tween' but in a new layer called 'shape hints'.
2. Select the frame segment that contains the circle you drew in step 2 of 'A Basic Shape
Tween'.
3. Add a shape hint to your drawing by pressing Control-Shift-H. This will result in a red dot
with a letter appearing in the center of your shape.
4. Click on the dot with your mouse and drag the dot to the edge of your shape.
5. Now select the second keyframe. You should see another red dot with the same letter as
was produced in Step 3.
6. Click on this dot with your mouse and drag this dot to the opposite edge of your shape.
7. Now that you have added one shape hint, lets test your shape tween and see how it differs
from the Basic Shape Tween. You should note that your tween is a little more interesting
than the first one you created.
8. Continue to add additional shape hints to add more interest and as you add them, test your
tween to see what happens.

Important Notes About Adding Shape Hints


One thing to note about adding shape hints is that the maximum number of shape hints you
can add to an object is 26. Another thing you should note is that if you add TOO many
shape hints to your tween, you could cause the tween to stop tweening due to the fact

1|Page
that Flash is unable to interpolate your work. If this happens, try removing one or more
shape hints from your object and/or moving them to new positions around your shape
and eventually your tween should transform gracefully.

3. Creating A Letter Shape Tween


Instructions
1. Label the current layer 'letter to shape tween'.
2. Using the type tool, type the letter S on the stage.
3. Add a new keyframe [F6] in frame 20 of the 'text to shape tween' layer.
4. Draw a square over the text that appears there and then select and delete the text.
5. Select the frame segment that contains the S that you typed in step 2.
6. Now we will break apart the text so that it becomes an ungrouped shape by typing Control-
B.
7. In your properties inspector change the 'Tween:' type from 'None' to 'Shape'.
8. Press [ENTER] to test your letter to shape tween.

4. Creating A Word Shape Tween


Instructions
1. Label the current layer 'word to shape tween'.
2. Using the type tool, type the word 'Oval' on the stage.
3. Add a new keyframe [F6] in frame 20 of the 'letter to shape tween' layer.
4. Draw an Oval over the text that appears there and then select and delete the text located in
the new keyframe.
5. Select the frame segment that contains the word Oval that you typed in step 2.
6. Now we will break apart the text so that it becomes an ungrouped shape by typing Control-
B TWICE. Note that if we only typed this command once, we would end up with 4
separate letters which would still be grouped. Breaking apart the text twice is the only
way to convert the text to a simple shape.
7. In your properties inspector change the 'Tween:' type from 'None' to 'Shape'.
8. Press [ENTER] to test your word to shape tween.

2|Page
Motion Tweens

5. A Basic Motion Tween


Instructions
1. Label the current layer 'motion tween'.
2. Draw a circle on your stage in frame one of the 'motion tween' layer.
3. Select and group the shape you just drew using [Control G].
4. Add a new keyframe [F6] in frame 20 of the 'motion tween' layer.
5. Move the shape in the new keyframe to a new location on the stage.
6. Select the first keyframe using your mouse.
7. In your properties inspector change the 'Tween:' type from 'None' to 'Motion'.
8. Press [enter] to test your motion tween.

6. Rotating an Object
Hint: You may use this technique to simulate the motion of a tire on a moving car.
Instructions
1. Label the current layer 'rotating motion tween 1'.
2. Draw a square on your stage in frame one of the 'rotating motion tween 1' layer.
3. Select and group the shape you just drew using [Control G].
4. Add a new keyframe [F6] in frame 20 of the 'rotating motion tween 1' layer.
5. Select the first keyframe using your mouse.
6. In your properties inspector change the 'Tween:' type from 'None' to 'Motion'.
7. Also in your properties inspector change the 'Rotate' option to either CW (clockwise) or
CCW (counter clockwise) and set the number of times to 5.
8. Press [enter] to test your motion tween.

7. Rotating an Object on an Axis Point

Hint: You can use this technique to simulate a planet in motion around a sun.

Instructions
1. Label the current layer 'rotating motion tween 2'.
2. Draw a square on your stage in frame one of the 'rotating motion tween 2' layer.
3. Select and group the shape you just drew using [Control G].
4. Select the newly grouped shape using the Free Transform Tool.
5. Click and drag the registration point away from the center of the shape.
6. Add a new keyframe [F6] in frame 20 of the 'rotating motion tween 2' layer.
7. Select the first keyframe using your mouse.

3|Page
8. In your properties inspector change the 'Tween:' type from 'None' to 'Motion'.
9. Also in your properties inspector change the 'Rotate' option to either CW (clockwise) or
CCW (counter clockwise) and set the number of times to 1.
10. Press [enter] to test your motion tween.

8. Rotating an Object on an Axis Over a Distance


Instructions
1. Label the current layer 'rotating motion tween 3'.
2. Draw a square on your stage in frame one of the 'rotating motion tween 3' layer.
3. Select and group the shape you just drew using [Control G].
4. Add a new keyframe [F6] in frame 20 of the 'rotating motion tween 3' layer.
5. Move the shape in the new keyframe to a new location on the stage.
6. Select the first keyframe using your mouse.
7. In your properties inspector change the 'Tween:' type from 'None' to 'Motion'.
8. Also in your properties inspector change the 'Rotate' option to either CW (clockwise) or
CCW (counter clockwise) and set the number of times to 1.
9. Press [enter] to test your motion tween.

9. Moving Text On Your Stage


Instructions
1. Label the current layer 'basic text motion tween'.
2. Write your first name on the stage in frame one of the 'basic text motion tween' layer using
the Text Tool.
3. Add a new keyframe [F6] in frame 20 of the 'basic text motion tween' layer.
4. Move the text in the new keyframe to a new location on the stage.
5. Select the first keyframe using your mouse.
6. In your properties inspector change the 'Tween:' type from 'None' to 'Motion'.
7. Press [enter] to test your motion tween.

10. Letter by Letter Text Slide On Your Stage


Instructions
1. Label the current layer 'text slide motion tween'.
2. Write your last name on the stage in frame one of the 'text slide motion tween' layer using
the Text Tool.
3. Duplicate the 'text slide motion tween' layer but call it 'text slide motion tween copy' and
lock and hide this layer.
4. Select the first keyframe in the 'text slide motion tween' layer.

4|Page
5. Break apart the letters in your last name ONCE so that each letter becomes a separate
object within this frame.
6. Realign the letters using the align panel so that all of the letters are stacked under the first
letter of your last name.
7. Move each of the letters in your last name to separate NEW layers by entering [Control
Shift D] on your keyboard (Modify > Timeline > Distribute to Layers).
8. In each of the new layers, add a new keyframe [F6] in frame 20.
9. Reveal but don't unlock the 'text slide motion tween copy' layer and extend the keyframe
[F5] to frame 20 so that the text is constantly visible.
10. Reposition each of the individuals letters in frame 20 of each of the new layers so that
they line up with the matching letter in the 'text slide motion tween copy' layer.
11. Select the first keyframe of the first letter of your name using your mouse.
12. While pressing the [Shift] key, continue to select the first keyframes of each of the
remaining letters of your name.
13. In your properties inspector change the 'Tween:' type from 'None' to 'Motion'.
14. Temporarily 'hide' the 'text slide motion tween copy' layer and press [enter] to test your
motion tween.
15. ** If you are happy with the tween, you may delete the 'text slide motion tween copy'layer
OR save it for future use in your project as this layer contains a complete copy of your
text as well as the original letter positioning and font used which is what I would highly
suggest. To preserve this text, click on the first keyframe of the 'text slide motion tween
copy' layer to select that frame then click again and drag that keyframe to the position of
the last frame in that layer. Now the text only appears when all of the other letters fall into
place.
Important Notes About Rotating Objects
If you set the number of times to rotate too high, flash may not be able to interpolate the
results properly and produce unexpected results.

Important Notes About Text


If you wish to change the size of your text that you have placed on your stage, resize it using
the properties inspector and NOT the transform tool. The transform tool will resize the
text but the point size in the properties inspector will no longer be true and could result in
very distorted text making it difficult to format later down the line when you need to modify
the text.

5|Page
Motion Guides

11. A Basic Motion Guide

Instructions
1. Label the current layer 'motion tween'.
2. Draw a non-circular shape on your stage in frame one of the 'motion tween' layer.
3. Select and group the shape you just drew using [Control G].
4. We will now create a new layer directly above the 'motion tween' layer which we will label
'motion guide'.
5. In the first frame of this layer, draw a non-linear path across the stage using your paint
brush or pencil tool making sure to not overlap the path at any time. NOTE: Do not group
this shape at any time -- doing so will result in failure!
6. Extend this frame out to frame 30 by clicking in the 30th frame of this layer and add a new
frame [F5].
7. To convert the 'motion guide' to a guide layer, right click on the 'motion guide' label and
select the 'Guide' option about one third of the way down the pop-up menu. At this point
in time, you should see what looks like a T-square as the layer icon.
8. We will associated the 'motion tween' layer with the 'motion guide' layer by clicking on the
'motion tween' layer and dragging it up towards the 'motion guide' layer and when you
see a partial underline along the lower edge of the 'motion guide' layer, release your
mouse and the 'motion tween' layers icon should now be indented underneath the 'motion
guide' layer.
9. Lock the 'motion guide' layer at this point by clicking on the circle in the 'motion guide' layer
that falls below the lock icon.
10. Now that we have assoiated the 'motion tween' layer with the 'motion guide', select the
'motion tween' layer and add a new keyframe [F6] in frame 30 of this layer.
11. In the keyframe where the motion begins in the 'motion tween' layer, move the object to
the starting position of the 'motion guide'.
12. In the second keyframe, where the motion ends, move the object to the ending position of
the 'motion guide'.
13. Select the first keyframe using your mouse.
14. In your properties inspector change the 'Tween:' type from 'None' to 'Motion' and click on
the 'Snap' checkbox so that your shape 'snaps' in position over the 'motion guide'.
15. We will now 'snap' the object in the second keyframe to the 'motion guide' by repeating
what we did for the first keyframe but this time for the second keyframe. Select the
second keyframe using your mouse.
6|Page
16. In your properties inspector TEMPORARILY change the 'Tween:' type from 'None' to
'Motion' and click on the 'Snap' checkbox so that your shape 'snaps' in position over the
'motion guide'. Once the object 'snaps' to the 'motion guide', change the 'Tween:' type
back to 'None'.
17. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.

12. A Closed Path Motion Guide


Hint: You may use this technique to simulate the motion of a planet around the sun in a oval-
shaped path.

Instructions
1. Label the current layer 'motion tween'.
2. Draw a square shape on your stage in frame one of the 'motion tween' layer.
3. Select and group the shape you just drew using [Control G].
4. We will now create a new layer directly above the 'motion tween' layer which we will label
'closed motion guide'.
5. In the first frame of this layer, draw a oval shape on your stage using the oval tool. NOTE:
Do not group this shape at any time -- doing so will result in failure!
6. When you are done drawing the shape, remove the filling by selecting the filling using your
selection tool and pressing the [Delete] or [Backspace] key on your keyboard.
7. Extend this frame out to frame 30 by clicking in the 30th frame of this layer and add a new
frame [F5].
8. To convert the 'closed motion guide' to a guide layer, right click on the 'closed motion guide'
label and select the 'Guide' option about one third of the way down the pop-up menu. At
this point in time, you should see what looks like a T-square as the layer icon.
9. We will associated the 'motion tween' layer with the 'closed motion guide' layer by clicking
on the 'motion tween' layer and dragging it up towards the 'motion guide' layer and when
you see a partial underline along the lower edge of the 'closed motion guide' layer,
release your mouse and the 'motion tween' layers icon should now be indented
underneath the 'closed motion guide' layer.
10. Lock the 'closed motion guide' layer at this point by clicking on the circle in the 'closed
motion guide' layer that falls below the lock icon.
11. Now that we have assoiated the 'motion tween' layer with the 'motion guide', select the
'motion tween' layer and move the object to the starting position of the 'motion guide'.
12. Add a new blank keyframe [F7] in frame 30 of this layer.
13. Select the first keyframe using your mouse.
14. In your properties inspector change the 'Tween:' type from 'None' to 'Motion' and click on

7|Page
the 'Snap' checkbox so that your shape 'snaps' in position over the 'motion guide'.
15. We will now copy the object in the first keyframe by selecting the object on the stage and
entering the [Control-C] command.
16. In the blank keyframe, paste the object in place [Control-Shift-V].
17. The object should be 'snapped' to the guide layer at this point but to create fluid motion,
we will need to shift the object slightly so using your [Shift] and [Arrow] keys, move the
object one keypress either to the left or right or up or down depending on where your
object is with respect to the path in the 'closed motion guide' layer.
18. Press [Enter] to test your motion tween in the timeline. At this point in time, the object will
move VERY slowly across the stage from the starting position to the ending position
which will be about 10 pixels in distance.
19. To fix our problem, we need to add additional keyframes which we accomplish using a
'trick'. Click on the middle frame in the large keyframe segment of the 'motion tween'
layer and then click and drag your object to the opposite side of the 'closed guide layer'
path and release your mouse. Your object should 'snap' to the guide given it is close
enough to the line.
20. Press [enter] to test your motion tween in the timeline again. IF you are lucky, your object
MIGHT travel completely around the path but it is more likely that it will travel up and
down (or back and forth) over one side of the shape.
21. To fix this, we need to repeat our 'trick' one more time. Click on the middle frame of the
second frame segment of the 'motion tween' layer -- frame 23 should work for our
purposes. Now you will need to click and drag your object to the opposite side of the
'closed guide layer' path and release your mouse. Your object should, once again, 'snap'
to the guide given it is close enough to the line.
22. Press [Enter] to test your motion tween in the timeline. Your object should now be
completing a circular path around the guide path contained in the 'closed motion guide'
layer.
23. Now test your movie in the player [Control-Enter]. Here you should see smooth motion as
the object continously moves around along the oval shaped path.

13. A Motion Guide for Overlapping Paths

Instructions
1. Label the current layer 'motion tween'.
2. Draw a non-circular shape on your stage in frame one of the 'motion tween' layer.
3. Select and group the shape you just drew using [Control G].
4. We will now create a new layer directly above the 'motion tween' layer which we will label
'overlapping motion guide'.
5. In the first frame of this layer, draw a non-linear path across the stage using your paint

8|Page
brush or pencil tool making sure it overlaps at some point during the creation of the path.
NOTE: Do not group this shape at any time -- doing so will result in failure!
6. Extend this frame out to frame 30 by clicking in the 30th frame of this layer and add a new
frame [F5].
7. To convert the 'overlapping motion guide' layer to a guide layer, right click on the
'overlapping motion guide' label and select the 'Guide' option about one third of the way
down the pop-up menu. At this point in time, you should see what looks like a T-square as
the layer icon.
8. We will associate the 'motion tween' layer with the 'overlapping motion guide' layer by
clicking on the 'motion tween' layer and dragging it up towards the 'overlapping motion
guide' layer and when you see a partial underline along the lower edge of the
'overlapping motion guide' layer, release your mouse and the 'motion tween' layers icon
should now be indented underneath the 'overlapping motion guide' layer.
9. Lock the 'overlapping motion guide' layer at this point by clicking on the circle in the
'overlapping motion guide' layer that falls below the lock icon.
10. Now that we have assoiated the 'motion tween' layer with the 'overlapping motion guide'
layer, select the 'motion tween' layer and add a new keyframe [F6] in frame 30 of this
layer.
11. In the keyframe where the motion begins in the 'motion tween' layer, move the object to
the starting position of the 'overlapping motion guide'.
12. In the second keyframe, where the motion ends, move the object to the ending position of
the 'overlapping motion guide'.
13. Select the first keyframe using your mouse.
14. In your properties inspector change the 'Tween:' type from 'None' to 'Motion' and click on
the 'Snap' checkbox so that your shape 'snaps' in position over the 'overlapping motion
guide'.
15. We will now 'snap' the object in the second keyframe to the 'overlapping motion guide' by
repeating what we did for the first keyframe but this time for the second keyframe. Select
the second keyframe using your mouse.
16. In your properties inspector TEMPORARILY change the 'Tween:' type from 'None' to
'Motion' and click on the 'Snap' checkbox so that your shape 'snaps' in position over the
'motion guide'. Once the object 'snaps' to the 'motion guide', change the 'Tween:' type
back to 'None'.
17. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.
18. Now that your object is following the motion guide path, you will notice that the object
does not follow the loop portion of the path so we will begin to add some extra keyframes
to guide the object around that portion of the path. To begin, scrub the timeline using
your mouse and the red playhead just above all of the frames in your timeline very slowly

9|Page
until you find the point that the object meets the overlap intersection in the path.
19. Using your mouse, select the second frame after this point of intersection.
20. While still selecting this keyframe, right click your mouse and select the 'Insert Keyframe'
option from the drop down menu.
21.Using your mouse once again, located the frame that occurs two frames before the paths
point of intersection.
22. With this frame still selected, right click with you mouse and once again select the 'Insert
Keyframe' option from the drop down menu.

Now we will adjust these two new keyframes so that there is a larger space between them so
that we can add additional keyframes between them to guide the object around the loop.
23. Click on the first keyframe and drag it two frames before it's original position then click
and drag the second frame so that it is located two frames after it's original position.

We will now begin adding three new keyframes.

24. Select the frame two frames after the first keyframe that we dragged to it's new position.
25. Now select the object on the stage and drag it to the opposite side of the path.
26. Select the frame two frames after the second keyframe that we dragged to it's new
position.
27. Now select the object on the stage and drag it to the opposite side of the path.
28. Our last two keyframes should be separated by three frames at this point which will allow
us to add our last point of reference. Select the middle frame between the last two
keyframes we created and then drag the object on the stage to a curved point of the path
in the loop.
29. It is now time to test your work so press [enter] to test your motion tween in the timeline.
30. If it appears to work and the object moves smoothly over the path press [Control-Enter] to
test your movie in the built-in Flash Player. If it does not, re-adjust the keyframes in your
timeline like you did in Step 23 and move the keyframes so that the objects movement is
to your liking and repeat Step 29. When you are done, press [Control-Enter] to test your
movie in the built-in Flash Player.

Important Notes About Snapping


If, for some reason, your object doesn't want to SNAP to the guide using the 'Snap' option in
the Properties Inspector, you can use the following 'trick'. To do this, begin by selecting
the Free Transform tool in your toolbar. Next select the object you wish to snap. You
should see the anchor points on the end and the transformation point (the little white
circle) in the middle of the object at this point in time. CAREFULLY click on the object
away from any of these points and then drag the object towards the guide path. When

10 | P a g e
the transformation point is centered over the guide path, release your mouse. Your
object should now be associated with the guide path.

If you are still unable to get your object snapped to your guide path, double check your guide
path to make sure it not grouped. If it is, ungroup it [Control-Shift-G] and try associating
your object again.

14. Making Objects Chase Each Other Using A Motion Guide


Hint: You can use this technique to simulate a cat chasing a mouse.

Instructions
To make objects chase each other, you must begin by completing the steps for either 'A Basic
Motion Guide' or 'A Closed Path Motion Guide'. Once you are done, you will need to
complete the following:

1. Begin by renaming the 'motion tween' layer 'mouse'.


2. Copy ALL of the frames in the 'mouse' layer by clicking on the first frame in the layer and
dragging your mouse to highlight the remaining frames in the layer. When all of the
frames have been selected in that layer, right click on the selected frames and select the
'Copy Frames' option from the pop-up menu.
3. Click on the 'mouse' layer and then select the 'Create a new layer' icon to create a new
layer that is associated with the 'Motion Guide' layers. Rename this layer as 'cat'.
4. To creating the 'chasing' effect, shift the position of the object in the first keyframe of the
'cat' layer so that it is slightly behind the object in the first keyframe of the 'mouse' layer.
5. In the second keyframe of the 'cat' layer, repeat the process and once again move the
object so that is slightly behind the object in the 'mouse' layer.
6. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player. If it is not quite perfect, continue to move the objects in the
staring and ending keyframes of the appropriate layer.

15. Making a Fancy Spiraling Motion Guide


Hint: You can use this technique to create a spiral twist.
Instructions
1. Create a new layer on your stage and rename this layer as 'twist'.
2. Select the first frame of this new layer.
3. Drag a copy of the mc_motionGuide movie clip symbol to your stage and create an
instance of it.
4. Create a new keyframe [F6] in frame 30 of the current layer.
5.Select the first keyframe of the 'twist' layer.

11 | P a g e
6. In your properties inspector change the 'Tween:' type from 'None' to 'Motion' and change
the 'Rotate:' option in the lower half of the Property Inspector to either CW or CCW to
create the spinning effect. To make the object spin slowly, choose a low number like 1 for
the number of 'times' for the object to rotate, and increase the number to make to make
the object spin faster but beware that too big of a number may cause unexpected results.
7. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.

16. Cell by Cell Animation

Creating A Simple Cell by Cell Animation


Instructions
1. Label the current layer 'animation 1'.
2. Draw a circle on your stage in frame one of the 'animation 1' layer.
3. Add a new keyframe [F6] in frame 2 of the 'animation 1' layer.
4. Move the circle in Frame 2 to a new location on the stage.
5. Repeat steps 3 and 4 ten times.
6. Press [ENTER] to test your animation.

17. Creating A Complex Cell by Cell Animation of an Envelope Opening


Instructions
1. Create a NEW folder on the stage and label it 'Envelope'.
2. Inside of the 'Envelope' folder, create 2 NEW layers in your cell by cell animation project.
3. Label the bottom layer 'body'.
4. Label the top layer 'flap'.
5. Draw a rectangular shape (not a drawing object) on your stage in frame 1 of the 'body'
layer. Select the line tool and with the magnet turned on, draw two lines to create an X
over the top of the rectangle you just drew.
6. Select the top triangle that you just created when you added the lines to your drawing using
the selection tool and copy it [Control-C].
7. Lock the 'body' layer so that you don't accidentally alter the artwork being stored there.
8. Paste-in-place [Control-Shift-V] the triangle you just copied to your clipboard in frame 1 of
the 'flap' layer.
9. Add a new keyframe [F6] in frame 2 of the 'flap' layer.
10. Add a new keyframe [F6] to frame 2 of the 'body' layer.
11. Resize the triangle in frame 2 of the 'flap' layer using the Transformation tool to give the
appearance that it is "opening" the envelope.
12. Lock and hide the 'flap' layer and unlock the 'body' layer.
12 | P a g e
13. Shade the top triangle in the 'body' layer to give the appearance of shadow.
14. Lock the 'body' layer and unlock and unhide the 'flap' layer.
15. Repeat steps 9 through 14 ten times. During this time, slowly open the envelope until it is
completely open and change the shading until it is a completely different color.
16. Press [ENTER] to test your animation.

Bitmaps

18. Importing A Bitmap to the Library

Instructions
1. We will begin by opening the libary associated with our project file by pressing [Control-L].
The panel that opens should be void of any items at this point in time.
2. To add the bitmap to the library, select File - Import - Import to Library...
3. An Import to Library dialog box should now be open with a list of folders and files from
which you can choose. Locate the file 'Bee-Scene.gif' and import this file.
4. Once the bitmap is imported, you should see a copy of it in your projects library panel with
the name 'Bee-Scene'.
5. To add an instance of this bitmap to your project, click on the bitmap icon affiliated with the
'Bee-Scene' image and drag a copy to the stage.
6. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.

Masking

19. A Basic Mask

Instructions
1. Label the current layer 'bitmap'.
2. Import the image 'Bee-scene.gif' to the library.
3. Place an instance of the 'Bee-scene' library symbol on the stage in the bitmap layer.
4. Lock the 'bitmap' layer so we don't accidentally make any changes to it.
5. Add a new layer above the 'bitmap' layer and save it as 'mask'.
6. Draw a solid shape in the 'mask' layer.
13 | P a g e
7. To convert the 'mask' to a mask layer, right click on the 'motion guide' label and select the
'Mask' option about one half of the way down the pop-up menu. At this point in time you
should see what looks like a teal colored icon appear in the 'mask' layer and also the
'bitmap' layer. You should also notice that both of these layers are locked which is the
only way to view what exactly is to be revealed when working in the Flash Application.
8. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.

20. Masking a Tweened Moving Object

Instructions
Hint: You could use the following technique to view lasers shooting in a video game console
window.

1. Label the current layer 'motion tween'.


2. Place an instance of the 'Bee-scene' library symbol on the stage in the 'motion tween' layer.
3. Add a new keyframe in frame 20 of the 'motion tween' layer.
4. Move the Bee-scene instance in the 'motion tween' layer to a new position on the stage.
5. Select the first keyframe using your mouse.
6. In your properties inspector, change the 'Tween:' type from 'None' to 'Motion'.
7. Lock the 'motion tween' layer so we don't accidentally make any changes to it.
8. Add a new layer above the 'motion tween' layer and save it as 'mask'.
9. Draw a solid shape in the 'mask' layer.
10. To convert the 'mask' to a mask layer, right click on the 'motion guide' label and select the
'Mask' option about one half of the way down the pop-up menu. Once again you should
see what looks like a teal colored icon appear in the 'mask' layer and also the 'motion
tween' layer. You should also notice that both of these layers are locked which is the only
way to view what exactly is to be revealed when working in the Flash Application. One
last thing you should notice is that the new layer matches the length of the 'motion tween'
layer.
11. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.

21. Masking a Guided Moving Object


Hint: You could use the following technique to view space ships heading towards you in a
random path in a video game console window.

1. We will begin by creating a NEW symbol [Control-F8] of type movie clip which we will call
'mc_bee'.

14 | P a g e
2.Rename the layer in the movie clip timeline to be called 'flying bee'.
3.Place an instance of the 'Bee-scene' symbol in the first keyframe of the 'flying bee' layer.
4.Click on the 'Add Motion Guide' icon in the Timeline panel to produce a new guide layer.
5. Using the pencil or brush tool, draw a curvy path on your stage that your shape will
eventually follow.
6. Select the 'flying bee' layer.
7.Add a new keyframe [F6] in frame 30 of the 'flying bee' layer.
8. In the second keyframe in the 'shape' layer, move your shape to the end of the guide layer
path.
9.Select the first keyframe in the 'flying bee'
10. Move your shape to the beginning of the guide layer path.
11. In your properties inspector, change the 'Tween:' type from 'None' to 'Motion' and click on
the 'snap' option in the lower portion of the panel. Your shape in the first keyframe should
have snapped itself to the potion of the guide in the guide layer. If the shape is not where
you want it, move it to the starting point of your guide.
12. Press [enter] to test your motion tween in the timeline. If you are satisfied with it, then
click on the 'Scene 1' button in the Edit Bar and return to the main timeline of your movie.
13. Label the layer that appears in your main timeline 'flying bee path'.
14 Place an instance of the 'mc_bee' library symbol on the stage in the 'flying bee path' layer.
15. Lock the 'flying bee path' layer so we don't accidentally make any changes to it.
16. Add a new layer above the 'flying bee layer' layer and save it as 'mask'.
17. Draw a solid shape in the 'mask' layer.
18. To convert the 'mask' to a mask layer, right click on the 'motion guide' label and select the
'Mask' option which is about one half of the way down the pop-up menu. Once again you
should see what looks like a teal colored icon appear in the 'mask' layer and also the
'motion tween' layer. You should also notice that both of these layers are locked which is
the only way to view what exactly is to be revealed when working in the Flash Application.
19. Press [enter] to test your motion tween in the timeline or [Control-Enter] to test your movie
in the built-in Flash Player.

15 | P a g e

Anda mungkin juga menyukai