storytelling for ux workshop

58
Storytelling for User Experience A half-day workshop Whitney Quesenbery WQusability @whitneyq

Upload: whitney-quesenbery-and-kevin-brooks

Post on 17-Aug-2014

6.745 views

Category:

Design


8 download

DESCRIPTION

Slides from the half-day workshop on using stories in user experience from UXLX

TRANSCRIPT

Page 1: Storytelling for UX Workshop

Storytellingfor User ExperienceA half-day workshop

Whitney QuesenberyWQusability@whitneyq

Page 2: Storytelling for UX Workshop

Hi! User researcher Theatre designer Storytelling as a way to understand user,

culture, and context in UX design

Researcher in new UI technologies Performance storyteller Storytelling as a pivotal part of the creation,

performance, and design process.

How about you?

Page 3: Storytelling for UX Workshop

Stories  connect  us

Stories  make  UX  personal.  They  remind  us  that  everything  we  make  is  made  for  a  real  person.  

@ianeverdell

Page 4: Storytelling for UX Workshop

4

We all tell stories

You already know what a story is…

...but you may not know how to use stories effectively in your work.

Page 5: Storytelling for UX Workshop

5

Claude Shannon was wrong*

Stories are not a broadcast transmission. **

* At least about stories.

** Both of these pictures are wrong

Page 6: Storytelling for UX Workshop

6

Stories create relationships

FIGURE 2-2

Storyteller Audience

Story

Page 7: Storytelling for UX Workshop

7

A story is shared by everyone who hears it

First the storyteller shapes the story

As they listen, the audience members form an image of the story in their own minds.

Page 8: Storytelling for UX Workshop

8

The audience is part of the storyThe storyteller and the audience affect each other and shape the story they create.

The most important relationship is between the audience and the story.

Page 9: Storytelling for UX Workshop

9

Stories close a gap

FIGURE 4-1

UX person

Our colleagues(audience)

User

Story as collected

Story as re-told

When you retell a story, you make a connection between your colleagues and the person you heard the story from.

Page 10: Storytelling for UX Workshop

10

Stories communicate efficiently

What can we learn about Tanner from this short story?

Tanner was deep into a Skatepunkz game—all the way up to level 12—when he got a buddy message from his friend, Steve, with a question about his homework.

He looked up with a start. Almost bedtime and his homework was still not done. Mom or Dad would be in any minute.

Page 11: Storytelling for UX Workshop

Storytelling  in  UX

A  good  story  will  evoke  emo>on.  We  humans  remember  emo>ons  best.  

@mike_me_up

Page 12: Storytelling for UX Workshop

12

Success?

Storytelling is already part of UX

Specify

Understand

Design

Evaluate

Finding themes and patterns is the first step in identifying requirements

Design tells a new story that changes something about the world

Usability evaluation is a way of trying the story out to see if it works for other people, too.

Collecting stories helps us understand people and goals, context....

Page 13: Storytelling for UX Workshop

13

Storytelling is already part of UX…

We just don’t call them stories

Specify

Understand

Design

Evaluate

User researchEthnographyContextual inquirySite visits

PersonasAffinity analysis

Card sorting

ScenariosStoryboardsWireframesPrototypes

Usability TestingWalk-throughsAnalytics

Stories we share through the user experience

Page 14: Storytelling for UX Workshop

Stories have many purposes in UX

Meeting the users

Illustrating user needs

Points of pain

Brainstorming

Success stories

Design exploration

Evaluation task

14

Page 15: Storytelling for UX Workshop

Stories  start  with  listening

Storytelling  is  a  two-­‐way  mirror.  You  see  yourself  reflected  in  the  experience  of  others.

@nathangibbs

Page 16: Storytelling for UX Workshop

16

Each person hears a story in their own way

…After the show, Jane couldn’t decide

whether to take a taxi or a bus across town…She really

didn’t want to miss the 10:45pm train…

I bet she doesn’t want to miss it. On my line, there’s only one train after 9pm.

Miss that, and you’re sleeping in the station.

