Web
			Analytics
The What, Why, & When of Storyboarding in UX Design - Sabrina Hall

The What, Why, & When of Storyboarding in UX Design

by Sabrina Hall

Abstract art for What and Why as the title.

Originally published at Adobe XD on March 5th, 2020.


As a designer, part of my role is to clearly understand how people are going to use a product I am working on. Identifying the needs of the users through visual communications tools such as a UX storyboard can bring greater insight into what the user experience should be.

Storyboarding is a way to explore these scenarios visually, creating an experience for the entire team, and a way to illustrate expectations. Through these storyboards teams learn more about personas, problems they are trying to solve, and highlight questions that stakeholders might have earlier in the process. Through various types of user research, a UX design team will partner with visual designers, content creators, engineers, and stakeholders to ensure that the common goal is understood. Read on to learn more about storyboards, why they’re important, and when to use them.

What is a storyboard?

A storyboard is a way of graphically organizing a story that shows a sequence of events presented visually. They are meant to tell a story and illustrate the process and experience of an event. It’s a concept credited to Walt Disney studios in the 1930s which they used to visualize the sequence of a plot. Applied to UX, storyboarding allows us to walk through the user journey, similar to experience mapping where we uncover insights about the different scenarios in which users may find themselves interacting with our product/design.

Below is an example storyboard from Disney’s Moana. This section of the storyboard illustrates an action sequence from the film in which the Kakamora are trying to steal the Heart of Te Fiti from Moana and Maui. In these sketches we see the beginning of the scene, the challenge the character faces, and how they are trying to get through it. The loose style of sketching with some color exemplifies how one can illustrate a scenario with a scene. The frames are all equal in size walking you through the scene in a consistent manner and they present the problem the character is trying to solve — getting to the Heart of Te Fiti.

A storyboard that illustrates an action sequence from the film Moana, in which the Kakamora are trying to steal the Heart of Te Fiti.
These storyboards illustrate an action sequence from the film in which the Kakamora are trying to steal the Heart of Te Fiti from Moana and Maui. Artist: Sunmee Joh, Story Artist. Image credit Disney Fandom.

Storyboarding in UX design can start with a template that entails the persona, the scenario, and captions. According to the Nielsen Norman Group, “The persona or role that corresponds to that scenario is clearly specified at the top of the storyboard. The steps can be sketches, illustrations, or photos. Depending on the purpose of the storyboard and on its audience, these images can be quick, low-fidelity sketches or elaborate drawings. The caption describes the user’s actions, environment, emotional state, device, and so on. Because the image is the primary content in a storyboard, captions are concise and don’t typically exceed two bullet points.”

A blank UX storyboard template by NN.
 Storyboard Template. Image credit Nielsen Norman Group.

Why use a storyboard?

There are many ways to tell a story. The impact of showing a user persona as they walk through the experience is a way to understand and have more context. For example, if one of our personas is Tracy — a teacher who needs to find a new article for their students — a storyboard helps to build out what that experience is like for them. We may sketch out their experience in the context of the classroom. It may show Tracy at the beginning of their day, frustrated, looking to find a particular article for their students. “Can they accomplish this task? What is that experience like for them?” A storyboard is a way to communicate and does not have to focus on illustration as a skill set. Instead, it helps to focus on what the priorities are for users.

Storyboards in UX design are engaging even with minimal sketches, and they are flexible. They can be erased, drawn over, made in pencil and modified, as they are not finite in form. A storyboard in UX will help create insight into the user’s experience and should be made with a goal in mind for the team.

In UX design, storyboards help to filter out the questions we are not asking, and to think about what might be missing from our flow. This is done by walking through the storyboard and reviewing it in a team setting. Does the entire team have the user’s goal in mind? Storyboarding brings about clarity when a team is in the process of working in shorter sprints or being built by various individuals at once in a collaborative setting.

Important aspects of storyboarding include:

  • Setting the scene and the environment the character is in. For example, Tracy in the classroom, morning time, with a few students in the space.
  • The user persona. Who are they and what are some of their pain points? Include emotions in the process.
  • Identify the goal. What is the problem they are trying to solve and how do they get there?
  • Narrative arch. A storyboard is a story — make sure to include a beginning, middle, and end.

When to storyboard

Storyboarding earlier on is the design process is a good way to ensure the user needs are being considered. Storyboarding is also a way to ensure that you are building an accessible experience when inclusive design is a part of the goal. It’s done early on to gather insights from the team to see if everyone is striving towards the same goal. Storyboarding creates a way to collaborate across teams, including a chance for deeper understanding and feedback from all stakeholders.

As teams continue to collaborate and find new solutions for our users, storyboards are a way to keep everyone’s vision aligned, and ensure that the team is thinking about the user experience.

Storyboarding creates visuals for content creators and helps clarify the experience of the user. It provides a narrative reflective of the user and adds a bit more of the human experience to the equation when sketching out stages of an interaction. Every bit that we can do to continue understanding who is using our products, and who they should be made for leads to a better experience for all.