Storyboard
Definition
A storyboard is a sequence of illustrations or images representing key moments in a user's experience with a product or service. Originating in film and animation, storyboards have been adopted in UX design as a method to visually communicate user scenarios, map interactions, and align teams around a shared understanding of the user journey.
Purpose and Benefits
Storyboards serve several key purposes in the design process:
- Visualizing User Journeys: Making abstract user flows tangible and relatable
- Building Empathy: Creating a narrative around users and their contexts
- Communicating Concepts: Explaining ideas to stakeholders without requiring technical understanding
- Identifying Pain Points: Uncovering issues in the user experience by walking through it step by step
- Aligning Teams: Creating a shared vision of how users interact with a product
- Focusing on Context: Illustrating when, where, and why users engage with products
- Validating Concepts: Testing scenarios with users before significant investment
Types of Storyboards
Different types of storyboards serve various purposes in the design process:
- Concept Storyboards: High-level narratives that explore a product concept or value proposition
- User Journey Storyboards: Detailed views of a user's end-to-end experience with a product
- Task-Focused Storyboards: Specific illustrations of how users complete particular tasks
- Emotional Journey Storyboards: Emphasis on user feelings and reactions throughout an experience
- Day-in-the-Life Storyboards: Broader context showing how a product fits into a user's daily activities
- Before-and-After Storyboards: Contrasting current experiences with proposed solutions
Elements of Effective Storyboards
Well-crafted storyboards typically include several key components:
- Characters: Representations of users with relevant characteristics
- Setting: Physical and social context where the interaction occurs
- Sequence: Chronological progression of events
- Narrative: The underlying story connecting the frames
- Actions: What users are doing in each frame
- Thoughts/Emotions: What users are thinking or feeling (often in speech bubbles)
- Pain Points: Challenges or friction in the experience
- UI Elements: Simplified representations of interface elements when relevant
- Captions: Brief explanations of what's happening in each frame
Creating a Storyboard
The process of storyboarding typically involves these steps:
- Define the Scenario: Determine which user experience to illustrate
- Identify Key Moments: Select the important points in the journey to visualize
- Sketch Frames: Create simple drawings for each key moment (artistic skill is less important than clarity)
- Add Context: Include environmental details and emotional states
- Review and Refine: Gather feedback and improve the storyboard
- Share and Discuss: Use the storyboard to facilitate conversation about the user experience
Storyboarding Techniques
Various approaches can be used to create effective storyboards:
- Sketching: Hand-drawn illustrations on paper or whiteboard
- Digital Tools: Specialized software or general illustration applications
- Photo-Based: Using photographs instead of illustrations
- Template-Based: Using pre-made templates with standard layouts
- Collaborative Storyboarding: Team sessions where multiple people contribute
- Sticky Note Storyboards: Flexible approach using repositionable notes
Storyboards vs. Other UX Methods
While complementary to other UX techniques, storyboards have distinct characteristics:
- Storyboards vs. User Flows: Storyboards add context and emotion beyond the functional steps shown in user flows
- Storyboards vs. Wireframes: Storyboards focus on the narrative and context rather than UI specifics
- Storyboards vs. Journey Maps: Storyboards are more visually oriented and often less detailed than comprehensive journey maps
- Storyboards vs. Prototypes: Storyboards illustrate the concept and context while prototypes demonstrate the functionality
When to Use Storyboards
Storyboarding is particularly valuable at certain points in the design process:
- Early Ideation: Exploring concepts before significant investment
- Stakeholder Communication: Explaining concepts to non-technical audiences
- Cross-Functional Alignment: Creating shared understanding across teams
- User Testing Preparation: Setting up scenarios for evaluation
- Marketing and Promotion: Communicating value propositions to potential users
Through visual storytelling, storyboards bridge the gap between abstract concepts and concrete user experiences, helping teams design products and services that truly meet user needs within their actual contexts of use.