storymapping the user experience

STORYMAPPINGTHE USER EXPERIENCE

DONNA LICHAW DONNALICHAW.COM

@DLICHAW

TODAY’S AGENDA

Why story? How stories work Developing your stories Applying stories Rules of thumb

INTRODUCTIONSWho you are What you do Why you are here today

THE WAY THINGS WERE

Framew

ork

456

Designing for the Digital Age: Creating Human-Centered Products and Services

Table 16.8. Sketching from a scenario.

Scenario step Sketch Comments

1. Laura takes a call from Mr. Cowell, who needs to make an appointment for his cat to have a tumor removed. Laura finds him in the client list and opens his record to see detail in the client over-view display area, which shows that Mr. Cowell has three cats, one of whom is flagged for follow-up.

cowell,bobcowell,tom

findcowell

client list workspace

fluffy xenaclient

2

13

This first sketch draws upon the organizer/workspace pattern and the data model, which indicates that pets are parts of the client record. The “find” field is understood as a placeholder for some way or ways to locate clients.

2. She looks at the pet overview display area, sees that Xena needs surgery, and confirms with Mr. Cowell that the pro-cedure is for Xena. She clicks to create a new ap-pointment.

cowell,bobcowell,tom

find

includes history, current visit,last visit, prior by date

fluffy xenaclientcat born 7/1/2001gray tabbylast visit

new appt Whoops, better add a toolbar for that “new appointment” button. Notice there’s a little bit of detail about what may be on the screen. The inter-action designer captures an idea for navigating visits, but quickly moves on.

3. She chooses the procedure type in the appointment parameters area. In the best appoint-ment display, the system shows the next several non-urgent appointments for Dr. Harvey, Xena’s usual vet, when the sur-gery and hospital space required for the procedure are also available. She suggests the first couple of dates to Mr. Cowell,

appt forxenatypesurgerywithharvey

tabs within tabs

calendarbest

apptsclients

best

other

Uh-oh … what should happen when that button is clicked? Does it make sense for a cal-endar to live as a tab inside the client record? It seems more like a global tool, so the team decides to have a client screen and calendar screen, with top-level tabs to switch between them. Tabs within tabs are unfortunate, but the team recognizes this as an issue they can solve later and keeps going. Perhaps the client

Hinman, Rachel. 2012. The Mobile Frontier. New York: Rosenfeld Media. www.rosenfeldmedia.com/books/mobile-design/

http://www.rosenfeldmedia.com/books/mobile-design/

FLAT FLOWS High bounce rates Low conversion Low activation Low engagement High funnel drop-off

STORYTELLING

STORYTELLINGthere’s A Formula For That

STORYTELLINGMAPPING

http://www.denofgeek.com/tv/breaking-bad/27141/see-inside-the-breaking-bad-writers-room

http://www.denofgeek.com/tv/breaking-bad/27141/see-inside-the-breaking-bad-writers-room

http://www.sundance.tv/series/the-writers-room/photos/the-writers-room-breaking-bad#/9

Not to be confused with…

http://www.agileproductdesign.com/blog/the_new_backlog.html

http://www.agileproductdesign.com/blog/the_new_backlog.html

It’s more like…

MAKE THINGS GO

BOOM

HOW STORY WORKS

Beginning Middle End

Hero Goal

Exposition

Inciting Incident or Problem

Hero Goal

Exposition

Rising A

ction


Hero Goal

Exposition

Rising A

ction


Hero Goal

Exposition

Crisis

Climax or Resolution

Rising A

ction


Hero Goal

Exposition

Crisis

Falling Action


Rising A

ction


Hero Goal

Exposition

Crisis

Denouement

End


Rising A

ction


Hero Goal

Exposition

CrisisFalling ActionDenouement

End

Falling Action


Rising A

ction


Hero Goal

Exposition

Crisis

Denouement

EXERCISE

End

Falling Action


Rising A

ction


Hero Goal

Exposition

Crisis

Denouement

3 STORIES

