Skip Navigation.

Fireworks Animation: Simple animation

Shooting Star Animation

Doing simple animations with Fireworks is so easy, you'll want to make every image you make an animated one. The downside is that Fireworks has a relatively limited set of transformations it can make.

Fireworks Animation Dialog
Fireworks Animation Dialog

  1. Make a symbol of the object you want to animate.

  2. Place an instance of that symbol in your document window. Select it using the arrow tool.

  3. Choose the "Modify" menu, select the "Animate" submenu, and select "Animate selection"

  4. The Animate Window will pop up, giving you numerous ways to adjust your animation. Below are the details. (The screenshot to the right is the screenshot of the Settings window for the animation above.)

    Frames
    Indicates the number of frames over which the transformation will occur. The higher the number, the more smooth your animation will look, but the longer it will take.

    Movement
    The number of pixels (in a straight line) your object will move.

    Direction
    The direction the object will move, in degrees. (Zero is directly right, 90 is up, etc.)

    Scaling
    Indicates the factor by which the object will change over the course of its move, in percent. (50 is half, 200 is double, etc.)

    Opacity
    Indicates how opaque the object is. You may set a beginning and an end point for your transformation. (0 is completely transparent, 100 is completely opaque).

    Rotation
    You may choose whether or not to have the object rotate, by how much, and in what direction. (The numbers are in degrees).

  5. When you click "OK," you may get a message warning you that your animation will exceed the number of frames you've made. It will ask to extend the length of your document. Click "OK."

  6. You should now have an animation. Click the play button at the bottom of your document window ( Fireworks play controls ) to see your animation in action.

  7. To edit your animation, select it with the arrow tool and then choose the "Modify" menu, select the "Animate" submenu, and select "Settings...." The animation dialog window will open again and you can change the settings for your animation.

Back