Macromedia Flash - 8 User Manual

Flash Tutorials

Trademarks

1 Step RoboPDF, ActiveEdit, ActiveTest, Authorware, Blue Sky Software, Blue Sky, Breeze, Breezo, Captivate, Central, ColdFusion, Contribute, Database Explorer, Director, Dreamweaver, Fireworks, Flash, FlashCast, FlashHelp, Flash Lite, FlashPaper, Flash Video Encoder, Flex, Flex Builder, Fontographer, FreeHand, Generator, HomeSite, JRun, MacRecorder, Macromedia, MXML, RoboEngine, RoboHelp, RoboInfo, RoboPDF, Roundtrip, Roundtrip HTML, Shockwave, SoundEdit, Studio MX, UltraDev, and WebHelp are either registered trademarks or trademarks of Macromedia, Inc. and may be registered in the United States or in other jurisdictions including internationally. Other product names, logos, designs, titles, words, or phrases mentioned within this publication may be trademarks, service marks, or trade names of Macromedia, Inc. or other entities and may be registered in certain jurisdictions including internationally.

Third-Party Information

This guide contains links to third-party websites that are not under the control of Macromedia, and Macromedia is not responsible for the content on any linked site. If you access a third-party website mentioned in this guide, then you do so at your own risk. Macromedia provides these links only as a convenience, and the inclusion of the link does not imply that Macromedia endorses or accepts any responsibility for the content on those third-party sites.

Speech compression and decompression technology licensed from Nellymoser, Inc. (www.nellymoser.com).

Sorenson™ Spark™ video compression and decompression technology licensed from Sorenson Media, Inc.

Visual SourceSafe is a registered trademark or trademark of Microsoft Corporation in the United States and/or other countries.

Copyright © 2005 Macromedia, Inc. All rights reserved. This manual may not be copied, photocopied, reproduced, translated, or converted to any electronic or machine-readable form in whole or in part without written approval from Macromedia, Inc. Notwithstanding the foregoing, the owner or authorized user of a valid copy of the software with which this manual was provided may print out one copy of this manual from an electronic version of this manual for the sole purpose of such owner or authorized user learning to use such software, provided that no part of this manual may be printed out, reproduced, distributed, resold, or transmitted for any other purposes, including, without limitation, commercial purposes, such as selling copies of this documentation or providing paid-for support services.

Acknowledgments

Project Management: Sheila McGinn

Writing: Jay Armstrong, Jen deHaan

Managing Editor: Rosana Francescato

Lead Editor: Lisa Stanziano

Editing: Evelyn Eldridge, Mark Nigara, Lisa Stanziano, Anne Szabla

Production Management: Patrice O’Neill, Kristin Conradi, Yuko Yagi

Media Design and Production: Adam Barnett, Aaron Begley, Paul Benkman. John Francis, Geeta Karmarkar, Masayo Noda, Paul Rangel, Arena Reed, Mario Reynoso

Special thanks to Jody Bleyle, Mary Burger, Lisa Friendly, Stephanie Gowin, Bonnie Loo, Mary Ann Walsh, Erick Vera, the beta testers, and the entire Flash and Flash Player engineering and QA teams.

First Edition: September 2005

Macromedia, Inc. 601 Townsend St.

San Francisco, CA 94103

Chapter 1: Basic Tasks: Create a Document . . . . . . . . . . . . . . . . . 13

Take a tour of the user interface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14

Change background and Stage size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17

Change your view of the Stage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

View the Library panel. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

Add graphics to the Stage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

Add video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

View object properties. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

Add video control behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

Use the Movie Explorer to view the document structure . . . . . . . . . . . 22

Test the document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

Find help. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

Chapter 2: Basic Tasks: Creating a banner, Part 1 . . . . . . . . . . . 25

Examine the completed FLA file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .27

Creating a new document. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29

Changing document properties. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30

Importing graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33

Introducing layers and the timeline . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36

Test the application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41

Chapter 3: Basic Tasks: Creating a banner, Part 2 . . . . . . . . . . 43

Examine the completed FLA file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44

Adding text. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46

Creating a symbol. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49

Adding animation to a timeline . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51

Creating a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56

Writing simple actions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59

Test the application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 61

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62

Chapter 4: Basic Tasks: Creating a banner, Part 3 . . . . . . . . . . .63

Examine the completed FLA file . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64

