Flash Tutorial 4: Movie Clips and Imported Graphics

In this tutorial I will be talking about movie clips and some cool things you can do with them. I will also be talking about imported graphics and their advantages.

MOVIE CLIPS

1. Open up a new flash document.
2. Draw a square anywhere on the stage.
3. Select the box with the selection tool (Hotkey V), go up and look at the toolbar (Where file, edit and all those other options are) and select "Modify" then "Convert to Symbol".
4. Name it box and select "Movie Clip" if it isn't already selected, it should look like this:
5. Click OK.
6. Now you have a movie clip! To edit this movie clip, double click it on the stage OR double click on it in the library. The library looks like this:
7. Once you double clicked on it, you're inside the movie clip; here you can edit the movie clip. NOTE: Any changes you do inside the movie clip will change all other instances of this movie clip (I will explain more later).
8. Now, in this movie clip create a key frame in frame 10 and another key frame in frame 20. It should look something like this:
9. Note the "Scene 1, Box":
This displays your current location; you are in Scene 1, in the "box" movie clip.
10. In keyframe number 10, change the color of the box to green.
11. Create a shape tween with the 1st and 2nd keyframe and another with the 2nd and the 3rd, if you don't know how to make a shape tween, refer to "Flash tutorial 2: Shape tweens"
12. Your timeline should look something like this:
13. We want to get out of the movie clip and back onto the stage, to do this we click on the "Scene 1" at the timeline and we will go to that location:
14. Test your movie by pressing Control + Enter/return. You will see your shape tweens that you created in the movie clip.
15. Here comes the big advantage of movie clips. Delete the instance of the movie clip on the stage. (Don't delete it from the library).
16. Your stage should look like this:
17. Now, click and drag from the library the box movie clip.
18. The box is now back. Drag 2 more boxes from the library to the stage. (Doesn't matter where you put them).
19. Your stage should like this:
20. Test your movie; you will see that ALL 3 of the boxes have the same shape tween<./li>
21. Back to the stage, double click on the movie clip in the library OR any instance of the movie clip on stage (Doesn't really matter, they will give the same result). An instance is like a projection, the movie clip in the library is the projector and they are both the same.
22. Once inside the movie clip, in frame 10 where the box is green, change it to red. It should look something like this:
23. Now, return to scene 1 and test your movie. You will discover that all 3 shape tweens will turn the box red.
24. This is the advantage of movie clips, when doing a large scale project; you can easily upgrade the graphics by modifying one symbol.

Note: All changes made to movie clips while INSIDE them will change ALL instances of that movie clip in the flash document. However, all changes made outside of the movie clip, such as resizing it using the transformation tool or applying filters (I will explain that later) will only change that ONE instance IF you edit it outside of the movie clip.

GRAPHICS

1. Open up a flash document
2. Go to "File", "Import" and then select "Import to library":
3. In this example, I will be using a "Windows Vista" wallpaper, which I have named example.jpg.
4. Find a picture that Flash can support, select it and then click "Open" to import it.
5. The imported picture will go into the library:
6. Imported graphics cannot be edited; however they can be updated by double clicking on the symbol in the library and clicking update.
7. Click and drag the graphic from the library to the stage as you would do with a movie clip.
8. Select the brush tool and scribble over the instance of the graphic.
9. Something like this will happen:
10. As you can see, imported graphics cannot be edited in flash.
11. Delete the graphic from the stage.
12. Draw a box on the stage anywhere using the rectangle tool.
13. Select the brush tool (Hotkey B).
14. Choose a different color for the brush than the color of the box.
15. Scribble all over the box using the brush tool.
16. Now select the selection tool (Hotkey V) and click on the BRUSH stroke./li>
17. Drag it away from the box and place it anywhere else.
18. It should look something like this now:
19. Now you see why imported graphics are good. Imported graphics cannot be edited within flash, BUT they can be edited if you use another program like PhotoShop and edit the .jpg picture and update it in flash.

Congratulations, you have now made a movie clip and gained knowledge of imported graphics.