10 Things You Need to Know About UX Storyboarding
UX storyboarding explained.
Preparation is the key to success. So how do you prepare for the best outcome in user experience design?
One word: Storyboarding. 🙌🏾
If 5 AM runs are to race day PRs, then storyboarding is to successful, human-centered UX design.
Here are ten things you should know about UX storyboarding, from origins to best practices.
Table of Contents
- Walt Disney first used storyboards to map animated cartoons and movies.
- Storyboarding is a practice used in multiple creative professions.
- UX storyboarding is a visual representation of the user experience.
- UX storyboarding is based on UX research.
- A storyboard is NOT the same as a journey map.
- You don’t need to be an artist to storyboard.
- You do need storytelling capabilities.
- Storyboarding is one part of the design thinking process.
- Storyboarding is helpful but not necessary.
- Storyboarding is a collaborative process.
Is Tech Right For you? Take Our 3-Minute Quiz!
You Will Learn: If a career in tech is right for you What tech careers fit your strengths What skills you need to reach your goals
1. Walt Disney first used storyboards to map animated cartoons and movies.
All hail and all credit to Walt Disney Productions for developing the storyboarding process (in the 1930s!) that many designers use today. The inspiration for storyboards evolved from comic panels. The first storyboard created with this modern twist on panels was the 1933 Disney film Three Little Pigs.
Storyboarding is effectively a nearly 90-year old tool developed by one of the largest mass media companies in the world. In other words, if it’s good enough for Walt Disney Productions, it’s good enough for me.
2. Storyboarding is a practice used in multiple creative professions.
Legendary Walt Disney roots aside, modern storyboards are used far beyond the cinema and entertainment industry.
Product designers, video game designers, entrepreneurs, and UI designers across industries use storyboards to better understand the user and achieve the final product. Yes, everyone’s board (or interpretation of Disney’s board) will differ, but they all serve similar purposes.
3. UX storyboarding is a visual representation of the user experience.
A UX storyboard is a UX mapping method that illustrates and explores a user’s interaction with a product. In this case, the digital product is a web application, and the storyboard illustrates how a user might use the website.
A UX storyboard also predicts challenges that a person might encounter. The storyboard is an effort to empathize with the end user and create a better human-centered design that removes user pain points.
Your understanding of your consumer is crucial to creating an accurate storyboard.
4. UX storyboarding is based on UX research.
Before you break out colored pencils and printer paper, understand that UX storyboards are based on user research findings, not your assumptions about the user.
Designers collect UX research through a variety of methods — site metrics, usability tests, and user interviews. At the end of the day, the research should give you a holistic understanding of your user persona’s lived experience. This information informs how a user may interact with your website and allows you to create a realistic board.
5. A storyboard is NOT the same as a journey map.
Storyboarding and journey mapping — what’s the difference?!
A customer journey map (CJM) is a UX mapping method (there are four mapping methods!). A CJM documents a user’s experience accomplishing a specific goal, like purchasing a product or booking a service. A journey map is more detailed than a storyboard, as it includes textual information such as the user’s mental and emotional state at different stages of the customer journey.
A storyboard is an illustration of a sequence of events best used in the early stages of UX design. Unlike a journey map, a storyboard is an informal document that changes throughout the duration of a project as new information is acquired.
💡Think of it this way: Storyboards are to bar napkin sketches, as journey maps are to the presentation you show your boss. Each UX mapping method serves a purpose in the UX design process, so don’t discount either.
Is Tech Right For you? Take Our 3-Minute Quiz!
You Will Learn: If a career in tech is right for you What tech careers fit your strengths What skills you need to reach your goals
6. You don’t need to be an artist to storyboard.
Source: Nielsen Norman Group
Despite Disney developing storyboards, you DO NOT need a graphic design or visual design background to create a UX storyboard. In fact, you can sketch a board with stick figures on sticky notes if that’s the extent of your artistic abilities. You only need three components — a scenario, visuals, and corresponding captions.
- The scenario sets the scene for your storyboard.
- Visuals, while not professional-grade, should be discernible enough to communicate to stakeholders
- For the artistically-challenged, corresponding captions support your images detailing what your images can’t.
💡Think of it this way: UX designers should prioritize usability and web accessibility; likewise, designers should focus primarily on a storyboard’s message, not aesthetics. Leave AP Art in high school and laugh your way through poorly drawn scenes.
7. You do need storytelling capabilities.
We all know at least one person who drones on for untold amounts of time. Don’t be that person, especially in your team ideation meeting.
You don’t need art skills, but you will need to know how to tell a compelling story. You’ll need:
- A setting. Where is your story taking place? Is the user using a desktop computer, tablet, or smartphone?
- A character or user persona. What is your persona’s background? Challenges? Motivations?
- A goal. What is the user’s goal? How do they get from point A to point B?
- A narrative arc or plot. What’s the beginning, middle, and end?
While we’re at it, your storyboard should be:
- Specific: Don’t lose the plot! Create multiple boards if needed.
- Emotional: The name of the game is empathy.
- Realistic: Yes, you’ll tell a story, but it needs to reflect the real world. Tap into your user persona to write a realistic story.
📌 Related: Website Wireframe 101: The Essential Guide To Creating A Website Blueprint
8. Storyboarding is one part of the design thinking process.
Storyboarding is only one part of the five-phase design thinking process.
Design thinking is “a non-linear, iterative process that teams use to understand users, challenge assumptions, redefine problems and create innovative solutions to prototype and test,” according to Interaction Design Foundation.
The five phases are empathize, define, ideate, prototype, and test. What phase do you think storyboarding covers? We’ll wait. 🙂
If you guessed ideate, this gold star is for you. 🌟
9. Storyboarding is helpful but not necessary.
You do not have to sketch a UX storyboard. *Gasp* You can complete a UX project without taking this extra step. That said, storyboarding can be a helpful tool to bring your final design to life. Here’s how:
- Storyboarding organizes your jumbled ideas into accessible concepts that are easily communicated to team members.
- The point of UX design is to create human-centered web applications. Nonetheless, your UX research is probably filed away in a document or spreadsheet, dehumanizing the processes. Visualizing the user’s challenges allows for a more thoughtful, user-centered design.
Storyboarding is a good practice (especially for new UX designers) if you have a limited understanding of the user, you need a different medium to visualize your design, or your team needs to align on the project.
💡Think of it this way: You don’t need to know your way around a table saw to know this adage: measure twice, cut once. Storyboarding is a part of a greater iterative process, but aligning on the goal of one idea will help the team come to one understanding, test, and iterate accordingly.
10. Storyboarding is a collaborative effort.
We get it — storyboarding can feel like a fun art project, but it’s a tool that one or more stakeholders should use to align on a project. Sure, you can hole up and create a comic-like board worthy of a book deal, but that simply isn’t the goal of this practice.
Aligning on the project’s goal is the primary goal of storyboarding. Consequently, your project’s stakeholders may come from a variety of backgrounds – UI designers, web developers, front end developers, and back end developers. Each stakeholder has their own ideas on how to roll out the project. This is not the way to go unless you like chaos and have an unlimited budget.
💡Think of it this way: Storyboarding is a team-building project, not a talent show where everyone presents their interpretation of the project’s theme. Gather around a conference table and get to ideating.
Storyboarding is just the tipping point into the world of UX design. If you’re new to tech or interested in UX design, consider dipping your toes into tech with the free coding camp, Camp Skillcrush. You’ll learn coding basics and answer the big question: is a career in tech right for you? Hint: You can — tech is for everyone.
Is Tech Right For you? Take Our 3-Minute Quiz!
You Will Learn: If a career in tech is right for you What tech careers fit your strengths What skills you need to reach your goals