Considering your audience . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67

Checking your publish settings. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68

Inserting Flash on a Dreamweaver site. . . . . . . . . . . . . . . . . . . . . . . . . . . .71

Using roundtrip editing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73

Checking for Flash Player . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 74

Test the application. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77

Chapter 5: Basic Tasks: Create Accessible Flash Content . . . . . 79

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .80

Make your document accessible to screen readers. . . . . . . . . . . . . . . . 81

Provide a document title and description. . . . . . . . . . . . . . . . . . . . . . . . . 81

Provide a title and description for instances . . . . . . . . . . . . . . . . . . . . . . 82

Specify that screen readers ignore elements in your document. . . . . 83

Change static text to dynamic text for accessibility . . . . . . . . . . . . . . . . 83

Control the tab order and reading order . . . . . . . . . . . . . . . . . . . . . . . . . . 84

About testing your document with screen readers. . . . . . . . . . . . . . . . . 87

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87

Chapter 6: Basic Tasks: Work with Layers . . . . . . . . . . . . . . . . . .89

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .90

Select a layer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91

Hide and show layers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92

Lock a layer. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92

Add and name a layer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

Change the order of layers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

Organize layers in a folder . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94

Add a mask layer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94

Add a guide layer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95

Delete a layer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96

Chapter 7: Basic Tasks: Create an Application. . . . . . . . . . . . . . . 97

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98

Copy input and dynamic text fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .99

Name text fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99

Add and name a Button component . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100

Declare variables and values for the prices . . . . . . . . . . . . . . . . . . . . . . .101

Specify values for input text fields . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102

4Contents

Write a function. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .103

Write an event handler for the component . . . . . . . . . . . . . . . . . . . . . . .104

Test your application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .105

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .105

Chapter 8: Basic Tasks: Use Layout Tools . . . . . . . . . . . . . . . . . 107

Set up your workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .108

Use guides to align an object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .108

Change the Stage size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .109

Resize objects to match the Stage size. . . . . . . . . . . . . . . . . . . . . . . . . . 110

Specify snap alignment settings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .111

Align an object using the alignment guides . . . . . . . . . . . . . . . . . . . . . . .111

Align objects using the Align panel. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112

Snap objects to each other . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 113

Align objects using the Property inspector . . . . . . . . . . . . . . . . . . . . . . . 114

Align objects using the grid and arrow keys . . . . . . . . . . . . . . . . . . . . . . 115

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115

Chapter 9: Basic Tasks: Create Symbols and Instances . . . . . . 117

Set up your workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118

About creating symbols . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118

Create a graphic symbol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119

Duplicate and modify an instance of a symbol. . . . . . . . . . . . . . . . . . . .120

Modify a symbol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121

Create a movie clip symbol. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .122

Assign an instance name to the movie clip. . . . . . . . . . . . . . . . . . . . . . .122

Add an effect to the movie clip . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .123

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .123

Chapter 10: Basic Tasks: Add Button Animation

and Navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 125

Set up your workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .126

Create a button from grouped objects. . . . . . . . . . . . . . . . . . . . . . . . . . . 127

Name a button instance . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .127

View the hit area by enabling buttons . . . . . . . . . . . . . . . . . . . . . . . . . . .128

Change the hit area of a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .128

Align buttons . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .129

Create animation for a button state . . . . . . . . . . . . . . . . . . . . . . . . . . . . .130

Add an action to a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 131

Add navigation to a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .132

Test the SWF file . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .133

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .133

Contents 5

Chapter 11: Basic Tasks: Create a Presentation with Screens

(Flash Professional Only) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 136

View the screen hierarchy and screen Timelines . . . . . . . . . . . . . . . . . 137

View screen properties. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 138

Add content to a presentation slide. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 139

Add screen navigation behaviors to buttons . . . . . . . . . . . . . . . . . . . . . 140

Add and name a slide . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .141

Select and move slides. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .141

Add content to a new slide . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142

Add transition behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142

Test your presentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 143

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 143

Chapter 12: Creating Graphics: Draw in Flash . . . . . . . . . . . . . . 145

Select a shape tool . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146

Select options to create a polygon . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147

Draw a polygon . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 147

Rotate the shape . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 148

Use the cutout feature . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 148

Transform the shape of your drawing . . . . . . . . . . . . . . . . . . . . . . . . . . . 149

