Monday, November 14, 2011

PART 1 - What is a symbol? - Introduction to Flash Symbols

This article comes with exercise files. Click on the link below to download:
[GO TO EXERCISE FILES DOWNLOAD PAGE]

In this tutorial series, we're going to learn about Flash symbols.

What is a Flash symbol?

In Flash, a symbol is a reusable object that is stored inside a Flash document's library. For example, you can draw a shape and then convert it into a symbol. Once converted, it gets stored in the Flash document's library. Then from the library, you can easily make multiple copies of the symbol without having to recreate it. You can turn anything that you draw into symbols. You can also import graphics from other sources and turn those into symbols as well.

Let's learn more about symbols by working on an existing example. In this first part, we'll take a look at a symbol that's already been created for you.

Step 1

Open up the intro-to-symbols.fla file. When the file launches, you won't see the symbol yet. Just move on to step 2.

Step 2

Switch to the Small Screen workspace so that your layout becomes similar to the layout in the screenshots in this tutorial. This will help you follow along more easily.

To switch to the layout, go to Window > Workspace > Small Screen.

Then go to Window > Workspace > Reset 'Small Screen'.

Step 3

Open up the library by clicking on the library panel icon.


This will bring up the Flash document's library. Inside it is a symbol named Car. Click on the name in order to see the symbol in the library's preview window (the preview window is that white area below the Library tab, and it's where you'll be able to preview what the symbol looks like). DO NOT DOUBLE-CLICK ON IT. JUST CLICK ON IT ONCE IN ORDER TO SELECT IT.


This symbol was created from artwork that was drawn on the stage using the drawing tools. The artwork was then converted into a symbol and it was given the name Car.

Step 4

To use the symbol, click and drag it from the library down to the stage.


Once you release the mouse, you should see the car on the stage.

This car that you see on the stage is simply a copy of the symbol from the library. It is referred to as an instance of the symbol. If the instances on the stage are copies, then you can think of the symbol in the library as the master copy. So if you delete the master copy in the library, then all the instances will disappear. However, if you delete an instance on the stage, the master copy in the library remains.

Step 5

You can add multiple instances of one symbol onto the stage. This is what it means when we say that symbols are reusable. You only need to draw them once, and then you can add them to your Flash movie as many times as needed.

To add more instances of the Car symbol, just click and drag more instances from the library onto the stage. Let's add two more instances.


This is one of the main benefits of working with symbols - you only need to create it once, but you can reuse it multiple times, so you end up saving time. Using symbols also helps save file space since multiple instances only come from a single copy. If, instead of using symbol instances, you decided to redraw the car three times, you would actually end up with a SWF file that has a larger file size.


And that concludes the first part of this tutorial series. In the next part, we'll learn about the symbol's timeline. Each symbol that you make has it's own timeline where you can also add layers and frames. We'll take a look at how to access that timeline in the next part.

Featured Flash Professional Training Courses

For more Flash Professional training, I recommend these excellent online training courses listed below. Click on the links to find out more information about each course. Each course details page has free videos that you can view immediately. Just click on the free video links (the blue ones) under the table of contents. And as a special promotion, you can get full access to all of the videos in all of these courses by signing up for a free 10-day trial. This trial pass will give you full access to all of the courses from lynda.com

No comments:

Post a Comment