Adobe® Flash® is the most popular way to add animation and interactivity to web pages. When you work on a flash project, the source file that you save is a .fla. When you want to see how your project will look on a web page, you will ‘publish’ the file as an .swf file which is embedded into a .html file. An ‘object’ tag which contains the parameters for the flash ‘movie’ can be embedded into an html file with Dreamweaver® or using the Flash application itself. This lesson will be for the Windows operating system (Sorry Mac Users). So let us go through the process, step by step… Here are the images that I will work with. They’ve been created in Photoshop (see my web design tutorial). Note that most of them have transparent edges. To create this effect (In Photoshop), select and copy each element from a layer of the design and paste into a new canvas. Make sure that the background layer is turned off. Save as a .png file and select Interlace:None from the PNG Options.

First create a new document (Hold>Ctr>New) in Flash. Select the latest Flash File type. I’ll be using ActionScript 3.0, but I
will not be using much scripting…

Save the new document. Open the Document Properties box (Hold>Ctr>J). Choose the dimensions for the animation and a background color. I like to keep the frame rate at 30 fps so that the animation runs smoothly.

With the interface you can drag different palettes and position them to your liking. Here, I’ve chosen to place my
’stage’ above the timeline and properties palette.

Download