CoverPop - How it Works

Thanks for visiting CoverPop. I made the first CoverPop, a few thousand science fiction covers, on Saturday, Oct 16, 2005, after thinking about it for a couple of weeks, but not having time to work on it. It took me much of the day Saturday to make.

The 3,448 covers were arranged horizontally by time, with earlier covers to the left, and more recent covers to the right.

The covers were arranged vertically by hue.

How a CoverPop is made

Data for each coverpop is prepared using Perl and the ImageMagick library. Space-filling is implemented (with visual feedback) using Processing (p5). The interface itself is presented in Flash/Actionscript within a PHP webpage.

I download information about all the covers using various means. I use Amazon Web Services for the Amazon-powered coverpops, and I screen-scrape websites, such as the Visco archive for the Science Fiction coverpop. This is done using a Perl program. Then I download all the thumbnails (again with Perl), and analyse them for color, using ImageMagick to reduce each image to 1x1 and recording the color of the remaining pixel.

For the Science Fiction archive, I mapped the covers to time/hue, which produced the following layout, which I visualized in Processing:

I wanted to make sure that each cover had as much space as possible on the table - kind of the way you fill a cookie-sheet with cookies. So I made a space-filling program in Processing which generates a paticle system in which the particles repel each other based on the inverse square of their distances. Each particle represents a cover.

Here's the original version of the repulsion program, before I added the actual cover data. This version just used random values. I later modified this program to read the cover data from a text file.

To determine the cover positions, I start with the original time/color positions (or whatever mapping I want to use), and then let it spread out to fill an 800 x 600 rectangle. It's fun to watch as it spreads out, producing a mosaic pattern. I took some screen snapshots while this was happening, which are shown below. When the dots look evenly distributed, I stop the program and record the position of each cover-dot. The mosaic has more 'whorls' in the area where the particles were originally more dense. This space-filling technique is pretty cool, and I may use it for some other mosaic-related projects.

Update: Astronomer John Dubinski says the following about this technqiue:

"You've made a "glass" in solid state physics jargon. Cosmological N-body simulators incidentally used "exactly" the same technique to set up randomly uniform distributions of particles in cubes that they then perturb with tiny density fluctuations representing the initial state of the universe!"

So I guess I made a glass coffee table. We used to have one of those things, I always bumped my shins on it. :)

I use Perl and ImageMagick again to prepare the final mosaic image. the thumbnails are randomly rotated to create the look of an enormous coffee table. For some coverpops, I swap the images to make photomosaic effects. I save the data (including the positions, rotations, and metadata for each cover) into a text file which is used for the Flash interface.

The Flash interface finds which cover-point the mouse is closest to, and downloads the thumbnail image for that cover, and displays the metadata for that cover. When the thumbnail is debuted, it is animated to start from the same position as the micro-thumbnail in the background image, so you get a seamless transition.

Like most of my Flash movies, it is primarily Actionscript, which makes it very small -- the SF explorer is about 80k, most of which is text data for the cover credits. In my opinion, if a Flash movie requires a preloader, it is probably broken.

If you like this thing, you may also like my Flickr colr pickr interface, which uses similar techniques. I originally planned on making a Colr Pickr interface for the magazines, but thought it would be interesting to try to visualize all of them at once.

There is also some interesting Flash-physics stuff in my Flash Bestiary.

Enjoy!

-- Jim Bumgardner