What’s her rush? London trains run well

into the evening, even if there are only 2 an hour

If it was easy to get info about the next bus, she would not

have to worry.

FIGURE 2-6

Page 17: Storytelling for UX Workshop

17

Listening Exercise

Two roles: listener and speakerDecide who will go first.

Speaker’s job - tell the other person about something (we’ll tell you what)

Listener’s job - just listen. Don’t have to talk, interrupt or fill silences

Tell the other person about a time when everything seemed to go right... or wrong.

Page 18: Storytelling for UX Workshop

Be an active listener Show that you are aware of the other person

Be quiet. Give the person time to think as well as to talk.

Use verbal and non-verbal gestures to “take your turn” in the conversation without redirecting it.

Show warmth and caring about what you are hearing.

Reflect back what you hear, when appropriate, by responding to what you heard or restating

18

Page 19: Storytelling for UX Workshop

19

Ask the questions that encourage stories

“When was the last time you [did that thing]?”

“Have you ever [done something]?” “How often do you [do that thing]?”“What makes you decide to [do that thing]?”“Where do you [do that thing]?”

+“Tell me about that.”

(and really listen)

+

FIGURE 4-1

UX person

Our colleagues(audience)

User

Story as collected

Story as re-told

FIGURE 5-2

Page 20: Storytelling for UX Workshop

20

Listen for juicy fragments

Any time you listen to someone you can collect storiesLook for stories that….

You hear from more than one source. Have a lot of action detail. Have details that illuminate user data Surprise or contradict common beliefs

And are clear, simple, and compelling.

Page 21: Storytelling for UX Workshop

21

Unexpected stories... Use data to set

up the storyMerge demographicand other statisticswith a humansituation

We were ready to be disappointed. Nurses were more interested in people than technology.

They used the Web, of course, but didn’t see social media as work. Only a few of them had phones that did more than make phone calls. Some didn’t even have Web access except at home.

So we were taken by surprise when one nurse after another got enthusiastic about some concept sketches for mobile health sites.

Page 22: Storytelling for UX Workshop

22

Unexpected stories Character

The persona creates the perspective andrelationship

Imagery Suggests theemotionalconnections

Context Set up the problem

Gina gave us the first tidbit. She was a nurse manager for the county health system. “I’m on the move all day and I have a huge case load. Patients are always throwing new questions at me. Yesterday, I really struggled to sort out a problem one patient was having with side effects. I speak a little Spanish, but just couldn’t remember the correct medical term to explain a new adjuvant the doctor wanted to try. It was so frustrating.”

She pointed at the sketch. “I don’t have a phone that will do all that - yet, but if it’s really that simple…”

Page 23: Storytelling for UX Workshop

Stories  introduce  us  to  people

Storytelling  is  how  we  make  sense  of  the  world:  re-­‐imagining  our  everyday  lives  as  an  experience  to  be  shared  with  others.

                                           @otrops

Page 24: Storytelling for UX Workshop

24

Stories turn a profile into a persona

Elizabeth, 32 years old

Married to Joe, has a 5-year old son, Justin

Attended State College, and manages her class alumni site

Uses Google as her home page, and reads CNN online

Used the web to find the name of a local official

Aged 30-4545% married with children65% college educatedUse the web 3-5 times a week

Page 25: Storytelling for UX Workshop

Create a story that introduces a user or explains a user need

Start from an experience in your work. Think about a specific person or event.

Maybe it changed your own thinking

Maybe a story about ... How someone used your product A need they didn’t even know they had A delightful experience A painful experience

Use the Story Basics cards to gather your ideas about the story

Craft story you can tell in ~ 2 minutes that introduces that person

25

Page 26: Storytelling for UX Workshop

Sharing your story

Share your story with someone else Find a partner.

Each of you will tell your story to the other personAnd respond with an appreciation

I’ll call ‘time’ If you finish before the timer, just wait.

If you don’t get done in time, wrap up as quickly as you can.

26

Page 27: Storytelling for UX Workshop

First story feedback

