Fireworks Tutorial :: Animated .gif

Step 1:
Open a new file that is 500 x 500 px with a white background.

 

Step 2:

Make a circle. Copy and paste the circle then move the new circle. Repeat this step until you have a created a scene that shows motion. This example shows bouncing.

 

Step 3:

Now we have to take this motion scene and chop it up into separate frames. To do this we first have to open the "Frames" window. [ Windows > Frames ]

Next use the "new frame" button frame to create as many frames as you will need to contain all of your images. PLUS a blank frame at the beginning and end.

 

Step 4:

Now that you have the extra frames you have to start cutting the images from the first frame and pasting them into other frames. They should look something like the examples below.

 

Step 4.5

This step will explain how to change the amount of time that each frame lasts for. To do this click on the number that is next to the name of the frame in the frame pallete.

 

Change the numbers until it looks right. To preview the animation click on the play buttom at the bottom of the image.

 

Step 5:

Once you have moved all the images into separate frames and set the timing you are ready to save this as an animated .gif

To do this go to frame 1 and click on the slice tool. Drag a slice the size of the canvas.

 

 

Step 6:

Next we want to go to the "Optimize" window. [Window > Optimize]

Select "Animated GIF" from the drop down menu.

 

Step 7:

Okay, we're almost done!

Click on File > Export and select export "Images Only."

Make sure that selected slice is checked but NOT this frame only.

This will export the animated .gif

 

NOTE ON SAVING :: MAKE SURE YOUR NAME IS IN THE FILE NAME

 

 

 

 

Step 8:

 

Now that you have exported you animated .gif you want to view it in a web browser. Open up Firefox and go to File > Open File and open your animated .gif

It should look something like this.

 

Step 9:

Once you have finished your animated .gif put it in Mr. Gordon's hand in folder.