Copy strokes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 149

Draw with the Line tool. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150

Select and add a different fill color . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150

Group the shape . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .151

Create a logo with the Pen tool. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .151

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152

Chapter 13: Creating Graphics: Create a Timeline Animation . . 153

Create a motion tween . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155

Create a shape tween . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 156

Copy and paste keyframes in an animation . . . . . . . . . . . . . . . . . . . . . . 157

Change the speed of the animation. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 158

Test the SWF file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160

Chapter 14: Creating Graphics: Making Animations

with Easing (Flash Professional only) . . . . . . . . . . . . . . . . . . . . . . 161

Examine the completed FLA file . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163

Open the starter document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165

Test the application. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 176

6Contents

Chapter 15: Creating Graphics: Applying Gradients . . . . . . . . . . 177

Examine the completed FLA file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .179

Open the starter document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181

Apply a linear gradient. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 181

Create a radial gradient . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .183

Create a transform gradient with a shape . . . . . . . . . . . . . . . . . . . . . . . .186

Apply the finishing touches . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187

Test the application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 191

Chapter 16: Creating Graphics: Apply Graphic Filters

and Blends (Flash Professional Only) . . . . . . . . . . . . . . . . . . . . . . 193

Review your task. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .194

Open the starter document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195

Apply filters and blends. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195

Chapter 17: Text: Add Text to a Document . . . . . . . . . . . . . . . . . 199

Set up your workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 200

Create an expanding-width text block . . . . . . . . . . . . . . . . . . . . . . . . . . .201

Create a fixed-width text block . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202

Edit text and change font attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202

Select device fonts. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 203

Add an input text field . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 203

Copy a text field . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204

Assign instance names to text fields . . . . . . . . . . . . . . . . . . . . . . . . . . . 205

Create a dynamic text field . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205

Specify format options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 206

View ActionScript for the dynamic text field . . . . . . . . . . . . . . . . . . . . 207

Test the SWF file . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 207

Check spelling. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208

Chapter 18: ActionScript: Use Script Assist mode . . . . . . . . . . 209

Examine the completed FLA file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 211

Open the starter document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .213

Add a script to a button by using Script Assist mode. . . . . . . . . . . . . .213

Add frame scripts to the Timeline by using Script Assist mode . . . . . 218

Add a frame script to the Title movie clip . . . . . . . . . . . . . . . . . . . . . . . .221

Test the application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 223

Contents 7

Chapter 19: ActionScript: Write Scripts . . . . . . . . . . . . . . . . . . 225

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .226

Create an instance of a symbol. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .226

Name button instances . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .228

Initialize the document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .228

Apply ActionScript syntax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .229

Locate ActionScript reference documentation . . . . . . . . . . . . . . . . . 230

Add comments to ActionScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 230

Write a function for a button . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 231

Copy and modify a button function . . . . . . . . . . . . . . . . . . . . . . . . . . . . .232

Check syntax and test your application . . . . . . . . . . . . . . . . . . . . . . . . .233

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .234

Chapter 20: ActionScript: Add Interactivity . . . . . . . . . . . . . . . 235

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .236

Name button instances . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237

Add a scene . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .237

Move between scenes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .238

Control the document with a stop() action. . . . . . . . . . . . . . . . . . . . . . .238

Link a button to a scene. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .239

Add navigation to return to Scene 1. . . . . . . . . . . . . . . . . . . . . . . . . . . . .239

Play a movie clip . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 240

Use a behavior to play an MP3 file . . . . . . . . . . . . . . . . . . . . . . . . . . . . .243

Test your document . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .243

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 244

Chapter 21: ActionScript: Create a Form with

Conditional Logic and Send Data . . . . . . . . . . . . . . . . . . . . . . . . 245

Set up your workspace. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .246

Add an input text field to collect form data . . . . . . . . . . . . . . . . . . . . . .246

Add a Submit button to the form . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .247

Add an error message . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .248

Add a confirmation message . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249

Add a stop() action . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249

Add frame labels for navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250

Add conditional logic for the Submit button . . . . . . . . . . . . . . . . . . . . . 251

Pass data out of a SWF file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .252

Write a function for the Try Again button . . . . . . . . . . . . . . . . . . . . . . . .253

Test your SWF file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .253

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 254

8Contents

Chapter 22: ActionScript: Work with Objects and Classes . . 255