How did that go Story tellers:

Were you able to tell the story you wanted to tell?

Story listeners:What did you learn from the story?Did the story you heard suggest another story?

27

Can you retell the story you heard? Is it easier to remember a complex situation when it’s part of a story?

Page 28: Storytelling for UX Workshop

What makes a good story?

Stories have Time and place Characters Events

28

But they also have Emotions Imagery Interaction

Page 29: Storytelling for UX Workshop

Add context and imagery

Find a new partner

Pick 2-3 cards from these groups to see what ideas they spark for ways to add them to your story.

Share your stories (just like last time)

29

Page 30: Storytelling for UX Workshop

Feedback

How did that go? How does it feel to have a UX story include imagery and emotion?

How do you include points of emotional connection when you tell a story in a business setting?

What do you remember most from the stories you heard?

30

Page 31: Storytelling for UX Workshop

Stories  can  be  told  many  ways

Storytelling  is  a  two-­‐way  mirror.  You  see  yourself  reflected  in  the  experience  of  others.  

@nathangibbs

Page 32: Storytelling for UX Workshop

Story structures and perspectives

Some stories are a simple narrative Prescriptive structure

Framing structures create contrast Me - Them - Me Here - There - Here Now - Then - Now

Stories can explain a situation or set a context Layered Contextual interlude

Journeys show obstacles overcome A hero’s journey

32

Page 33: Storytelling for UX Workshop

The hero’s journey

33

Page 34: Storytelling for UX Workshop

Change perspective or structure

Use the Story Structure cards

Which structure matches the story best?

With a partner, try telling the same story twice, from two different perspectives.

34

Page 35: Storytelling for UX Workshop

Feedback

How does the story change when the perspective changes?

Does it have a different meaning? Did you want to tell it in a new way? Who is the hero of the story?

35

Page 36: Storytelling for UX Workshop

From  stories  to  innova>on

Stories  help  us  empathize  and  experience  another  person’s  condi>on.  Stories  appeal  to  our  emo>ons  and  drive  us  to  ac>on.

@balchenn

Page 37: Storytelling for UX Workshop

37

Stories can spark innovationThey can start from...

Stories you hear during from (or about) users

Explore new perspectives on a problem or goal

Personas Show their behavior in new

situations

Data Explore the story behind the data

Juicy fragments Explain the unexpected

Page 38: Storytelling for UX Workshop

38

FIGURE 5-2

Juicy fragments can grow into a story

“When I’m waiting for a bus, I wish I had a way to know when it will arrive.”

“If I’m running late, I can drive

if I’m going to miss the train.”

“I love seeing lots of people

on the metro platform. It

usually means a train will

arrive soon.”

“When the bus stop isn’t well marked, I always worry whether I’m in the right place.”

Page 39: Storytelling for UX Workshop

39

Stories explore situations and context Context

Set up the problem

Character The persona creates the perspective andrelationship

Imagery Suggests theemotionalconnections

There is nothing more frustrating than waiting for the bus. On a suburban road. In the snow.

Sandra didn’t like snow much anyway, but she liked standing at her bus stop even less, with snow oozing into her boots and cars splashing ice at her.

Had she missed it? Was it right around the corner? Was it even running with all this snow?

Was anything going to get her to work on time today?

Page 40: Storytelling for UX Workshop

40

Stories explore situations and context (2) Context

Different setting

Character Different person and situation

Same basic problem

Much as Ian loved staying out with his friends until the pubs closed, he hated getting back home late at night.

Was the train still running, or did he have to trudge over to the stop for the night bus -- 5 blocks that seemed much longer after a few beers.

And there was the tedium of watching the bus wind through the streets.

Page 41: Storytelling for UX Workshop

41

Stories start brainstorming

Signs on the platform with when the train will arrive.

App that taps into transit information for bus or train locations.

Text message with the time the next bus will arrive.

Bus checks off its arrival on the schedule.

Website with information

Page 42: Storytelling for UX Workshop

A new ending to Sandra’s storyAfter she’d waited for a few minutes, Sandra brushed enough snow off the sign to be able to read the stop number.

