A storyboard is basically a roadmap for the product, it is a graphical representation of how the users journey will unfold. It is a simple flow made up of a number of sqaures with a short description below, with a start, middle and end.

Originally used in filmmaking, however it is equally as useful for UX design. Storyboards date right back to the 1930s, developed at the Walt Disney studio. Being a good visual artist is not what makes a good storyboard, it can be anything from rough sketches to comic books to computer generated drawings.

Untitled

Storyboarding is a different way of thinking when it comes to designing. It is a middle step between idea generation and wireframing. It is the step to help you understand the user and the context which the product will be used in. While UX storyboards is based off the basics of filmmaking storyboards, they can be very different. A film storyboard is all about communicating the camera angles and the feel of the scenes. While the purpose of UX storyboards is to consider and communicate a sequence of states rather than the specific visuals. Their aim is to demonstrate how someone would interacte with a potential product or service. The important aspects are the actions and emotions involved. They would be more similar to a comic strip than a film storyboard.

Storyboards can help turn a one-line concept descriptions into more detailed narrative. It will help people understand how users would use the product and what settings it would be found in. It is a quick process which improves the design process and subsquently the final product.

The steps of storyboarding…

  1. Create the establishing shot: the first image should be the establishing shot which shows where and when the story occurs.
  2. Introduce the main character and their conflict: the main character is the person who benefits from the product and the conflict is the problem the character has. The drawings should also show how the character is feeling.
  3. Create your ending: skip to the end and show what the outcome is, if everything went well? Again show how the character feels.
  4. Work backwards: fill in the blanks for the rest of the story, how did they get there?
  5. Revise: at this point the first draft is complete and look back and critise it. Where would the character make mistakes? Where can you reduce the effort? What feels unrealistic?
  6. Make your good copy: once it has been reviewed and revised, make a copy which will be shared with people outside of the design process. Even the simplest drawings can be effective.

Storyboards align well with other design process steps like empathy maps and user personas. Using these other tools will help in understanding the user and how they feel, act, think and do. This will then help you create a more authentic and realistic character who will use your product.