(1) (2) (3) (4) (5) (6)

Pre-Production
I highly advise preplanning your animation before starting Fireworks. Determine all the design parameters (length of animation, number of layers, etc.). Sketch it out in pad and pencil until you get a good grasp what you want to accomplish. It will pay big dividends later. This tutorial will demonstrate how to best utilize the the capabilities of Fireworks to create an animation and export it to a Web page.

Power of Symbols & Instances
Like Flash, Fireworks uses 'symbols' and 'Instances.' Symbols are the original graphic element. Instances are copies of those original graphics. Unlike Flash, however, there are limits to what you can do with them in Fireworks.

Tweening the Fireworks Way
Tweening is a traditional method of animating where an artist designates the first and last frames of an object and another artist or a computer blends the changes in be(tween). Fireworks supports tweening, but there are limits. You can tween objects with movement, size, rotation and opacity. But you can not tween shapes (i.e. morphing) or color. I will demonstrate a work around to do both. Another tweening limitation in Fireworks is the inability to attach an object to a bezier path.

Example 1: Flying Saucer
In this short tutorial, I will demonstrate how to tween an object with motion, size, rotation and opacity. I start a new document 400 x 75 and add three more layers in the layer palette. First I built my UFO using layer 3. In my case I chose one from a clip art CD. The UFO will start off invisible (0% Opacity) start across the screen and become visible (100% Opacity) grow in size as if coming closer then gets small as if flying away before coming in for a landing with a little jittering (rotation effect).

My UFO & ET

(1) (2) (3) (4) (5) (6)