CONCEPT STORIES ORIGIN STORIES USAGE STORIES

Goal MetWho Goal

Value & Competitive advantage

Problem

Product

Name

Market

Catego

ry

TakeawayCompetition

CONCEPT STORIES Who a product is for Why someone would use it What a product is How it’s better than the competition

ORIGIN STORIES USAGE STORIES

EXERCISE

Goal MetWho / Goal

Value & Competitive advantage

Problem

Product

Name

Market

Catego

ry

TakeawayCompetition

} Concept Story

Collect & ShareCollect imagesShare images

Visual collecting & sharing!

It’s a pain

Discover P

interest

Sign upHomepage Landing page App store Email Ad

Eh

Goal metWho Goal

Why they should careproblem solved

ProblemTriggerPainpoint

Discover p

roduct

Action

Word of mouth Paid advertising Google search App store Other channels/touchpoints

Acquisition Activation Conversion Awareness

Measureable

Homepage Landing page App store Email Ad

}

Resistance

CONCEPT STORIES ORIGIN STORIESWho a product is for Why someone would want to use it How they will discover the product What value/affordances someone should see What action(s) they should take

CONCEPT STORIES ORIGIN STORIESWho a product is for Why someone would want to use it How they will discover the product What value/affordances someone should see What action(s) they should take

}Target market Problem space Acquisition funnels, Mktg, SEO Requirements, Copy, Assets CTA(s)

EXERCISE } Origin Story

Goal metWho Goal

Why they should careproblem solved

ProblemTriggerPainpoint

Discover p

roduct

Action

Word of mouth Paid advertising Google search App store Other channels/touchpoints

Homepage Landing page App store Email Ad

Resistance

Sign up

Collect and share something

Goal MetWho Goal

Solve ProblemExperience Value

ProblemIncentiveCTA

FlowFinishFlow

Impediment

Sign up Payment Funnel drop-off (metrics) Mental hurdles Boredom Lack of value Usability

Inciting Incident

Rising Action

Crisis

Climax

Falling Action

Home In the KnowWant To Be In the Know

Access + MembershipFriends Are Here?

Sign up

Onboard

ing Flow Finish

FlowBoredom Lack of value

Inciting Incident

Rising Action

Crisis

Climax Falling Action

MICRO-STORIES AND HABIT LOOPS

Hours 1 2 3 4 5 6 ∞ Days Months Years

LONG-TERM ENGAGEMENT

Goal MetWho Goal


ProblemIncentiveCTA

FlowFinishFlow

Impediment


EXERCISE } Usage Story

Goal MetWho Goal


ProblemIncentiveCTA

FlowFinishFlow

Impediment


CASE STUDIES

DAFFODILS

RESEARCH & STRATEGY PERSONA 3: The Dutiful Citizen CENTRAL PARK CONSERVANCY

Ben, The Dutiful Citizen NARRATIVE ARCCPC donors tend to fit this profile.

SEVENHEADSDESIGN.COM PAGE OF 36 47

Actio

n &

Exci

tem

ent

Timeline

Gives: “I use the park and should contribute.”

Lives or works near the park.

Loves spending time outdoors.

Asked to donate • Broadcast media • Social media • Mail (paper, email)

Deterrents: • Trust • Intangible ROI • Digital usability • Geographical relevance

Sees: “I can see where my money is going when I’m at the park. I don’t get that with cancer research. I can’t see cells in a microscope.”

Feels ownership and sees utility in Central Park

Goals met: • To be a part of something bigger • To contribute to society by doing their duty

RESEARCH & STRATEGY CENTRAL PARK CONSERVANCY

Ben, The Dutiful Citizen CONTENT & FUNCTIONALITYThis content & functionality will help Ben stay informed and remind him to donate.

SEVENHEADSDESIGN.COM PAGE OF 42 47

Actio

n &

Exci

tem

ent

Timeline

Reminders • Signage about

donations in strategic locations throughout park

• Acquisition of e-mail address at time of previous gift, “Remind me to give in the future?”

