App Redesign: Dark Horse Comics

Image for post
Image for post

I remember flipping through well crafted images, trying to emulate some of the drawing styles I’d see in comics and manga books as a kid. It’s only natural that I extend a big thanks to the graphic novel section at my public library for not only providing me hours of entertainment, but in helping me and so many children growing up to develop a sense of creativity and wonder. After a long hiatus from graphic novels, I decided to return through my interest in the animated series The Avatar: The Last Airbender. I was stoked to find out that there was an extended story by the same writers of the show available as a graphic novel, published by Dark Horse Comics. With no hesitation, I hopped onto the website to try to find out how I could get right into the story.

Observing the transition from Blockbuster to Netflix, novels onto Audible, mp3’s onto Spotify, it came as a surprise to see that the graphic novel space has barely evolved to function in the world of digital assets. With the amount of effort artists go through to shape and finesse their work, it’s a shame that they don’t have a platform worthy of showcasing their work in a way that feels as effortless and delightful as a flip of a page.

The current experience

The journey through Dark Horse’s digital experience left me with lots to be desired. As a consumer, this process should be as exciting as digging through the numbered bookstore aisles and sorting out exactly where the item should be. I’m ready to spend money on the first part of this comic series but it’s hard to know where to look. The assortment of titles have no logical order or categorisation, and after a wikipedia search of what order each chapter comes in within this series, I finally find the item I am looking for stashed underneath what looks like an un-clickable link at the bottom of the page, and behind so many buttons and collapsible sections. I purchase the book (without realising it’s not in my home currency of AUD, but USD), from a page redirect to which felt more than a little dodgy. When it came to the experience of actually consuming the product, skipping from frame to frame and reading text on my mobile device gave me a solid headache.

From my very brief encounter with this experience, I’m already seeing so many opportunities for Dark Horse to lift up their game in the UX realm. I could spend ages on solutions but I’ll time box this challenge to just 4 days of work and see what I can come up with.

The UX Challenge

Let’s set some parameters to work with:

  • 4 Mindset Segmentations
  • 4 Critical assumptions
  • 4 main screen flows

All to answer the question:

How might we reduce friction and uplift Dark Horse’s mobile app experience?

4 Mindset Segmentations

Image for post
Image for post
The 4 segments of comic book readers

The audience targeted for this challenge are the readers that sit within the 4 mindset segmentations, which is an approach I have borrowed from Fjord. What I like about mindset segmentations as opposed to personas is that they allow for more of a spectral view of the consumer. Here, the scale slides from low structure to high structure, and narrow scope to wide scope. A user who sits on the low structure scale perhaps does not subscribe to reading comics in a particular order and skips through content when it gets a bit slow, whereas a user who sits on the high structure scale tends to read comics in their chronological order and enjoys taking their time with each title. The difference between narrow and wide scope consumers is mostly to do with the frequency and amount of reading done which relates to whether comic books are a long-term or short-term commitment for the user.

I have split the audience to the following segments and their needs

Chaotic Connoisseur

“ I’m an avid comic book reader looking for the next binge read, I need to be able to scan content quickly”

Collected Connoisseur

“A google search or in-app search will make it easy for me to find what I’m looking for”

Chaotic Casual

“I just want to explore and discover what’s right for me”

Collected Casual

“I am looking for something specific”

Critical Assumptions + Final Design

The needs of each mindset segmentation then inform the critical assumptions which will be made and have been explored in the accompanying designs.

Critical Assumption #1:

Image for post
Image for post
Critical Assumption #1: ‘For You’ and ‘My library’ to explore the idea of smart suggestions
  • Introducing a ‘For You’ page as the landing spot for relevant books based on readership, favourite Genres and other interesting content.
  • Navigating to the ‘My Library’ section will take you to current books in progress, as well as links to the next available book from the same series.

Critical Assumption #2:

Image for post
Image for post
Critical Assumption #2: ’Discover’ as social proof
  • Uplifting the ‘Discover’ Section of the app poses an opportunity to display a level of social proof
  • Displaying books in this format allows the beautiful artwork to play a larger role in telling a story and enticing users to preview or make a purchase
  • Less items within the navigation bar at the bottom, reduces the cognitive load on the user and shifts the attention to the content instead.

Critical Assumption #3

Image for post
Image for post
Critical Assumption #3: Example of how to use the reader
  • A quick tutorial about the available gestures in order to bring to light to app functionality features and the features of the book in focus.
  • Added to this, it would be fantastic to introduce new customers to an enticing subscription model to help customers justify spending money on a comic. To have to spend $7 USD on a single digital item as opposed to perhaps a $14 monthly subscription to have access to a whole library of books, would be a really interesting idea to explore.

Critical Assumption #4

Image for post
Image for post
Critical Assumption #4: Guided reader for easy scanning
  • The guided reader is already a feature of the current app, however, by improving how the reader is accessed and used will help users read the captions (which can be quite difficult due to how irregular the font is).
  • To be inclusive of audiences that have low vision, a high-contrast easily readable font could be swapped where there are speech bubbles.

There are many opportunities to explore in uplifting the experience not just within Dark Horse Comics, but also other comics publishing companies who are releasing content on digital platforms. From designing this experience, I can begin to understand why the comic book industry has been slow to catch on in the digital space. The same concerns that were had during the introduction of ebooks are pronounced when translating comic books onto screens. The tactile collectible quality that physical books have are lost during the process.

However, by making the experience available online as frictionless as possible can open up possibility for consumers all over the globe experience the joy of comics on the go, as well as provide younger audiences who are progressively more digitally native a chance to become avid comic book lovers too.

All images in the prototypes are courtesy of Dark Horse Comics

Written by

Design Generalist from Melbourne

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store