She had the RideFind number in her phone’s contact list, so all she had to do was enter the number of the bus stop into a text message.

A couple of seconds later, the reply came back. The bus was 10 minutes away, running late. She’d get to work this morning.

42

Sets up a possible solution

Sign for a service in

Washington DC

Page 43: Storytelling for UX Workshop

Craft stories for brainstorming

Start from a juicy fragment, analysis data, or a usability problem

Construct a story that sets up the context...

but does not provide a solution.

Be sure you ground the story with a character (or persona), a context (place, time, situation), a motivation, and a problem.

43

Page 44: Storytelling for UX Workshop

Feedback What happens if you write the story for a different persona?

Or change a starting assumption technology enablers rules or other constraints

44

Page 45: Storytelling for UX Workshop

Incorpora>ng  stories  into  UX  deliverables

Every  interac>on  is  a  story,  with  the  user  as  the  "star."    This  appeals  to  our  human  need  to  be  at  the  center  of  every  experience.  

@dgelman

Page 46: Storytelling for UX Workshop

There are many ways to tell a story

Elevator stories Stories you tell around a table Written stories Presenting a report Comic or storyboard Visual collage In a formal presentation

46

Page 47: Storytelling for UX Workshop

Illustrate problems as a story

47

Page 48: Storytelling for UX Workshop

Show the interaction as a storyboard or comic

48

Page 49: Storytelling for UX Workshop

Weave stories into your reports

49

Page 50: Storytelling for UX Workshop

Stories  as  usability  test  tasks

Stories  make  things  meaningful,  moving  and  memorable.

@iaexperience  

Page 51: Storytelling for UX Workshop

51

Stories can be test scenarios

Test scenarios let the participant “finish the story”

They create a realistic context because they are based on real stories.

They give you a range of stories and perspectives to draw on.

Page 52: Storytelling for UX Workshop

52

Stories for evaluation create a starting point You can create a story that provides the motivation, but

allows variation in how the scenario is completed

Another person just got promoted ahead of you. You know you are good at your job but notice that everyone else has a degree in business. You are thinking about whether this is a good option for you.

What questions do you need to answer first?

(OK). Let’s see if the local college has a program that will work for you.

MotivationCreate a story for motivation, or build one based on what you know about them

GoalsLet them identify their goals in this scenario

And then, get them started in meeting their goals

Page 53: Storytelling for UX Workshop

Create a usability test scenario

Start from one of your stories, and turn it into a test scenario

What is the basic scenario you want the participant to complete?

How much can the scenario vary based on their specific interests? Are there different motivations or starting

points? Are there many things they can find, use or

buy that they can choose from? How much variation is there in how the

scenario can be completed?

53

Page 54: Storytelling for UX Workshop

Stories  can  make  your  UX  work  richer  and  more  persuasive

Stories  take  our  audience  on  a  journey  and  enable  leaps  of  faith.  

@MarkErhardt

Page 55: Storytelling for UX Workshop

55

Stories use pull, not push, to persuadeThey let your audience think about something (new)…

In a realistic situation

With a compelling character and perspective

And imagine how it will solve a problem

Page 56: Storytelling for UX Workshop

56

A story is successful when it gets repeated

Look for stories that are

Based on real data The stories you want told Generate insights and empathy

Think carefully about what stories you want retold.

Page 57: Storytelling for UX Workshop

57

Stories add depth to UX work

If you craft and use stories in a conscious way, you will

Add a richer understanding of users to your design process

Find new design ideas more easily

Be more persuasive about innovative ideas

Enhance the usability work you are already doing

Bring people into the center of the process

Page 58: Storytelling for UX Workshop

58

Thank you

Storytelling for User Experience:Crafting stories for better design

Whitney Quesenbery & Kevin [email protected]@media.mit.edu

Blog and book sitewww.rosenfeldmedia.com/books/storytelling/

Illustrations by Calvin C. Chan available at www.flickr.com/photos/rosenfeldmedia/