Set up your workspace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 256

Learn about classes and object types . . . . . . . . . . . . . . . . . . . . . . . . . . 256

Create an object from a class. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 257

Create a custom class . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 259

Create two objects from the Product class. . . . . . . . . . . . . . . . . . . . . . 262

Learn about extending existing classes. . . . . . . . . . . . . . . . . . . . . . . . . 263

Extend the MovieClip class to create a new class. . . . . . . . . . . . . . . . 264

Summary . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 266

Chapter 23: Data Integration: Overview (Flash

Professional Only) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 267

Chapter 24: Data Integration: Using the Macromedia

Tips Web Service (Flash Professional Only) . . . . . . . . . . . . . . . 269

Connect to a public web service . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270

Create a user interface and bind the components with

the web service . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 272

Chapter 25: Data Integration: Using XML for a Timesheet

(Flash Professional Only) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 277

Create the user interface. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 278

Edit the data. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 286

Chapter 26: Data Integration: Using XUpdate to Update

the Timesheet (Flash Professional Only) . . . . . . . . . . . . . . . . . . 287

Update the timesheet . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 288

Contents 9

10 Contents

Introduction

This part of Flash Help includes several step-by-step tutorials, designed to teach you the fundamentals of Flash. Macromedia recommends that you go through the lessons using the sample files provided. The path to the sample file is provided in each lesson.

By completing these hands-on lessons, you’ll learn how to use Flash to add text, graphics, and animation to your Flash applications. Additionally, you’ll learn how easy it is to customize your Flash application by using ActionsScript and behaviors.

The lessons are targeted toward beginners to intermediate-level Flash designers and developers who want to get up to speed quickly.

Each lesson focuses on a specific Flash design feature or topic and takes approximately 10–20 minutes to complete, depending on your experience. In these lessons, you learn how to create a Flash document, write ActionScript, work with video and video control behaviors, and add a Flash component.

NOTE

This book is not a comprehensive manual detailing all the features of Macromedia Flash. For in-depth information about using Flash, from within the Flash application, select Flash Help (Help > Flash Help).

12 Introduction

CHAPTER 1

Basic Tasks: Create a Document

You’re about to experience the power of Macromedia Flash Basic 8 and Macromedia Flash Professional 8. You’ll see how, in a few minutes, you can create a compelling web experience that combines video, text, graphics, and media control behaviors.

You can print this tutorial by downloading a PDF version of it from the Macromedia Flash Documentation page at www.macromedia.com/go/

fl_documentation.

In this tutorial, you will complete the following tasks:

Take a tour of the user interface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14

Select panel sets and arrange panels . . . . . . . . . . . . . . . . . . . . . . . . 15

Change background and Stage size . . . . . . . . . . . . . . . . . . . . . . . . . .17

Change your view of the Stage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

View the Library panel. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18

Add graphics to the Stage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

Add video. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19

View object properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .20

Add video control behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .20

Use the Movie Explorer to view the document structure. . . . . . . . 22

Test the document. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .23

Find help . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23

Before taking this lesson, we recommend that you read Getting Started with Flash, to learn about the Flash workspace. To access this guide, select

Help > Getting Started with Flash.

Take a tour of the user interface

First, you’ll open the starting FLA file that you’ll use to complete this lesson. Each lesson includes one start file, and a finished file that demonstrates how the FLA file should appear upon completion of the lessons.

1. To open your start file, in Flash select File > Open and navigate to

the file:

■ In Windows, browse to boot drive\Program Files\Macromedia\Flash

8\Samples and Tutorials\Tutorial Assets\Basic Tasks\Create a Document and double-click document_start.fla.

■ On the Macintosh, browse to Macintosh HD/Applications/

Macromedia Flash 8/Samples and Tutorials/Tutorial Assets/Basic Tasks/Create a Document and double-click document_start.fla.

NOTE

The Create a Document folder contains completed versions of the tutorial FLA files for your reference.

The document opens in the Flash authoring environment. The document already includes two layers in the Timeline. To learn more about layers, select Help > Flash Tutorials > Basic Flash > Work with Layers.

One of the layers is named Guides, which contains items to assist you in placing objects correctly on the Stage. The other layer is named Content. This is the layer in which to place the objects that will compose your document.

2. Select File > Save As and save the document with a new name, in the

same folder, to preserve the original start file.

