|

Animated Numbers

Here's another simple animation
technique that you may enjoy! It's a straightforward "frame-by-frame"
job and goes like this:
Open a new canvas in FW and click
to select the "Text" tool. Click on your canvas
and, when the Text Editor has opened, choose your desired settings
for font/weight etc. Type your first number, like so:

Next, open the "Frames"
panel and click the black arrow at the top-right of the panel to
open up the fly-out menu. Select "Duplicate Frames"
like so:

In the new dialogue box which opens,
choose the following settings:

I've chosen to add 9 new frames,
because the animation will include the numbers 0 - 9 (which
equals 10 frames in total, yeah?). I guess the settings you
choose will depend on how ambitious you are! Heh!
The "Frames" panel will
now change to show this:

HINT: The right-hand column
shows the default "Frame Delay" rate of 7/100ths
of a second. If your animation is a little rapid for your liking,
you can edit this rate to your heart's content! Simply click the
top entry, then SHIFT/CLICK the bottom entry to select them
all. Next, double-click any frame and set a higher number in the
dialogue box which opens. The higher the number you set, the slower
the animation will appear!
All of these frames will obviously
be identical to the first one you created. Your job is to click
on each Frame and double-click the number appearing on your canvas.
The Text Editor will then re-open and you can individually edit
the number appearing in each frame of your animation. I've edited
the numbers to give a random-number effect, as you can see at the
top of the page.
Last step is to open the "Optimize"
panel and set the file option to "Animated Gif",
as shown here:

You may also wish to explore the "Looping"
options offered at the bottom of the Frames panel, shown here in
it's default setting of "Forever":

O.K., preview your work with F12,
then export away!
For some more Animation techniques
in Fireworks, check out my "Animated Banner"
, "Wipe Text", "Animated
Colour Shift", and "Fade
Text" tutorials!
Have fun!
|