New! Improved! Code! Five Card Flickr Stories

I was way overdue in rolling some updates into the source code (available on google code) for my Five Card Flickr Stories site. Before my departure from NMC, I moved the site from their servers to my own, so the new main site is at http://5card.cogdogblog.com/ (I left a URL redirect on the NMC site, so all old URLs should cleanly jump to the new).

This site was completely inspired by an activity I had seen Ruben Puentedura use in his workshops on comics. As a creative exercise, he used the Five Card Nancy game (originall devised by comics guru Scott McCloud) as it has been done by a nifty web version at 741.5 Comics.

In this activity, you are dealt 5 different panels from Nancy comics, that have been detached from their originals. In turn, Ruben would have the audience choose a panel that made the most sense in a story. After one panel was chosen, 5 more would be “dealt”. In essence, you are charged with making a meaningful story from parts that were originally not meant to go together. It was always fascinating to see the audience go through a decision making process, and rationalise their choice.

I had always thought it would be cool to do the same activity, but instead of old nancy comics, to use images from flickr, so in 2008 I built the first version of the site that was designed to cull images from flickr that had been marked with a specific tag,

Thus, there are two ways to participate- you can contribute to the main pool by tagging photos 5cardflickr or they could go to the site and make a story from the randomly dealt photos.

Once a player has reached the end, they can then save it with their name, a title, and a place to write an explanation of the story (often these are literally captions, but often people fo much farther). You can see the collection of stories at the gallery (over 3700 at the time of this post). There is a Tweet button on every published story.

Some more recently added features to the stories are that there is an option to take a saved story and then re-tell a different story from the same photos. At one time I had rigged a pseudo embed code, but it seemed like a lot of extra horsepower, so instead, I created a cut and paste HTML version of the story which can then be used (and styled) in your own site

Another new feature, added out fo my own curiosity, was from a finished story, if you hover over a photo, there is a link to see all other stories that use the same photo. For this photo of my old pup, Cadu, is found on the story THE BEACH— and following Cadu’s link, you can find there are 26 stories that use the same photo:

The site can handle multiple tags, so you can use it as a hub to house different flickr tag sets, for example, I made one for use by the ds106 class. In the past, I would have a link to the url that shows all the tagged photos on flickr, e.g. http://flickr.com/photos/tags/ds106. However, because the fetching of images in batched (actually no photos are copies, all the site does is add to the database all fo te data needed to reconstruct urls to flickr images or the account of the person who created it).

This new feature is a way to show all of the photos that are available for each tag on the site, such as the ones for ds106

The other big addition is a new admin interface for those that run sites off of the freely available code. I had hangups for a while with the way the scripts would regularly fetch image data from flickr. I was a bit paranoid about not overly pounding the flickr API, so I tried to have traps to keep the script from hitting it more than once an hour, but with url paramaters to override it. It was ugly.

In the new version, there is a simple script to do calls to the flickr API. I leave it to site owners to set it up so their cron scripts to it on a respectful basis (mine is once an hour), and there is an admin tool for doing manual overrides.

The admin URL is password protected, but looks like:

The site provides a dashboard view of all tags set up, and displays the numbers of stories and photos for each. Below this is a menu, where you can select which tag to check flickr for new photos.

The thing about the API is you can access the most recent 100 photos, which was a problem if people went back top their old photos to add a tag. But there is an avenue via the API for a maximum date, so now you can back fetch older photos, if you enter a date, like “January 31, 2011”, and the script will look for the 100 photos with your tag before that date.

It seems to be working well so far in one day of testing, but I am most eager to see if others can get my code running on their own servers. You can find it again on a Google Code site