As you complete this lesson, remember to save your work frequently.

14 Basic Tasks: Create a Document

Select panel sets and arrange panels

The Default Workspace Layout panel set arranges your workspace in a way that facilitates taking lessons. You’ll use this layout for all lessons that you take in Flash.

■ Select Window > Workspace Layout > Default.

You can move panels around, and resize them, as follows:

■ You can undock a panel by clicking the upper-left corner of the

panel, in the title bar, and dragging the panel to another location in the workspace.

If the panel snaps against a border, it is docked in a new location (or docked in the same location, if you moved it back). Otherwise, the panel is undocked.

■ You can resize an undocked panel by dragging the lower-right edge

out to enlarge the panel.

Use tools to create Flash content

The white rectangular Stage area is where you can arrange objects as you want them to appear in your published file.

NOTE

You can open several documents at once and use document tabs, above the Stage, to navigate between them.

The Tools panel, next to the Stage, offers a variety of controls that let you create text and vector art. To learn more about tools in the Tools panel, select Help > Flash Tutorials > Creating Graphics: Draw in Flash and Help > Flash Tutorials > Text: Add Text to a Document.

1. Click the Pencil tool in the Tools panel. Click the Stroke color box in

the Tools panel colors area, and select any color except white.

2. Drag around the Stage, without releasing the mouse, to draw a line.

You’ve created Flash content. Your finished document will be much more impressive.

Take a tour of the user interface 15

Undo changes

Flash can undo a series of changes to your document. You’ll undo the artwork that you just created.

1. To see the undo feature in action, first open the History panel

(Window > Other Panels > History).

The Pencil tool appears in the panel, because using the tool was your last action.

2. Do one of the following:

■ Select Edit > Undo Pencil Tool.

■ Press Control+Z (Windows) or Command+Z (Macintosh).

Your scribbles disappear from the Stage. The History panel now shows a dimmed Pencil tool, which indicates the undo action was executed.

Flash, by default, is set to undo 100 of your changes, in reverse order of execution. You can change the default setting in Preferences. To change your preferences, see “Setting preferences in Flash” in Getting Started with Flash.

3. To close the History panel, click the pop-up menu in the upper-right

corner of the panel and select Close Panel.

View the Timeline

16 Basic Tasks: Create a Document

Just above the Stage, you see the Timeline and layers. You can create and name layers, and then add content to frames on layers to organize how your Flash content plays as the playhead moves across the frames.

■ Move the mouse pointer over the area that separates the Stage from the

Timeline. When the resizing handle appears, drag up or down slightly to resize the Timeline as necessary.

Playhead

Keyframe

Resizing handle

The playhead (the red indicator line) is on Frame 1 in the Timeline. The keyframes are designated by small circles in the frames, which are filled, indicating there’s content in those frames. You can add a keyframe to a document when you want the Flash content to change in some way in that frame.

Change background and Stage size

The Stage provides a preview of how your Flash content will appear in your published file. You’ll change the size of the Stage to accommodate artwork designed for a larger Stage, and you’ll change the background color of the Stage.

1. In the Tools panel, click the Selection tool.

2. On the Stage, click anywhere in the gray workspace that surrounds the

Stage, or on the background area of the Stage, so that no objects are selected.

The Property inspector, under the Stage, displays properties for the document when no objects are selected.

3. To change the Stage background color, click the Background color box

and select a light shade of gray, such as gray with the hexadecimal value of #CCCCCC.

4. To change the Stage size, click Size in the Property inspector. In the

Document Properties dialog box, enter 750 for the Stage width, and then click OK.

The Stage resizes to 750 pixels wide.

Change background and Stage size 17

Change your view of the Stage

You can change your view of the Stage without affecting the actual Stage size of your document.

1. In the Stage View text box, above the right side of the Stage, enter

500%. Then press Enter (Windows) or Return (Macintosh).

Your view of the Stage enlarges to 500%.

2. In the Stage View pop-up menu, which you access by clicking the

control to the right of the text box, select 100% to view the Stage in dimensions that correspond to the size of the published Flash content.

View the Library panel

Flash content that you import or that is a symbol is stored in your Library panel. To learn more about symbols and instances, select Help > Flash Tutorials > Basic Tasks: Create Symbols and Instances.

■ To view the Library panel, select Window > Library.

We’ve already imported library items and created symbols for objects that you’ll use in this lesson.

