Animated GIF in Photoshop CS4 Tutorial

Inspired by the Noise Professor’s decision to make his animated GIF in Photoshop, I decided to play around with that tonight and ended up learning a good bit and with a much better process and product (fewer programs, higher quality).

I didn’t know you could do this all in just CS4.

Video to Images

Capture video frames as stills to layers – you can even select portions of the video right in the import window. You’ll now have all the frames as images in individual layers.

Animation Window

Open up the Animation Window1

Eternal Looping

I set it to loop eternally. It’s right there in the bottom left hand portion of the animation window. If you forget you have the option to set this again when you do the final export/polishing.

Frame Speed

Shift click to select all the frames and you can change the animation speed all at once.

Animate the GIF

I saw this was impossible in a number of places and if you go to the normal Save/Save As location, it is. There is actually an option below that on the menu that is “Save for Web & Devices.” Somehow I never saw that. You’ll have Animated GIF as an option here.

Polish It Up

1 Never opened this before

5 thoughts on “Animated GIF in Photoshop CS4 Tutorial

  1. Sweet. I knew that Photoshop would save GIFs, but I never thought to use it to save animated GIFs. Looks like it has pretty much the same tools as Fireworks, so it will definitely save a step.

  2. This is very nice, and now I want to come up with a method that is free given I don’t have cs4. Why do the animated gifs get shrunk? How did you avoid that with your brilliant flavor flav animate gif? I have yet to try this, but amazingly now I have a number of tutorials to choose from. Your idea for throwing assignments out there early has obviously taken off, and the animated gif has been a sick hit—I love what has come through the wire. And I am looking in from the outside forlornly 🙂

    1. I think the shrinking of the gif has to do in part with the original video resolution and whether you choose a hi-def download or not. None of that is based on facts, just guesses and trying to remember the key differences in what I did for each process.

    1. Yeah, I love that movie. Hopper and Walken in that scene do such an amazing job. True Romance is one of those chronically underrated movies.

Comments are closed.