hoekstra.co.uk

The best way to display a consecutive sequence of  images in a quick succession is to create an animated GIF. Using an animted GIF instead of a video file means that no video-player plug-ins are required on your browser. Also, many corporate networks have internal network restrictions that prevent video files to pass the firewall, but allow animated GIFs. It is also much easier to embed GIF's in content management systems, such as Joomla, compared to a video file.

Here's how to make an animated GIF from a directory of chronologically-sequenced photos or images using the ImageMagick toolset on Linux.

Step 0: Check your tool chain

Install ImageMagic if it is not already installed:

• On Sabayon:

$ sudo equo install imagemagick

• On Gentoo:

$ sudo emerge imagemagick

• On Mint and Ubuntu:

$ sudo apt-get install imagemagick

• On Red Hat and  Fedora:

$ sudo yum install imagemagick

Step 1: Resize files

Here is your directory of image files, which are already in the sequence that you want to display them:

$ ls -al | head -10
total 4349184
drwxr-xr-x  2 gerrit gerrit   61440 Dec 25 23:25 .
drwx------ 69 gerrit gerrit    4096 Dec 28 10:38 ..
-rw-------  1 gerrit gerrit      67 Dec 25 17:14 .directory
-rw-r--r--  1 gerrit gerrit 5413562 Dec 25 13:29 IMG_7152.JPG
-rw-r--r--  1 gerrit gerrit 4659677 Dec 25 13:29 IMG_7153.JPG
-rw-r--r--  1 gerrit gerrit 5282393 Dec 25 13:29 IMG_7154.JPG
-rw-r--r--  1 gerrit gerrit 4767624 Dec 25 13:29 IMG_7155.JPG
-rw-r--r--  1 gerrit gerrit 5094968 Dec 25 13:29 IMG_7156.JPG
-rw-r--r--  1 gerrit gerrit 5132944 Dec 25 13:30 IMG_7157.JPG

Resize all the files in the directory to the eventual size of the anumated GIF file, e.g. 320x240 pixels, with this one-liner:

for i in *; do echo Resizing $i to r_${i}; convert "${i}" -resize "320x" "r_${i}"; done

The original files remain in the directory and the new resized files have an "r_" appended to it. It is sufficient to only specify the width, i.e. the "320x"-bit, as the height will be calculated to 240 if your pictures have the common 4:3 apect ratio. 

Step 2: Make the animated GIF

$ convert -dispose none -delay 100 -loop 4 r_*.JPG my_animation.gif

The resulting file, my_animation.gif, can now be used just like any other image file on your web page.

Consider also:

When you have many images to animate (100's), consider creating a video file from your images instead, as it has much better (lossy) compression and will result in more respectable file size. There is a trade-off on quality though.