NOTE

Flash also contains a library of buttons that you can use in your document. To view this library, after taking this lesson, select Window > Common Libraries and select the Buttons library.

18 Basic Tasks: Create a Document

Add graphics to the Stage

To add library items to your document, you verify that you’re adding the object to the correct layer, and then drag the item from the Library panel to the Stage.

1. In the Timeline, click the Content layer name to select that layer. With

the Selection tool selected, drag the Title movie clip, which contains a bitmap image and vector graphic, from the Library panel to the Stage and align it on top of the gray bar at the top of the Stage that contains the word Title.

In Flash, you can work with bitmap images, which describe graphics using pixels, and vector art, which uses mathematical representation to describe art. For more information, see “About vector and bitmap

graphics” in Using Flash.

2. With the Content layer still selected, drag the text symbol from the

Library panel to Stage, and align it with the Trio ZX2004 text that’s already in place as a guide. You can use your keyboard arrow keys to nudge the text into place.

The title text is actually a graphic created from text.

Add video

The Library panel includes an imported Flash video file (FLV). You’ll add the video to your document, and Flash will add the necessary frames to play the video.

To learn more about using video in Flash, see “Working with Video” in Using Flash.

1. Verify that the Content layer is still selected in the Timeline. From the

Library panel, drag the ggb_movie_for_trio_new video to the dark gray Video guide on the Stage.

2. A dialog box appears that indicates Flash will add 138 frames to the

Timeline for the video. Click Yes.

3. Drag the playhead across the Timeline to view the video.

Add video 19

View object properties

When you add an object to the Stage, you can select it, and then view and change its properties in the Property inspector. The type of object selected determines which properties appear. For example, if you select a text object (not a text graphic, which you use in this lesson), the Property inspector displays settings such as font, type size, and paragraph formatting, which you can either view or change. If no object is selected, the Property inspector displays properties for the entire document.

1. On the Stage, with the Selection tool selected, click the Title graphic.

The Property inspector (Window > Properties > Properties) shows specifications, such as height, width, and Stage coordinates, for the movie clip.

2. On the Stage, click the bounding box for the video movie clip that you

dragged to the Stage and view its attributes in the Property inspector.

3. In the Instance Name text box of the Property inspector, enter video as

the instance name.

NOTE

An instance is an occurance of a symbol on the Stage. Because ActionScript, the Flash scripting language, often refers to instance names in order to perform operations on instances, it is a good practice to name the instances you create. To learn more about naming instances, see the tutorial: “ActionScript: Write Scripts” on page 225.

20 Basic Tasks: Create a Document

Add video control behaviors

Behaviors let you add complex functionality to your document easily, without having to know ActionScript, the Flash scripting language. You’ll now add behaviors for video control.

1. In the Timeline, click Frame 1 of the Content layer to select it, if it’s not

already selected.

2. On the Stage, click the Play movie clip instance (which looks like a play

button) to select it. In the Behaviors panel (Window > Behaviors), click Add (+) and select Embedded Video > Play. To learn more about symbols and instances, select Help > Flash Tutorials > Basic Tasks: Create Symbols and Instances.

3. In the Play Video dialog box, verify that Relative is selected. Select

video, which is the instance name that you gave to the video clip, and click OK.

4. On the Stage, click the Pause movie clip instance to select it. In the

Behaviors panel, click Add (+) and select Embedded Video > Pause.

5. In the Pause Video dialog box, again select the video movie clip, and

click OK.

6. On the Stage, click the Rewind movie clip instance to select it. In the

Behaviors panel, click Add (+) and select Embedded Video > Rewind.

7. In the Rewind Video dialog box, select Video.

8. In the Number of Frames to Step Back text box, enter 20.

The Number of Frames to Step Back text box indicates how many frames the playhead should move back when the user clicks the Rewind button.

NOTE

Additional video control behaviors let you fast-forward, hide, and show a video.

Add video control behaviors 21

Use the Movie Explorer to view the document structure

The Movie Explorer helps you arrange, locate, and edit media. With its hierarchical tree structure, the Movie Explorer provides information about the organization and flow of a document.

1. Select Window > Movie Explorer.

If necessary, enlarge the Movie Explorer to view the tree structure within the pane.

The Movie Explorer filtering buttons display or hide information.

2. Click the pop-up menu in the title bar of the Movie Explorer, and select

