So, after running some successful ideation sessions and finding a perfect idea that addresses the pain points, now is the time to create some scenarios and storyboards to create a more complete design solution, communicate the interaction and user experience in a human-centered way. Scenarios and storyboards, both can be understood and practiced with people who do not specifically have a design or technical background.
A Scenario is a description of a possible, imagined, and projected sequence of events. A Storyboard is an illustrative representation of how the scenario unfolds. Scenarios are self-created, workable, and flexible scenes created to motivate "what if the user?" thoughts and storyboards are a visual representation of how the users will interact with the design solution.
Scenarios and storyboards are techniques that help to connect dots from the idea, to identify how will the idea work in the real world. They create a bridge to explain the user experience in a real situation through text and visual representations.
Importance of writing scenarios and creating storyboards
- They ensure that the idea is executable.
- Help to predict and synthesize user behavior.
- They describe the real circumstances in which the end product is likely to be used.
- It's easy to spot early errors.
- The visual representation facilitates a better presentation of the idea.
- Helps to bridge the gap between creative thinking and business thinking
- Both are team-based activities, hence encourage equal participation and contribution from designers and non-designers.
- While looking into a tangible verbal and visual portrayal of the design solution, it's difficult to get attached to the idea.
Let's now look into scenario writing and storyboard one after another, understand how each of them works, and understand the importance of both techniques to create a prototype.
A scenario could be described as logical and real circumstances created through words and text to understand how the design will work in the real world and how will the users react during their interaction with the product in a particular situation. It could also be described as a development of a story from the users' point of view.
As an example, a scenario could help to capture how would the identified user or a group of users use the website on a mobile device while making a purchase?
A more detailed scenario could be, Lily is new to the city, she is shopping at the orchid street, she is looking for a glass vase and is using the new app to locate stores nearby but she has a lot of shopping bags in hand. How can the features of the new app solve the problem for her?
It's Sunday afternoon, Lily is making a list of things that she needs to do before she starts her work from home routine on Monday morning. Lily works on a desktop. She has to get the groceries, meet her aunt Suzy, complete a presentation, and sleep on time. How will the app help her to complete her presentation on a mobile device since she is can't be home all day?
Specific scenarios like these help to outline particular areas for product functionality and describe the website and app interactions with the users and find out how your idea can make users' regular day better.
- Start the activity by dividing yourselves into pairs or small groups so that you create and write a story that everyone in the room understands.
- Create an understanding of the users and the context of the idea.
- Understand the empathy map from the first phase and the problem statement from the second phase of design thinking.
- Understand Who are the users?
- What circumstances do they live in?
- How is the idea of going to solve their problems?
- Identify scenarios from the daily activities of the users' life.
- Review and understand the defined scenario and the identified features of the end product.
- Use sticky notes to write down each activity that the user may take in a particular situation to reach the desired outcome.
- Focus on writing the efforts the users' will put, what will they think and how will they interact.
- Write one step at each sticky note and swap the steps to create a journey.
- Once each pair or group have completed writing about the interaction of the end product, features with the scenario — Present it one by one and discuss the whole scenario and outcomes with everyone.
- Let everyone ask questions, give reactions and feedback to each other.
- Combine the best possible journey into one scenario to take it to a next level and create storyboards.
- Repeat the same process of the scenario technique for each kind of interaction.
Just makes this as realistic as possible. Write it easy and avoid jargon, remember you are doing it from the users' point of view. To make a scenario more realistic and believable you can always act it out to find if your scenario is moving naturally while focusing on interaction rather than the interface.
The storyboards are a way to explore and illustrate scenarios visually. It can also be explained as a sequence of scenarios illustrated to explain, identify, and present the idea visually by understanding the user flow. They help identify a problem that may come later while prototyping, testing, and developing the idea.
The storyboards were originally developed and practiced by Disney Studios in the 1930s.
When Airbnb CEO Brian Chesky read Walt Disney’s biography, he discovered the storyboarding technique invented by Disney and his animators to create Snow White and the Seven Dwarfs. It was a light-bulb moment for Chesky, who immediately decided to adopt storyboarding to design the future of the Airbnb customer experience.
Airbnb is a very successful and inspirational example of how creating a storyboard can communicate an idea better, lead to result-driven design solutions, and understand the users' experience.
Storyboards allow us to understand deeper emotions associated with the idea, that the words can't alone explain. They don't depict the scenario as is but are a close depiction of a well-written scenario.
Hand sketching illustrations may sound a little scary but that's not the main goal of storyboards. It is the formulation, understanding, and the right depiction of the scenarios, That's why if the team responsible for creating storyboards weren't a part of the ideation and scenario sessions, make sure they know all about it before creating storyboards.
- The medium or stationery used in creating storyboards is a very personal choice and could vary from one designer to another.
- As base use sticky notes to draw they are great to rearrange, replace, and merge if required to swap from one storyboard to another or cut white sheets into equal panels and use double-sided tapes to stick them conveniently.
- Sketch the scenarios with emotions and scenes to create stories that connect.
- Carefully demonstrate users' reactions as they interact.
- Sketch each panel individually, but change panels when there is a change in the scene or there is a need to show a specific emotion that completes the story.
- Put the panels on a sheet leaving space for text.
- If you are not using sticky notes, don't stick the panels until the order of all the scenes is concrete.
- The text could be the same words as the scenario or an edited version to explain each illustrated scene.
- Once you have achieved a comic-bookish storyboard, review the storyboards with team, and consider the feedback.
- Revise, if needed go back and fix the scenes.
Storyboards are not necessary after all scenarios and ideation sessions and especially when everyone on the team has a clear understanding of the idea and the end result.
Saying what was said earlier — storyboards are not about great sketching skills, don't let that hold you from doing this very important exercise when there is a need to ensure better communication of design, understand users' more in detail and if you want to give a visually stunning presentation to the stakeholders.
Writing scenarios to Creating Storyboard is a form of low fidelity prototyping. Low fidelity prototypes are easy to create, visualize, and are inexpensive. Through these techniques, we gain an overall view of the product. In the next blog post, we will be explaining high fidelity prototyping to gain insights into the overall viability of the product while we have the idea and answers more defined. This phase helps to build a precise model of design aesthetics and functionality. As time-consuming as it may be but this process has the potential to show the real product.