Classical Jazz 2005: Home

Marathon Animations

BobMany people have asked me how I did the animations for Hamish's Marathon's Story site. Here are some quick pointers that will get you going in the right direction and, at the bottom of the page, some examples.

Definition
Animated GIFs are a series of bitmapped images that get displayed one after the other - all contained in a GIF file. Think of a flip-book.

Production
Regardless of what software you use, the process of creating an animated GIF is not that far away from what is required to create the aforementioned flip-book. Namely, meticulously drawing a number of frames and then having the software combine them. Better software usually handles things like scrolling text and transitions.

Documentation
Get thee to the mother-source of all information, the animated gif homepage.

Automation
For animations; Adobe ImageReady (Mac or PC). Check the animated gif homepage for more details on shareware and freeware programs. For morphs; I used an absolutely ancient piece of software appropriately named Morph. There are a number of other utilities available today that do similar things. Elastic Reality is one that come to mind. Also there are a number of shareware options for PC users - just go to shareware.com and search for "morph".

Suggestion
Animated GIFs can quickly develop into monstrously large files. Each of the below impacts the file size:

The dimensions of the image.

The amount the image changes from frame to frame. Animated GIFs store the differences between frames, so if you can keep the actual size of the "area of change" down to the minimum, you'll produce a much smaller file.

The number of colors in the image. Try to keep the number of colors in your image down to a power of 2. The less colors, the better.

The "dithery-ness" of the image. Large swatches of a few colors produce a much smaller file than an image with the same number of colors where the colors appear scattered amongst each other. This means that animated GIFs using, say, captures from a camera source, will produce very large files.

Timing is an important and frustrating issue:

If you animate text, be sure you give your audience the time to read it.

Animated GIFs can start playing before they are finished downloading. Many times it is good practice to make your first frame delay for a second or two.

Making several animated GIFs that display synchronously is tedious frustrating work.

If you are working on an animated GIF with a finite number of loops to play, remember that it will stop on the last frame. Leave the audience with something good to look at.

Animated GIFs can be just plain annoying to look at. Avoid inducing seizures in your visitors.

Illustration
Here are some samples of the animations I have done. Most of these are on Hamish's Marathon Story site - but I understand how tedious it can be to find them all.

Some icons and morphs which was mostly manipulating someone else's artwork. Warning: Heavy CPU and bandwidth loads ahead!

Hamish hexed the prison level map so he could get screenshots of what went on outside of the cell you are supposed to be locked in. I assembled the pictures and built a little Marathon-esque interface so you can see Robert Blake rescue you from a fate worse than death!

When Bungie announced Marathon Infinity I did this animation and sent it to Hamish. Hamish said it reminded him of a movie he once saw, so he had me redo it to look like this.

I collaborated with Hamish on Where Giants Have Fallen, You Can Conquer. He really did most of the work and I futzed with the graphics. My local copy is here in case his goes off-line.

Finally, some (animated) last words on Bungie and our slavish devotion to their cause.

 

 

 

 

 

it pays the bills dept

here is something I hope is doing no evil.

could be worse dept

there could be more of them