Show Movie Elements and Show Symbol Definitions, if they’re not already selected.

3. Configure the filtering buttons, along the top of the Movie Explorer, so

the only ones selected are Show Buttons, Movie Clips, and Graphics; Show Action Scripts; and Show Video, Sounds, and Bitmaps.

If you move your mouse pointer over a button, a tooltip displays the name of the button.

Examine the list to view some of the assets included in the document, and to see their relationship to other assets.

4. In the Movie Explorer pane, expand Actions for Play to view

ActionScript that Flash created when you added the Play video control behavior.

5. To close the Movie Explorer, click its close box.

22 Basic Tasks: Create a Document

Test the document

As you author a document, you should save and test it frequently to ensure the Flash content plays as expected. When you test the SWF file, click the video control buttons to see if the video stops, plays, and rewinds as expected.

1. Save the document (File > Save) and select Control > Test Movie.

The Flash content plays in a SWF file window. Although .fla is the extension for documents in the authoring environment, .swf is the extension for tested, exported, and published Flash content.

2. When you finish viewing the SWF content, close the SWF file window

to return to the authoring environment.

Find help

The lessons provide an introduction to Flash, and suggest ways that you can use features to create exactly the kind of document required. For comprehensive information about a feature, procedure, or process described in the lessons, see the Help tab of the Help panel (Help > Flash Help).

Summary

Congratulations on creating a Flash document that includes graphics, a video, and video control behaviors. In a few minutes, you learned how to accomplish the following:

■ Tour the user interface

■ Dock and undock panels

■ Change the background and Stage size

■ Change your view of the Stage

■ View your document library

■ Add graphics to the Stage

■ Add video

Summary 23

■ View object properties

■ Add video control behaviors

■ Use the Movie Explorer to view the document structure

■ Tes t t h e d oc um e n t

■ Find help

To learn more about Flash, take another lesson.

24 Basic Tasks: Create a Document

CHAPTER 2

Basic Tasks: Creating a banner, Part 1

Macromedia Flash Basic 8 or Macromedia Flash Professional 8 can seem like a very complex programs to learn. One reason for this seeming complexity is that you can use it for so many different things, such as cartoon animations, media players, and sophisticated software. This tutorial is suitable for you if you're opening Flash 8 for the first time. This tutorial shows you some of the fundamental aspects of the program, and how to get started using them to build a real project. You don't need to know anything about Flash or animation to complete this tutorial; in fact, you'll discover how easy it is to start using Flash 8 to add elements to your web pages.

This is Part 1 of a three-part tutorial on how to build a simple animated banner in Flash and add it to a web page using Macromedia Dreamweaver. You'll learn how to create a file and modify its settings, import and add graphics to the Stage from the library, and create layers in Part 1. In Part 2 and Part 3, you'll add an animation and create a button that opens a browser window. Then you'll specify publish settings, and add the banner to a web page.

“Basic Tasks: Creating a banner, Part 1” on page 25: You learn how to

create and structure the banner application.

“Basic Tasks: Creating a banner, Part 2” on page 43: You learn how to add

animation, create a button, and write basic scripts.

“Basic Tasks: Creating a banner, Part 3” on page 63: You learn how to

publish your SWF file, and insert the file into a Dreamweaver website.

You do not need any prerequisite knowledge to complete these tutorials.

In Part 1 of this tutorial, you will complete the following tasks:

Examine the completed FLA file. . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27

Creating a new document. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .29

Changing document properties. . . . . . . . . . . . . . . . . . . . . . . . . . . . . .30

Importing graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .33

Introducing layers and the timeline. . . . . . . . . . . . . . . . . . . . . . . . . . .36

Test the application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .40

The tutorial workflow includes the following tasks:

■ “Examine the completed FLA file” on page 27 lets you view the

completed Flash document.

■ “Creating a new document” on page 29 shows you how to create a FLA

file that you’ll use to create the banner throughout the three parts of this tutorial.

■ “Changing document properties” on page 30 shows you how to change

the dimensions of your SWF file.

■ “Importing graphics” on page 33 shows you how to import assets into

your document’s library.

■ “Introducing layers and the timeline” on page 36 shows you how to

create and manipulate layers in the main Timeline.

■ “Test the application” on page 40 shows you how to export and test

your document’s SWF file, which lets you test your progress so far.

