May 1, 2018
Case study: how I use Storyboards in a design process
Olga Shavrina
If you are like me you read a lot about methodologies and best practices such as journey maps, jobs to be done, personas etc. and all of them seem extremely useful. But have you ever felt confused you don't use all of them in your process? Have you ever think "Something must be wrong with me, I don't use the methodology X, I should try harder :( "?
The truth is all the people are different and designers also. Everybody has various talents and skills. One person can play a movie in his head, another is able to build a complex scheme, the third one easily formulates clear theses.
It means that different methods suit different people. So you don't need to feel guilty because you don't use any methodology and think you are not professional enough...pfft.
Say I don't use "Jobs to be done" approach though I know it's a useful thing. But I like storyboards and use them in practically all the projects.
The truth is all the people are different and designers also. Everybody has various talents and skills. One person can play a movie in his head, another is able to build a complex scheme, the third one easily formulates clear theses.
It means that different methods suit different people. So you don't need to feel guilty because you don't use any methodology and think you are not professional enough...pfft.
Say I don't use "Jobs to be done" approach though I know it's a useful thing. But I like storyboards and use them in practically all the projects.
What do I like about Storyboards
The main thing in storyboards – everybody can easily understand them. Comic books are so popular among kids (and not only kids :)) for a good reason. You can show a storyboard to developers to explain how a feature should work, you can discuss it with a boss or a client as well – everybody will get it easily.
The second advantage – your customer participates in a storyboard as a character. He faces difficulties, solves issues and reaches a happy ending (exactly, like in your favourite TV-series). It helps you to empathize with a customer and it is crucial for a designer.
The second advantage – your customer participates in a storyboard as a character. He faces difficulties, solves issues and reaches a happy ending (exactly, like in your favourite TV-series). It helps you to empathize with a customer and it is crucial for a designer.
You can read more about storyboards in a Nick Babich article
Let's look at the example
Task: we have a website with jokes published on it. They are uploaded from different resources to admin panel where admins categorise and rate them. Admin panel already exists and looks like this:
Admin panel for categorising and rating jokes
To make admins' life harder better team decided to add a gamification. Any admin (now there are 5 of them, this number can change but not dramatically) should be able to initiate one of the games: "Best joke", "Biggest groaner", "Most intellectual" or "Darkest joke".
After the game starts, each player gets 25 jokes and has to rate and categorise them. Then he has to select one joke that better fits the name of the game (e.g. most intellectual joke). When everybody finishes each player gets jokes opponents had selected to rate from 1 to 10 for how well they fit the name of a game. The joke with highest combined rating wins the game.
After the game starts, each player gets 25 jokes and has to rate and categorise them. Then he has to select one joke that better fits the name of the game (e.g. most intellectual joke). When everybody finishes each player gets jokes opponents had selected to rate from 1 to 10 for how well they fit the name of a game. The joke with highest combined rating wins the game.
Main points
I start with writing down main points of a task to view them later in order not to miss anything important.
Main points of a task
In the meantime user's scenario starts to come together in my head. Just in time because the next step – is drawing a storyboard. I use a paper notebook and a pencil because it's the fastest way. Somebody likes digital tools – why not, it's your choice.
Storyboard
On this stage I formulate main ideas and find insights:
1
I got an idea to use emoji to indicate a game. I use a smiley in glasses instead of "Most intellectual" header. First of all, it's shorter, secondly – it's fun (a second block from the left).
2
I found alternative branches. E.g. at some point a game initiator needs to be able to kill a game (right top block); a player can win or lose in a game (right bottom corner); a player can wait for others players during the process (second block in a bottom row).
3
I understood that the user needs to confirm the choice of a joke because he can hesitate, click different jokes, change his mind etc. (left bottom block).
4
I formulated what emotions should a customer have at each step and how I can support or vice versa smooth it with the interface. A player is joyful when he starts a game, a little bit frustrated when he has to kill it, impatient when waiting for others, happy when won and doesn't have to be too sad in case of loosing.
Compare with main points we've written above
Oops... I've missed a huge part. Have you noticed? Honestly ;) I skipped blocks where a customer rates jokes selected by other players. No problem just take a pencil and draw two more blocks... done.
There are only a few problems that can't be solved with a scotch tape © don't remember the movie
Prototype and a final design
And now we can move to a prototype. I almost always use a paper at least for first interface sketches.
Next step – paper prototype
What next – it depends. I build an interactive prototype in Balsamiq or Axure or make a final design in Sketch/Photoshop etc. Then test, improve, test again, improve... but it's a different story.
Visual design first iteration
What if I can't draw?
And I can't dance a jig. Great news that neither of these skills is required for storyboarding, right?
Any kindergarten alumn can draw such things:
Any kindergarten alumn can draw such things:
And basically, you need nothing else for a proper storyboard.
Summary
Storyboard – is not a must-have tool, somebody likes it, others – not. If you've read the whole article, it looks like you are interested in the topic, so you may love storyboards. Try to draw them yourself – it's easier than it looks and can give a great impact to your project. And I will be glad to add some fun to your serious work :)
Olga Shavrina
Product manager. Human being