Creating animated GIFs

[Mikdog]

I'm working on a project to create animated GIFs for a website. From AS, you can't really export to an animated GIF. I'm using Photoshop CS3 so I found a workaround.

When you export, I put the frame rate to HALF. This cuts the file size down and speeds up the GIF because sometimes the GIF plays slowly in a web browser for some funky reason.

I have 2 options that I know of:

1. Export to PNG
2. Export to .MOV Quicktime, with animation codec (or no codec) but make sure its at its HIGHEST setting.

Then, in Photoshop CS3, I make the ANIMATION window visible. If I exported PNG's I then open all the PNG images and put the images all in one document, and have them all as different layers. Then I create frames for the animation in the animation window and switch each layer on in sequence for the frames. Very laborious.

If I've exported to a best quality movie, I can go FILE > IMPORT > MOVIE SEQUENCE AS FRAMES (or something like that). Then this neat script will import my .MOV and create an animated sequence for me. I just have to make sure that the frame delay is 0.0 seconds because by default it seems to put an 0.8 second delay on each frame.

In both cases, I then go to FILE > SAVE FOR WEB & DEVICES and save it as a low or high quality GIF.

Dere ya go.

[Víctor Paredes]

I work with corel photopaint from several years ago and it's pretty easy to make animated gifs. just open an avi or mov and save it as gif.
obviously you can paint, edit or delete each frame. really useful.

[dm]

Try this:

http://www.stone.com/GIFfun/GIFfun_by_Stone_Design.html

I'm sure there are others out there like it. (it's free)

-dm

[DK]

Great tip Mikdog!!! My angle on it.....Export your animation directly from AS. If it's too big you can dramatically cut the frame rate in AS then export the image sequence into PaintShop Pro's Animation Shop. It has a gif wizard that allows you to set the overall frame speed for the entire gif. After it is done you can select each individual frame of your animated gif and set its frame speed. I usually set the first and last frames to 5 or 10 which gives you a little pause between the loop. Lastly, import your gif into outlook express or IE to see if the speed is correct, if not just go through the wizard again.


Cheers
D.K

[human]

Well, I keep recommending

http://www.gamani.com/

so often you're going to think I get a commission, but it's just that I'm crazy about its performance, quality, reliability, design.

(I bet this broken record of mine will easily turn up in a search of the archives here.)

Windows only, of course.

In my experience, there are fundamental differences in the speed of animated GIF playback between IE and Firefox. I can't remember which of them interprets the delay values in a way to make it slower from the other one.

I haven't bothered to test this in Opera, sorry. Maybe someone should.

[synthsin75]

Well if you're on windows, MS Gif Animator is very easy to use with AS, and it's free. http://ms-gif-animator.en.softonic.com/

It converts AVI to GIF. Like Mikdog said, you want to export your AVI at half framerate so that the gif runs at full speed. I use this all the time. Just make sure that the 'import dither' method is set to 'solid' before openning the avi.

[heyvern]

Mikdog,

I am pretty sure that Photoshop CS3 has a "script" for loading a series of images into a layered PSD file. I still use Adobe Image Ready which I think is now incorporated into Photoshop. Image Ready had an option to turn layers into animated frames for gif export. I use this all the time when producing animated gifs. This would speed up that "laborious" step you mentioned.

Just load the folder of images from AS as layers into a PSD. Use the command to create frames from layers. Done.

-vern

[Mikdog]

Funnily enough, CS3 for Mac didn't come with Image Ready. I think it was left out of CS3 altogether. I could be wrong. I'd normally use Image Ready but the animation window's been incorporated into PS.

A script for loading a sequence of numbered images into an animation would be cool though.

[dm]

Photoshop CS3-which version?

Try this:

In Photoshop CS3, Window>Animation
(is that there?, if so, there's now a new window along the bottom of your screen.)

File>Import>Video Frames to Layers

Choose your video (quicktime, etc.) Check "Make Frame Animation", select the range, and (if you have a long sequence that needs to dispose of some frames, "Limit to Every" and choose how many frames it needs to skip between each grabbed frame)

Now you should see all of your frames in that animation time line, and you can select duration, etc.

Now File>Save for Web and Devices...

Choose Gif, resize and adjust compression-set repeat etc. (Apply)

Save.

You're done. If you have the 'basic' version of Photoshop, I don't know if you can do this or not. If you have 'extended', etc., you can.

Or, just use one of the utilities listed above.

-dm

[Mikdog]

Thanks,

That's kind of what I explained in my first post, but you explained it much clearer. Nice one.