What is the best way to produce an animated GIF?

  • Let's say I want a scribe to be 728px x 50px.  How can I export this as a GIF to be put on a website?


  • You could:
    1) export it as a PNG sequence, then
    2) import the png images into gimp or photoshop (or any program that can import a sequence of PNGs and export a gif)
    3) crop them to the dimensions you want and
    4) export as a gif

    -Mike (videoscribe user)


  • Thanks, could you provide some guidance on step 2 & 4?  My gif that I exported seemed to run slower than 30fps.  Something went amiss.  

  • exporting is a real pain.  They come out looking terrible with dots all over the place.

  • 1) What program are you using for steps 2 and 4?
    2) If videoscribe won't export the pngs at a lower frame rate, you should probably delete 1 or 2 out of every three frames to get the frame rate down to 15 or 10 fps in my opinion.
    3) At 10 FPS your time per image should be set to .1 seconds in whatever program you are using, I believe.
    4) if you want help with the dots, upload an example of the dots please

    -Mike (videoscribe user)
  • Thanks for your help with this.

    1- Photoshop.

    2- Exporting from VideoScribe @ 30fps.

    3-In Photoshop I hit Open, click on the first frame and click "import sequence", then it opens as a video below.  I crop the video to the desired dimension, thus converting it to a smart object layer.

    4.  Then click file - save for web -this options screen is where I need help.  No matter what I do it always comes out looking terrible.

    (140 KB)
  • Thanks that screenshot is very helpful.

    1) oh good! Photoshop should be a good choice.

    2) at 30 FPS your gif frames will need to be timed to .034 seconds each I believe if you want to keep the same speed (that many frames per second is a lot for a gif, that's why your gif is over 4.6 MB) That large file size won't be good for website use but it might play okay from your local hard drive.

    3) those steps sound good, but be sure to select all frames and set the frame rate to .034 seconds as mentioned above, before saving for web.

    4) you can remove the dots by changing "pattern" to "no dither" but you will probably see some color banding instead. You can also increase the number of colors from 128 to a higher number to reduce the banding but both of these changes will increase the file size probably.  You can ALSO try the lossy setting which will blur everything a little bit I think.. and that might reduce the banding or dots (dithering). Gifs are not the best file type for photographic elements that have many subtle color variations (like your background image).

    -Mike (videocribe user)

  • I will try that.  What would you suggest for a scribe that is for a website?  The dimensions have to be 960x262px.  And something that can be clicked on (linked).

Login to post a comment