Wednesday, June 26, 2013

The quantified Buffy

Every semester I give some advice on the final projects of one or two students at the Multimedia studies program of UOC, a virtual public University in Catalonia, Spain. This time I was lucky to work with Esteve Boix, who took my visualization class very seriously, and decided to specialize in that area. His project is titled Visualizing Buffy. Even if you are not a fan of the show it is based on (I've never watched it myself) the interactive is fun to navigate and explore.

For the project, Esteve learned the basics of d3 (before than I did!) thanks to Scott Murray's tutorials. On a side note, I have started reading Scott's Interactive Visualization for the Web, and it is terrific.

Esteve recorded the time each character spent on screen, and also the number of kills in each episode. He did it just for Season 1 —the data gathering was not a trivial effort,— although he's planning to update the site with the rest of the seasons in the future (he's also working on tweaking colors, labeling, fonts, etc.)

If you click on any of the episodes, you will see a screen like the one below, which offers a much more in-depth view of who participates in the action:


And if you don't like the timeline mode, you can always switch to the "compact" view, which lets you compare characters and locations. The locations button at the bottom of the graph is expandable. The bars can also be organized by affiliation, order of appearance, and total time on screen:


I'm always amazed at the creativity of many students. Here you have an older project, made by Pep Gassó. This one includes some nice 3D animations. To access the interactive directly, click here.