Learning from webcomics, motion comics & infinite canvas

Mysterious Path will be a hypercomic and therefore must confront two major design challenges. One will be to figure out how a reader will meaningfully interact with the game narrative, the second will be finding an interesting and appropriate way to present it's comic book format on the screen. This post regards the latter challenge.

Reading comics on digital platforms has been approached in various ways, which solutions will provide design insight for Mysterious Path?

The printed comic book format is not a natural fit for the computer screen. Pages are projected on to a medium they were not originally created for. As digital distribution and consumption of comics increases surely creative solutions and adaptations have been necessary to enhance the screen reading experience?

My research is certainly not exhaustive so please excuse omissions and generalisations (Let me know if you found any interesting stuff, like Marvel Infinite or Visual Novels)

Let's begin...

Webcomics - a new distribution channel

The webcomic has allowed creators to reach a mass audience without the need for formal publishing, essentially providing them with a free distribution channel. Comic creators can broadcast directly to their audience via the ubiquitous web technology. No print costs, no shipping, just straight to screen. Awareness remains the only hurdle for creators to grow their own audience (and social media has the potential to plug that gap).

Despite their name, 'webcomics' seem to have more in common with their print cousins when it comes to format (there are of course notable exceptions e.g. Worm World Saga). The reason for this I believe is two fold. Firstly, traditionally schooled comic creators are primarily concerned with telling their story and are not focused (or interested in) inventing new digital formats. Secondly, their ultimate goal is for their comic to get printed, and therefore the creation of 'ready to go' artwork makes a lot of sense (Help a fund a web to print comic here!). The majority of webcomics therefore fail to seize the creative opportunities the web offers.

Adhering to a print-friendly portrait format is at odds with a monitor's landscape aspect ratio (although handheld devices are now enabling both). Therefore presenting the comic at a legible size means that scrolling is now required to see the page in its entirety. Comic pages are designed to be viewed both as sequences and complete compositions, thus scrolling is not ideal. How can we improve this sub-optimal reading experience?

Guided view™ - a sticky plaster for reading on screen

The comic industry will continue to focus on delivering print comics first. After all, change would disrupt entrenched creative processes and threaten existing revenues. While in a state of transition, from analog to digital, the big players will simply avoid any significant risk.

Enter Comixology and their Guided View technology. This enables print comics to be prepped for the screen with a simple additional process. Pages are 'tagged' which enables the reader to zoom into panels and then simply click to be guided through to the next panel in the sequence. This approach allows the artwork to be displayed at a legible size, even on small screen devices, and any potential disorientation from experiencing a partial view of the page is resolved by the guided navigation which ensures the intended flow of the narrative is preserved.

Problem solved? not quite. Guided View has its critics and certainly feels akin to palliative rather than preventative medicine. It's certainly not a reinvention of the art form.

Motion comics - animating the static page

Others have taken greater steps to enhance the comic experience for screen. The motion comic animates individual panels and automatically plays through action sequences.

At first glance adding animation and sound to digital comics seems like a logical enhancement. Computers are good at this stuff after all.

Unfortunately, like Guided View, the majority of motion comics are created by applying a post-process to existing print artwork. Characters and scenes are animated like paper cut outs, often with incredibly poor results, especially when compared to a genuine animated experience.

Even when skilled animators create original assets for motion comics (e.g  Bottom of the Ninth) something feels wrong. Motion comics fundamentally transform the reading experience from active (the reader decodes and interprets) to passive (the reader sits back and is spoon feed). This is an erosion of one of the core principles of comic, how they depict time.

Maybe I'm judging them harshly but, for me, motion comics feel like a creative wrong turn.

The Infinite Canvas - the page is dead, long live the canvas

Over 10 years ago Scott McCloud deconstructed the comic and proposed a blueprint for their digital future (Watch his TED talk now!).

For me, the most powerful idea was the liberation of individual panels from the constraints of the page. He called it the Infinite Canvas (Meanwhile is a great example of this - even though it did start life as a printed comic)

Today the proliferation of screen sizes and resolutions affects any business that needs to present its content digitally. With this very issue in mind website design has championed solutions such liquid layouts, responsive design principles and small screen first thinking. Good websites (even this blog template!) now render smartly on both mobile screens and monitors by following a set of encoded display rules. Textbooks have also begun the evolution from print to screen, epub files allow text to flow freely to fill any screen size. Words are no longer confined to a specific page. Yet comics still lag behind and the promise of the Infinite Canvas remains largely unfulfilled.

My earlier thinking embraced McCloud's ideas, but my prototyping has revealed both technical and design challenges. To crack this nut creatives and technologists will need to work together.

What does this mean for Mysterious path?

OK, so what have I learned from all this? While not finding an off-the-shelf solution for Mysterious Path I have clarified some key design principles I intend to adhere to:

1. Digital presentation will drive the design process of my hypercomic, it will not be restricted in scope by the limitations of print.

2. The comic will need to flex to accommodate multiple screens sizes (although I may focus on one size/device initially to make prototyping easier).

3. As an interactive/game experience the comic will need to know which panel is in focus in order to trigger related interactive events (e.g to reduce hit points during battle or acknowledge the acquisition of a new item)

4. Users should determine the pace of the reading experience and not be made to 'watch' the action unfold.

Although most of what I've seen can not be directly applied to my project there are guiding lights. Operation Ajax, an iPad app, successfully choreographs the reading experience on screen. The layout morphs to accommodate the arrival of new panels and, when used well, actually helps to reinforce the contents meaning. There is still a loose concept of page and there are occasional motion comic moments but overall it successfully retains the feel of a comic yet is delivers its content in a way that is unique to digital media. This is the sweet spot, and I'm sure there are many more examples out there.

Finally to sum up in words better than my own...

The control which designers know in the print medium, and often desire in the web medium, is simply a function of the limitation of the printed page. We should embrace the fact that the web doesn’t have the same constraints, and design for this flexibility. But first, we must “accept the ebb and flow of things.”  

John Allsopp, “A Dao of Web Design”