Empathy Through Storyboards: A UX Case Study
What is the purpose of a storyboard?
A storyboard is simply a means of storytelling, much like what is used when planning many forms of visual media such as movies, television, or comic books. It’s an illustrated telling of a character’s experience, and in the case of UX design the purpose is to influence and create a sense of empathy. UX design — User Experience Design — is the means of increasing user satisfaction, interaction and engagement with a product or service. So it comes as no surprise that it depends on human psychology and a great understanding of empathy.
Storyboards are a means of illustrating believable scenarios in which that feeling of empathy might be achieved. A detailed persona is used as the “protagonist” and their interaction with the products benefits is made clear throughout the storyboard. They typically have the same model as a story, with an introduction, a rising action, a climax and a denouement.
Melody
Melody is a music streaming service that is available through a web browser, PC or Mac applications, and most cellphones. It offers basic services for free, such as music streaming while connected to wifi, but the real benefits come from subscribing to Premium. By subscribing to Melody Premium, users get offline access to Melody’s expansive music library, ad-free listening, and the ability to create and share custom playlists. The goal of the storyboard was to encourage users to subscribe to premium by illustrating the benefits.
The Persona
In order for users to connect with the storyboard, we had to create a believable persona with realistic motives and desires. Our fictional persona is Chloe Shah, a 28-year old journalist and Yoga enthusiast. She is a casual music listener and enjoys the ease of music streaming that Melody provides; she primarily listens to pre-made playlists. She uses her laptop for work and always has her phone nearby to connect with friends, family and work.
Chloe represents the average casual listener. She is no music aficionado and her enjoyment comes from the ease of using Melody and having music available whenever she needs it.
The Process
Step 1 — Brainstorming
The initial step was to simply brainstorm any and all situations in which our persona, Chloe, would feel inclined to subscribe to Melody. Inspiration came from real and fictional experiences, and no idea was disregarded.
Step 2 — Building Scenarios
Our next step was to narrow down our brainstorming to three believable scenarios. As a team, we decided on which were most realistic, entertaining, and empathetic. The scenarios were written on post-it notes with one action/instance per post-it.
Step 3 — Storyboard
Once a single scenario was finalized and agreed upon, it was illustrated into a storyboard for better clarity. Since Chloe is a Yoga enthusiast, we thought a scenario in which she was annoyed by the advertisements during her yoga session would both be believable and relatable for users. In the end, she would feel inclined to subscribe to Melody to continue listening ad-free.
Step 4 — Applying to Product
With what we learned from the storyboard, we could apply that knowledge to further UX design. With Chloe in mind, a landing page was created that is readable, accessible and appealing to a wide audience.
The Result
The hi-fidelity landing page prototype is meant to appeal to the average user. The central graphic is inspired by Chloe’s experience in the storyboard, but although it’s a yoga-centric illustration, it doesn’t ostracize the average user. The design is clean, readable and the subscription information is easily accessible. The mandatories that Melody provided were the logos, icons and the colour scheme. The illustration was made to be whimsical and motion-based and it coincides well with the calming cool tones of Melody’s colour scheme.
About the Author
Logan David is a Vancouver resident and a student of Capilano University. She’s in her second year of the IDEA Program, specializing in illustration and UX design. In her free time, she enjoys writing, personal illustrations, and consuming all forms of fiction.
Instagram: SerinaKairu