Web Development & Design Foundations with HTML5

Skip to Content 8th Edition

Adobe Flash CS5 Tutorial: Creating an Animated Banner Page 2

To create a new Flash movie, select File > New. The New Document dialog box will display. Select "Flash File (ActionScript 3.0)" and click OK.

Flash is now ready for you to create your new document. Your display should be similar to the one below. (Click the image below to see a larger version).

The New Document

Take a minute to familiarize yourself with it.

  • The "Untitled-1*" in the Title Bar is the name of the file at this point. (Don't worry if your file has a different number after "Untitled-" than 1.)
  • Notice that there are a number of panels and menus. You will work with some of them in this tutorial.
  • View the lower center area of the Flash window and note the "Timeline". This is used to configure animations frame by frame as well as configuring layers and adding animation effects.
  • The white rectange is called the Stage. This is a very important area. The Stage is your Flash animation. The dimensions of the Stage are the dimensions of your Flash animation.

Setting the Size of the Stage

The IAB publishes voluntary guidelines for banner and ad sizes. In this tutorial you will create a banner with the dimensions 468x60. To set the Stage to these dimensions, select Modify > Document to display the Document Properties dialog box shown below.

Document Settings dialog box

Configure the Dimensions text boxes as shown above. Notice that the Background color is set to white but could be changed in this dialog box. Set the Frame rate to 12. Click OK.

The Flash window should display as shown below (click on the image to view a larger screenshot). You may need to use the scroll bars around the Stage area to display your banner rectangle.

The stage is configured for the banner

Save the File

It's a good idea to save your file often when using Flash. Select File > Save. The Save As dialog box opens. Create a new folder called FlashBanner and save the file with the name "banner.fla". The file extension, ".fla" (usually pronounced "flah") is used for Flash movie source files. The title bar in the Flash window should now display "banner.fla".

Continue with the next page to become more familiar with the panels used in Flash.

Page 3Next Page