Fireworks button's text animation ???

Discussion in 'Graphic Design' started by j4mes_bond25, May 18, 2006.

to remove all ads.
  1. j4mes_bond25

    j4mes_bond25 New Member

    I've recently started to use Fireworks 8 & am working on making some buttons for my website.

    I've made a button on a transparent canvas, using a rectangle tool & on it is a text saying "HOME".

    To creat the animation now, I wonder if anyone could point me in the right direction as how to I go about making each of the letter i.e. "H", "O", "M", "E" individually fly from different direction such as letter "H" just above from top right of the button, letter "O" from just above the top left of the button itself, etc. I know this can be done by converting an "object" into "Modify > Animation > Animate Selection" BUT how could I do it with the "invididual letters" rather than the whole word "HOME".

    Additionall, once I do so, how exactly could I change the text from "HOME" to "ABOUT" keeping the animation EXACTLY THE SAME on the same button (keeping the rectangular button's own animation intact). & then changing the text to "CONTACT", etc. so I can finally have EXACTLY same animation on each individual letters of different link (HOME, CONTACT, ABOUT, etc.)

    If I save it as a gif animation, it might not show the animation smoothly, cos of people's slower Internet connection (and perhaps, different letter flying by at different time, etc.), so would it be sensible to save it as "Flash" file instead so all individual letters of each of the links (HOME, ABOUT, CONTACT) has their animation at the same time ???

    Can anyone help ???
  2. ISDProductions

    ISDProductions New Member

    I would imagine (i don't use fireworks) that you just have to put each letter on a different layer. That way they are treated as individual objects instead of as one.

    If you want it to be smooth, make it in flash. .gif's by nature won't ever look great.

    By the description of what you want to accomplish, it sounds like flash would be better for this anyways.
  3. Wingnut

    Wingnut New Member

    hey you should do this in flash. flash is very easy, some people are scared of it but i find myself begging clients to do flash websites rather than html because im so comfortable working in it now. at least when the website pertains to using it. if you need flash or a tutorial let me know. i have it all from when i learned.
  4. StephanieCordray

    StephanieCordray New Member

    This plus you have to convert each letter to a graphic... I don't have Fireworks 8 but I imagine very little has changed in that animation setup.

    I have to agree with the others about using Flash instead, however, I don't know if you have Flash as well as Fireworks. Flash makes a much better animation than you can get from Fireworks alone.
  5. afcove

    afcove New Member

    Hi Wingnut,

    I'm interested in your offer for flash and the tutorial.

  6. scott

    scott New Member

    hi i am new to the forum and i have been using fireworks before and i have never seen that done before in fireworks i have only seen it been done in swishmax or flash but you might be able to do it if you put each letter on a diffrent frame

  7. Isopach

    Isopach New Member

    Hi there. I've been using Fireworks for a few years now.

    As far as I know, there is no tweening available in Fireworks. You create additional frames and then move around whatever is going to change. Make a new frame, move stuff, etc, until you've finished all the movements. (Shift+F2 opens the Frames box)

    This frame-by-frame (FBF) method of animation is ineffective if you're looking for smooth, complex animations. Its good for quick, simple stuff. The most complicated animation I've made using this method is the PayPal donate button on my website. Also on my site, on the home page, look at the little black character at the top of the screen. Every few seconds he blinks. That was also done this way.

    So, use Flash for the smooth fancy stuff. If you're going to use Fireworks, do the following:

    After you've made all the new frames and edited the graphics in each frame, go back to Frame 1 and draw a web slice around the button. Click on the button, open the optimize box, and set the output type to animated gif.

    Right click on the slice, select Export selected slice, and save your file. Done.

Share This Page