A sample text widget

Etiam pulvinar consectetur dolor sed malesuada. Ut convallis euismod dolor nec pretium. Nunc ut tristique massa.

Nam sodales mi vitae dolor ullamcorper et vulputate enim accumsan. Morbi orci magna, tincidunt vitae molestie nec, molestie at mi. Nulla nulla lorem, suscipit in posuere in, interdum non magna.

Animated GIFs from Photos

While it is now easier than ever to share video on the web, sometimes what I want is to share multiple images in the same space. This might mean full blown animation, which can look very nice, or it could be a slow turn through several photos so that each is shown for a longer period – say 5 seconds. Either way, the key to this is to create an animate GIF image.

If you have Photoshop CS3 or higher, this can be done fairly easily. However, the key is getting all the images into layers. I stumbled across a very helpful script for this, here:

Utilizing this script, it becomes very easy in comparison to manually adding layers to an existing image. The instructions there show how to use the script to select a folder, from which, all the images within will be loaded as layers in a single new Photoshop file. Since the import is alphanumeric by file name, be sure to simply drag and drop the layers into the right order.

Once this is done, select the Animation palette from the Windows menu. The “image” file will show as the first “frame” on the palette. On this frame, click off the “eyes” on all layers except the first one. Now click the “Duplicates selected frames” icon on the bottom of the Animation palette. On this new duplicated frame, click off the eye on the first layer, and click on the eye for the second layer. Continue this process until all layers have an equivalent frame.

At this point, you should be able to click the “play” icon on the Animation palette, and see the animation play. You can now change the duration of the display of any one of the frames by clicking the down arrow in that frame (user hint: if you select a range of frames and change the duration of any frame, they are all changed to the same value.)

You are now ready to export the GIF. To do so, select File, then select  Save for Web & Devices. Be sure to set the file type to GIF, and save the file. That’s it! To test it, you can simply drag the file onto your web browser, and it should play.

Here is an example…


Leave a Reply

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>