11 Replies Latest reply on Mar 21, 2008 7:57 AM by JoeDaSilva

    Fireworks Animation Question

    JoeDirt-LCTR
      I am trying to take a simple file and have it scroll across the screen pause in the middle and rotate +10 degrees in 3-4 frames and then reset back to zero and continue scrolling. I can get it to rotate +10 degrees from beginning to end but not just in the middle. I am new to fireworks or any other gif software so please be patient if I ask a bunch of questions.

      Thanks in advance
        • 1. Re: Fireworks Animation Question
          Level 7
          JoeDirt-LCTR wrote:
          > I am trying to take a simple file and have it scroll across the screen pause in
          > the middle and rotate +10 degrees in 3-4 frames and then reset back to zero and
          > continue scrolling. I can get it to rotate +10 degrees from beginning to end
          > but not just in the middle. I am new to fireworks or any other gif software so
          > please be patient if I ask a bunch of questions.

          The program you want for doing a sophisticated animation like the one
          you describe is Adobe Flash. A GIF file would end up being so large you
          wouldn't be able to use it on a Web page.

          --
          Linda Rathgeber [PVII] *Adobe Community Expert-Fireworks*
          --------------------------------------------------------------
          http://www.projectseven.com
          Fireworks Newsgroup: news://forums.projectseven.com/fireworks/
          CSS Newsgroup: news://forums.projectseven.com/css/
          http://www.adobe.com/communities/experts/
          --------------------------------------------------------------
          • 2. Re: Fireworks Animation Question
            JoeDaSilva Level 4
            Unless the bus is small of course ;-) Can you upload the GIF file as you have it now? I'd like to take a peak.
            • 4. Re: Fireworks Animation Question
              Level 7
              That file is almost 3MB in size already!
              Definitively a job for Flash, like Linda suggested.

              alex


              JoeDirt-LCTR wrote:
              > Here is a link to what I have so far.
              >
              > http://www.lincolncountrytrailriders.com/Home_files/CJ%20Bus.gif
              • 5. Re: Fireworks Animation Question
                JoeDaSilva Level 4
                Ok, I opened up your file to find 100 frames, which is a ton. I started by expanded the canvas by 100 pixels (height) to make room for the wheelie. Then I cut out every other frame, taking the total down to 50. When I exported it, I set the colors to 16. This obviously cuts the quality quite drastically, but it gets the file size at least a little more manageable.

                We could reduce the size of each frame (making the bus smaller), which would reduce the file size even more. You could even remove more frames.

                So we went from 2900 KB in size to 566 KB.

                Take a look, I hope I got the wheelie right ;-) You should be able to follow along with your original and make the same changes, use mine for reference if you like.

                http://joedasilva.com/misc/CJBus2.gif
                • 6. Re: Fireworks Animation Question
                  JoeDirt-LCTR Level 1
                  thanks for the help Joey.

                  I understand about deleting every other frame. And exporting in 16 bit color to reduce file size but how in the heck to I get just one frame to rotate in stead of every one? Every time I try to change rotation angle it changes every frame. I think I am just not changing th rotation in the correct spot.
                  • 7. Re: Fireworks Animation Question
                    Level 7
                    JoeDirt-LCTR wrote:
                    > thanks for the help Joey.
                    >
                    > I understand about deleting every other frame. And exporting in 16 bit color
                    > to reduce file size but how in the heck to I get just one frame to rotate in
                    > stead of every one? Every time I try to change rotation angle it changes every
                    > frame. I think I am just not changing th rotation in the correct spot.

                    You would need to animate manually, a frame at a time. Changing a symbol
                    animation changes every instance of the symbol across frames. 566 KB is
                    still too large. Reducing the number of frames means that you need to
                    speed it up to make it look smooth. Speeding it up will make it
                    unreadable. Use Flash!


                    --
                    Linda Rathgeber [PVII] *Adobe Community Expert-Fireworks*
                    --------------------------------------------------------------
                    http://www.projectseven.com
                    Fireworks Newsgroup: news://forums.projectseven.com/fireworks/
                    CSS Newsgroup: news://forums.projectseven.com/css/
                    http://www.adobe.com/communities/experts/
                    --------------------------------------------------------------
                    • 8. Re: Fireworks Animation Question
                      JoeDirt-LCTR Level 1
                      I am flash illiterate. I opened it up but don't know where to begin. I will have to see if there is some type of tutorial or something to go off of.

                      Thanks for the help.
                      • 9. Re: Fireworks Animation Question
                        JoeDaSilva Level 4
                        Dirt, do you have the "frames" property panel open while you're working on this animation? Also, are you opposed to making the bus, say, 75% smaller (on the screen)?
                        • 10. Re: Fireworks Animation Question
                          JoeDirt-LCTR Level 1
                          quote:

                          Originally posted by: JoeyD1978
                          Dirt, do you have the "frames" property panel open while you're working on this animation?


                          Not for sure exactly what you are talking about "Frames" property panel is. If it is in the bottom right of the screen that says frame and the duration then yes.

                          • 11. Re: Fireworks Animation Question
                            JoeDaSilva Level 4
                            Dirt,

                            You might need to readjust your panels to get it looking like mine, but take a look at this:

                            http://joedasilva.com/misc/cj-bus-screen.jpg

                            A GIF animation, like all other traditional animation, is set up to play frames in order. Your bus animation is made up off 100 of these frames, each lasting 7/10 of a second. If you jump to a frame somewhere in the middle and click it, you'll display the image on the canvas that makes up that frame. If you where to, for example, delete the bus from frame 38 (like I have highlighted), when played back your animation would flash whiite for a split second when that frame comes up.

                            In my example animation posted above, I just rotated your bus in several concurrent frames. With each frame I'd rotate the bus a little more, so when played back in order you'd get the effect of the bus "popping a wheelie".

                            To rotate the image, I just selected the frame I wanted to work with, then selected the bus, then pressed Q on my keyboard to activate the scale tool. From there you can rotate the image with the corner handles.

                            I did have to adjust the canvas size (Modify > Canvas > Canvas Size) to avoid having the top of the bus cut off though!

                            I hope that gets you a little further - you will have to address the file size though before deploying this to a live website (as others have suggested).