Resize your browser <-- -->

The Peekaboo Grid

CloseupThe Peekaboo grid covers the illustration only allowing part of it to show through at any given time. In its simplest form, the grid is a standard checkerboard -- giving you a two frame animation. The example at the left shows a close-up of the grid that I'm using for a three frame animation. It's possible to develop these grids to accomodate 4, 5 or 6 fame animations, but keep in mind that adding more frames makes the animation progressively darker.

The Composite Image

The Composite ImageThe composite image contains equal parts of all three frames which we need to overlay on one another to create a single image. If they don't mesh together perfectly, you've probably done something wrong.

Beware: Constructing the compostion image is a slightly mind-bending experience, so try not to get distracted part way through the process.

Alex Walker
June 22nd, 2008
Originally published the SitePoint Design View #46