All of my online comics start with a challenge - to use the tools available to an online reader to navigate through a piece in way that they couldn't in print. With the first interactive comic I did for Cartoon Movement, the Nisoor Square shootings, this was to represent space in a way that allowed various contrasting testimonies to be represented simultaneously. The map of Nisoor square, Baghdad, was a good canvas to ground the action in, and elements' movements around the said canvas was controlled by the timeline. Having focused on physical space as the foundation of that piece, I wanted to flip things to focus on time instead. What I mean by this is to look at the traditional framework of a historical timeline - linear, chronological and one-way - and make it more malleable.

When you tell a story, rare is the occasion when you can get from beginning to end without pausing at various points to add additional, tangential information. This not only enriches the listener's experience, but adds context and important supplementary detail. Without such tangents, stories run the risk of sounding like a causal shopping list of event: x happened, then y happened after it, then z, etc. My goal was to let the user control where they chose to seek out the supplementary information, as well as forcing them to navigate from panel to panel using the cursors. You'll have noticed I'm not a big fan of only having the scroll bar as the driving wheel for steering through a piece.

Looking at different ways of scrolling through a comic, it seemed odd to me that in the transition to a digital platform, comics would be consumed by readers in the same way. I still work in print (despite the apocalyptic technophile naysayers), and appreciate the power of a page turn as one of the most dramatic beats we can use. But there's no reason we should be bound by the same constraints when we switch to a different medium -for the same reason we shouldn't feel locked into the standard book portrait layout. Bearing this in mind, I looked at the most tried and tested (although arguably not celebrated for being compelling) format for showing images in sequence: the slideshow.

The first iteration was a simple hack with a scrollbar, presenting the pictures in a very similar way that Apple does with its coverflow design for iTunes. Credit is due to Finn Rudolph, a developer whose freeware work provided a decent springboard. However, it was largely just an aesthetic improvement that offered little benefit to the reading experience (although multiple older non-comics readers told me it was much easier to follow, interestingly). For the second version, therefore, I introduced the tangential element by way of a small arrow that prompted users to scroll along a vertical axis in addition to a horizontal one. I also added a link to a pop-up window (click on the hand-drawn map of Afghanistan in the link above), but it needed a clearer call to action. Something was missing - a way to ensure users didn't get lost in the dual axis map of panels I'd put together, that also clearly delineated when there was and wasn't additional content for them to dig down into.

Third time was indeed a charm, as I extrapolated the feedback I'd had from the previous two versions and pasted them into a flatter layout that didn't distort the size of the panels (which, after reflection, seemed gimmicky to me anyway). Crucially, I also added a replica numerical mini map at the bottom of the page to give readers a navigational crutch so they could see where the additional content one (as mentioned earlier) as well as work out how far into the story they were. It also allowed me to add a background to tie all the content together thematically. I'm pleased with the fluidity of the scroll, as well as the use of opacity to highlight the central panel (a build on the hierarchical stacked layout from earlier versions). As any good developer knows though, there's never a final version, just more improved betas, so expect a few tweaks in the follow-up that will include videos, hyperlinks and – of course – pop ups.