Web Development & Design Foundations with HTML5

Skip to Content 9th Edition

Adobe Flash CS5 Tutorial: Creating an Animated Banner Page 3

Tools Panel

Flash Tools Panel

Notice the Tools Panel in your Flash application. The currently selected tool is the "Selection Tool" — the standard cursor pointer. Place your mouse over the other tool icons for a brief description of each.

You will be using the "Text Tool" icon on the Tools Panel during this tutorial. Take a moment and find it. (Hint: Look for the letter T" in the Vector area on the Tools Panel.)

It is handy to know how to undo an action when using Fireworks just in case you make a mistake. You can quickly undo you most recent action — Windows users press the Ctrl and Z keys at the same time; Mac users press the Command ⌘ and Z keys at the same time. There also is an Undo option located under the Edit Option on the Main Tool Bar.

Flash Timeline

Take a look at the Timeline which is located below the Stage.


As you can see, there are many features on the Timeline. A few of the most commonly used features are discussed below.

The left side of the Timeline (see Layer 1) is where you place your layers. Typically each layer holds one object in a Flash movie. You will be creating several layers to create the animated banner. It is good practice to assign each layer a meaningful name.

The "eye" icon can be used to make layers visible or invisble while you are working. Sometimes this is helpful as you are working on animations.

The "lock" icon is used to temporarily freeze or lock layers you do not wish to accidentally change while you are working.


Each rectangle represents a frameThe area at the left side of the Timeline shows the frames in the animation. This area is used to configure keyframes which indicate where the animation changes. The Timeline can also be used to automatically create tweens (more on this later). The transparent red rectangle indicates the frame that is currently displayed on the Stage.

New Layer

The New Layer icon in the lower left corner is used to add a new layer to the Timeline.



Continue to actually create the animated banner.

Page 4Next Page