26 Basic Tasks: Creating a banner, Part 1

Examine the completed FLA file

As you examine the finished version of an application that you’ll create, you’ll also look at the Flash workspace.

In this section, you will complete the following tasks:

■ “Open the authoring document” on page 163

■ “Review the completed FLA file” on page 28

■ “Close the completed FLA file” on page 28

In subsequent sections you’ll go through the steps to create the application yourself starting with a brand new FLA file.

Open the finished FLA file

It’s helpful to analyze the completed authoring document, which is a FLA file, to see how the author designed the application. You should examine what kinds of scripts were used to add interactivity, and understand what you are going to create.

The files for this tutorial are located in the Samples and Tutorials folder in the Flash installation folder. For many users, particularly in educational settings, this folder is read-only. Before proceeding with the tutorial, you should copy the entire FlashBanner tutorial folder to the writable location of your choice.

On most computers, you will find the Flash Banner tutorial folder in the following locations:

■ In Windows: boot drive\Program Files\Macromedia\Flash 8\Samples

and Tutorials\Tutorial Assets\Basic Tasks\FlashBanner\.

■ On the Macintosh: Macintosh HD/Applications/Macromedia Flash 8/

Samples and Tutorials/Tutorial Assets/Basic Tasks/FlashBanner/.

Copy the FlashBanner folder to another location on your hard disk to which you have access. Inside this folder are three directories for each part of this tutorial: Part1, Part2, and Part3. In the FlashBanner/Part1 folder, you will find a Flash file called banner1_complete.fla. Double-click the file to open it in Flash. You now see the completed tutorial file in the Flash authoring environment.

Examine the completed FLA file 27

Review the completed FLA file

In the completed FLA file, you will see the structure that makes up the finished SWF file for Part 1 of this tutorial. The application, a Flash banner for a gnome website, looks like this at the end of Part 1:

The completed banner at the end of Part 1.

By the end of Part 3 of this tutorial, you will add the graphics, animation, and interactivity to the banner. Then, you’ll insert the banner on a website using Dreamweaver.

Close the completed FLA file

To close the document, select File > Close.

If you prefer to keep the finished file open as a reference while working with your banner file, be careful not to edit it or save any changes to it.

Now you’re ready to start creating your own banner file in the next section,

“Creating a new document”.

28 Basic Tasks: Creating a banner, Part 1

Creating a new document

You can create all kinds of different elements for the web or for CD-ROMs and devices using Flash 8. First, you create a file in the Flash authoring tool, which you use to output SWF files. SWF files are the files that you can put online when you embed it in a web page. The Macromedia Flash Player plug-in then displays the SWF file, so your website visitors can view or interact with the content.

Your SWF file can contain video, MP3 sound, animations, images, data, and so forth. The benefit of using an SWF file over other formats is that the Flash Player plug-in is incredibly common. Let's start building a banner.

1. Open the Flash application.

By default, Flash displays the Start Page (see the following figure), which enables you to select a recently edited document, create a new Flash document or ActionScript file, or create a new document using a pre-built template. If you use Flash Professional 8, you can create additional kinds of files.

By default, Flash displays the Start Page when it’s started. This figure shows the options available in Flash Professional 8.

Creating a new document 29

2. Click Flash Document from the Create New column on the Start Page

to create a blank document.

NOTE

If Flash doesn’t display the Start Page (the feature might have been disabled earlier if you share a computer) you can select File > New from the main menu to create a new document. Make sure the General tab is active, select Flash document, and click OK.

3. Select File > Save As from the main menu.

4. Name the file banner.fla, find or create a new directory to save your

project in, and click Save when you're done.

Flash saves editable documents as FLA files. From the FLA file, you export (or compile) SWF files that you can embed in an HTML page. Flash Player, installed on most computers, plays the SWF files that you export from Flash.

NOTE

It's a good idea to save a new document when you start working with it (and often thereafter) so you don't lose any of your hard work.

After you finish saving the file, proceed to the following exercise,

“Changing document properties”.

Changing document properties

At this point you're looking at a blank canvas surrounded by many controls (see the next figure). 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 Flash environment consists of the Stage and a variety of panels, tools, and the Timeline above the Stage. For detailed information on each part of the workspace, see

“Take a tour of the user interface” on page 14.

30 Basic Tasks: Creating a banner, Part 1

+ 260 hidden pages