• Social reminders, e.g. Twitter, Facebook tied to park improvements

• Simplified mobile sign-up for gift reminders (outside of a gift interaction)

Making a Donation • Detailed needs and

associated costs in giving menu

• Focus on what gifts are supporting now in the blog, including recent projects and the Year in Review (beyond the annual report)

• Information about the number and impact of smaller gifts (daffodils)

• Information about where your money goes and where project support comes from

After the Donation • E-mail campaign tied

to specific deadlines • Tangible outcomes,

such as a tote, water bottle, or lunch box

• Deadlines with “blunt language” for donation categories, which explain why the deadline exists

COMMUNITY ACCESS GIVING

The Seton Hill University Student Story

Goals met:

• Educated• Job-ready• Community

New student goals:

• To learn• To be job-ready• To be a part of a community

Timeline

Actio

n / E

xcite

men

t / A

wes

omen

ess

Admissions Graduation

Thinks that attending SHU is the

best way to meet her or his goal

Attends SHU

Finds and feels:

Strong sense of communityAccess to faculty/staffSpirit and ethos of giving

Extremely happy with SHU

Feels like a part of SHU

THE STUDENT STORY

The Seton Hill University Engaged Alumna/us Story

Goals met

NetworkedCommunity

Alumna goals:

• To get a job or extend professional network• To stay connected to her community

Timeline

Actio

n / E

xcite

men

t / A

wes

omen

ess

Graduation ∞

Is asked to volunteer on the board

Participates on the board

Finds and feels:

• Strong sense of community• Access to faculty/staff• Spirit and ethos of giving

Extremely happy with SHU

Feels like a part of SHUStruggles:

• Registering for events online• Finding out news about campus• Accessing faculty/staff• Finding other alumni• Knowing about job opportunities• FB is easier way to meet goals

THE ENGAGED ALUMNI STORY

Alumna Goals:

• To get a job or extend professional network• To stay connected to her community

∞

The Seton Hill University Differently-Engaged Alumna/us Story

Goals met

NetworkedCommunity

Seeks community of alumni through informal channels: • In-person meetups, meals, coffee• Facebook newsfeed, alumni groups

Timeline

Actio

n / E

xcite

men

t / A

wes

omen

ess

Graduation

Misses SHU community

THE DISENGAGED DIGITAL ALUMNI STORY

∞

Alumna Goals:• To get a job or extend professional network• To stay connected to her community

Visits website and participatesin digital services

Finds and feels:• Strong sense of community• Access to faculty/staff• Spirit and ethos of giving

Extremely happy with SHUFeels like a part of SHU

The Seton Hill University Future-State Engaged Alumna/us Story

Goals metNetworkedCommunity

Timeline

Actio

n / E

xcite

men

t / A

wes

omen

ess

Supp

ortin

g Th

e St

ory

Graduation

Misses SHU communityBecomes aware of alumni website

Service and EventsPromote opportunities for giving and participation.

Imagery Surface photos of people, places promi-nently throughout.

News Surface achievements and news about people, places.

Virtual Open Door Provide easy access to office staff.

Alumni Database: Provide access to find and update alumni info and job notices.

GAPS & OPPORTUNITIES

SPREADSHEETS

FINDING YOUR STORY

AGENDA

‣ INSERT CHAPTER TITLES

94

LISTEN

USING YOUR STORY

COMMUNICATE

ILLUSTRATED

Cheng, Kevin. 2012. See What I Mean. New York: Rosenfeld Media. rosenfeldmedia.com/books/comics/

VISUALIZE

VISUALIZE

ACT IT OUT

Gap analysis

SWOT analysis

Requirements gathering

Needs assessment

SUPPORT

STRATEGIZE

RULES OF THUMBStories are character-driven

Characters are goal-driven

Conflict is key

Goals are measurable

Goals can change

WHAT IS THE STORY?

DONNALICHAW.COM | @DLICHAW

THE USER’S JOURNEY