Accessibility
Adobe
Sign in Privacy My Adobe

Using Flash for the first time – Part 1: Building a banner


Table of Contents

Changing document properties

At this point, you're looking at a blank canvas surrounded by many controls (see Figure 2). The large white square is called the Stage, and it's where you place assets you want to display in the SWF file, such as images, buttons, text, or animations. The Stage and panels are commonly called the Flash workspace or authoring environment.

The Stage

(+) view larger
Figure 2: The Flash authoring environment includes a Stage where you can place and manipulate assets.

Around the Stage you see a variety of panels. The panel on the left is called the Tools panel (see Figure 3), and is either arranged in a single column or double column.

Tip: Click the double arrow at the top of the panel to toggle the Tools panel between a single column and a double column.

This panel includes tools you can use to create and modify documents, such as tools you use to draw and make selections.

the Selection tool

Figure 3: Use the Tools panel to draw and make selections. You use the Selection tool (the black arrow) to make selections in these tutorials.

A panel near the bottom of the Flash application is titled Properties (choose Window > Properties > Properties if you don't see the panel). This panel is called the Property inspector (see Figure 4), and enables you to change various properties of whatever is currently selected in your document (such as an image or a frame) or set properties for the entire SWF file (such as the frame rate or dimensions). If you don't have any objects or frames selected, the Property inspector enables you to modify properties for the document itself.

  1. Open the Property inspector (choose Window > Properties > Properties) and click the button next to the word Size to open the Document Properties dialog box.

    Note: Make sure you don't have a frame selected. Click the Stage if you don't see this button.

    the Document Properties dialog box

    Figure 4: Click this button in the Property inspector to open the Document Properties dialog box. You can then change the size and color of the Stage.

    The button displays the current dimensions of the FLA file. By default, the Stage size in a new Flash document is 550 pixels wide by 400 pixels high. When you click this button, you open the Document Properties dialog where you can change several document-wide properties (such as the Stage dimensions, color, and document frame rate).

  2. In the Document Properties dialog box, type 160 into the Width text box and 600 into the Height text box.

    When you type new values into these text boxes, you resize the dimensions of your FLA document. There is a reason that you need to use these specific dimensions. Because you're creating a banner, you should use a standard banner size. In this tutorial, you're creating a “wide skyscraper.” For a list of standardized banner sizes, check out the Interactive Advertising Bureau's page on Ad Unit Guidelines.

    Tip: You can also create banners from an Adobe template by choosing File > New from the main menu. Select the Templates button and choose the Advertising category to view the available templates.

  3. Click OK when you finish entering new dimensions in the Document Properties dialog box to return to the authoring environment.

    When you return to the authoring environment, notice how the dimensions of your document change. You can also change the current document's background color and frame rate in the Property inspector, without going to the Document Properties dialog box. You'll find information about frame rate in Part 2 of this tutorial.

Remember to save your work (File > Save) before you continue.