storytelling in digital service design

109
STORYTELLING IN DIGITAL SERVICE DESIGN Interaction 16 Workshop 1.3.2016

Upload: maria-lumiaho

Post on 16-Apr-2017

71 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Storytelling in Digital Service Design

STORYTELLING IN DIGITAL SERVICE DESIGN Interaction 16 Workshop 1.3.2016

Page 2: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Agenda •  2.00 – 2.20 INTRO •  2.20 – INSPIRATION / GROUP WORK

•  Part 1 – Service Concept & Controlling Idea •  Part 2 – Hero

•  3.30 Break •  3.40 – INSPIRATION / GROUP WORK

•  Part 3 – Narrative •  Part 4 – Design Elements •  Part 5 – Group Presentation Prep

•  4.50 Break •  5 – 6 PRESENTATIONS & WRAP UP

Page 3: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

We are Futurice A veeeeery short introduction

Page 4: Storytelling in Digital Service Design
Page 5: Storytelling in Digital Service Design

We create digital services

for people to love

Creating a culture that makes

innovation happen

Discovering and designing new digital services

Developing, scaling and operating digital services

Page 6: Storytelling in Digital Service Design

Way of workingLEAN SERVICE CREATION

Page 7: Storytelling in Digital Service Design

LSC is a multi-disciplinary way of working that maximizes the probability of creating successful digital services

Lean Service Creation

Page 8: Storytelling in Digital Service Design

LSC$SLIDE$HERESERVICE VISION SPRINT

TEAM : Business / Technology

Design / End-Users

BUSINESS NEED

Improve

Improve

Improve

LEAN SERVICE CREATION PROCESS

FIND A PROBLEM WORTH SOLVING FINDING PRODUCT MARKET FIT GROWTH HACKING

Days to Weeks Weeks to Months Months to Years

NEW IDEAS

SERVICE VISION

MVP TO

LAUNCH

Page 9: Storytelling in Digital Service Design
Page 10: Storytelling in Digital Service Design
Page 11: Storytelling in Digital Service Design

Design at futuriceTEAM / US

Page 12: Storytelling in Digital Service Design

Design teamComplex problems require broad thinkers and doers. 45 multi-disciplinary designers (business design, service design, concept design, brand design, UX/UI design, visual design, sound design.

SERVICE DESIGN LEAD

Maria Lumiaho

[email protected] @marialumiaho

SENIOR SERVICE DESIGNER

Jane VitaSENIOR SERVICE DESIGNER

Suvi Numminen

[email protected] [email protected] @janevita

Page 13: Storytelling in Digital Service Design

THINK ABOUT THE SERVICES & PRODUCTS YOU USE Are there any that you … Are happy to pay a premium for even though another product would do the same job just fine? Go on and on about to your friends and don’t understand why they don’t want to use it, too? Are happy to use even if it doesn’t always work perfectly?

Page 14: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONThere’s more to life than seeking solutions to

problems

Page 15: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONWe look for answers to big questions & seek

meaningful experiences

Page 16: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

STORIES ARE A WAY OF TRYING TO UNDERSTAND THE WORLD AND WHAT IT MEANS TO BE HUMAN

Page 17: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONCan the experience of using a service be

meaningful in the same way a story can?

Page 18: Storytelling in Digital Service Design

YES! (IF IT’S DESIGNED TO DO SO)

Page 19: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONThere are similarities between designing an experience and writing a story

Page 20: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

But also differences: The story a service creates is not linear and doesn’t deal with conflict the same

way

Page 21: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

ALSO A DISCLAIMER

Does not replace other service design methods, but useful as an additional lens

Requires seamless collaboration between branding, service design & UX/UI design

Page 22: Storytelling in Digital Service Design

Why we care about storytelling

in digital Service Design?

Storytelling is all about

experiences

Storytelling about & inside the services

we create

Who doesn’t like a good

story?

Page 23: Storytelling in Digital Service Design

LET’S GET STARTED!

Page 24: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

5 Groups

Page 25: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Pick a service to work on •  Retail •  Fast food chain •  Travel / hospitality •  Going to / watching movies •  Banking •  …

Page 26: Storytelling in Digital Service Design

1) WHAT IS THE STORY ABOUT?

Page 27: Storytelling in Digital Service Design

A GOOD STORY Has a clear reason to exist Makes a statement about the world Resonates with people who share those beliefs

From “Story” by Robert McKee &

“Start With Why” by Simon Sinek

Page 28: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONA good story can be distilled into a

CONTROLLING IDEA

From “Story” by Robert McKee

Page 29: Storytelling in Digital Service Design

Example: The Lion King

+

Evil is defeated when you come to terms with

your past and take responsibility

Page 30: Storytelling in Digital Service Design

Example: The Lion King

VALUE

+

Evil is defeated when you come to terms with

your past and take responsibility

CHANGE IN VALUE

CAUSE

Structure of a controlling idea from “Story” by Robert McKee

Page 31: Storytelling in Digital Service Design

+

Example: The Lord of the Rings

VALUE

Peace is restored when ordinary people have

courage

CHANGE IN VALUE

CAUSE

Structure of a controlling idea from “Story” by Robert McKee

Page 32: Storytelling in Digital Service Design

Example: Coca-Cola

VALUE

Happiness ensues when you have special,

refreshing moments

CHANGE IN VALUE

CAUSE

Structure of a controlling idea from “Story” by Robert McKee

Page 33: Storytelling in Digital Service Design

Example: Apple

VALUE

Life is more enjoyable when you do things

differently

CHANGE IN VALUE

CAUSE

Structure of a controlling idea from “Story” by Robert McKee

Page 34: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Controlling ideas drive action and drive you to make decisions!

“It’s about peace” is a theme, not a

controlling idea

From “Story” by Robert McKee

Page 35: Storytelling in Digital Service Design

Should be based on customer insight & brand design Should be universal enough to be understood by most people Flexible enough to turn into a service, movie, game, whatever! Should be able to start a good conversation over beer

Qualities of good controlling ideas

Page 36: Storytelling in Digital Service Design

// CONFLICT DRIVES ACTION

Page 37: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Story is not interesting without conflict

Different levels of antagonistic forces try to win over the positive value

From “Story” by Robert McKee

Page 38: Storytelling in Digital Service Design

For example: Wisdom as the core value

Positive value

Wisdom

Lack of positive value

Stupidity disguised as wisdom

Negative value Worst of the worst

Ignorance Stupidity

From “Story” by Robert McKee

Page 39: Storytelling in Digital Service Design

For example: Love as the core value

Positive value

Love

Lack of positive value

Self-loathing

Negative value Worst of the worst

Indifference Hate

From “Story” by Robert McKee

Page 40: Storytelling in Digital Service Design

Positive value

Justice

Lack of positive value

Injustice disguised as

justice

Negative value Worst of the worst

Unfairness Injustice

For example: Justice as the core value

From “Story” by Robert McKee

Page 41: Storytelling in Digital Service Design

// WHAT’S THE POINT?

Page 42: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

The controlling idea & changes in value act as the core of the service

When designing any aspect, ask

“does this support the controlling idea?”

Page 43: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

If the controlling idea is expressed clearly enough, it will resonate very strongly with users

à users loving the service

(even if they can’t tell why)

Page 44: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Group Work

Page 45: Storytelling in Digital Service Design

2) THE HERO

Page 46: Storytelling in Digital Service Design

// SOME BASIC RULES TO KEEP IN MIND

Page 47: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

YOUR SERVICE IS NOT THE MAIN CHARACTER

Page 48: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

-Chinese Proverb

Tell me and I'll forget. Show me and I may remember. Involve me, and I'll understand.

Page 49: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

THE USER IS THE HERO

From “Every Guest Is a Hero” by Adam M. Berger

Page 50: Storytelling in Digital Service Design

LEAN SERVICE C

REATION‘USERS’ DON’T HAVE ADVENTURES

Rebels, philosophers, guests, tricksters, hosts, antiheros and friends, dreamers do…

Page 51: Storytelling in Digital Service Design

Crucial to know your users when defining the hero

User’s role should be

communicated clearly to them (marketing, landing

pages, onboarding)

The user must identify with the adventure the service is

presenting

‘Who am I?’

Page 52: Storytelling in Digital Service Design

Customers in Disneyland are called ‘guests’

The personnel is the ‘cast’

who work ‘onstage’

What you call your customers can make a

subtle difference

Example: Disneyland

From “Be Our Guest” by Theodore B. Kinni“

Page 53: Storytelling in Digital Service Design

Who is the user when using this service?

“Who am I?”

Page 54: Storytelling in Digital Service Design
Page 55: Storytelling in Digital Service Design
Page 56: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Group Work

Page 57: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Agenda •  2.00 – 2.20 INTRO •  2.20 – INSPIRATION / GROUP WORK

•  Part 1 – Service Concept & Controlling Idea •  Part 2 – Hero

•  3.30 Break •  3.40 – INSPIRATION / GROUP WORK

•  Part 3 – Narrative •  Part 4 – Design Elements •  Part 5 – Group Presentation Prep

•  4.50 Break •  5 – 6 PRESENTATIONS & WRAP UP

Page 58: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

BREAK TIME!

Page 59: Storytelling in Digital Service Design

3) NARRATIVE

Page 60: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONWhat kind of experiences and functionality does the controlling idea suggest?

Page 61: Storytelling in Digital Service Design

EXAMPLE CONTROLLING IDEA FOR A RECIPE SERVICE: “Life’s more fun when you can improvise and let go of fear of failing”

WHAT IS ENCOURAGED?

Experimentation

Replacing ingredients (suggestions on/off)

Sudden changes while cooking

Stumbling upon new recipes

Sharing the experience, giving new ideas to others

Sharing and celebrating failures, too (hall of fame of bad/failed recipes)

Fixing bad recipes, submitting your own version

Seeking ideas from others (“what would you do with this?)

WHAT IS DISCOURAGED / NOT ALLOWED MORE POSSIBILITIES

Following recipes strictly Rating a recipe as good or bad (or stars etc.)

Specific measurements in recipes

Live-streaming while cooking: taking suggestions on the go from the crowd Recipes branching out with different variations Weekly challenges with mystery ingredients or theme Rating recipes based on how many new ideas you got Recipe rating based on how many new ideas you get from it Become a master of an ingredient (master of potato etc.) Different levels of recipes based on how vague vs. specific they are

Page 62: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONFunctionality that isn’t aligned with the

controlling idea will dilute it

Page 63: Storytelling in Digital Service Design

// STRUCTURING THE STORY

Page 64: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

DESIGN FOR CLEAR BEGINNINGS, MIDDLES AND ENDINGS

Page 65: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

HAVING A CLEAR STRUCTURE FEELS GOOD

MIDDLE

END BEGINNING

From “Poetics” by Aristotle and many more…

Page 66: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

WORKS BOTH ON THE ENTIRE SERVICE AND SINGLE TASKS

SESSIONS

ENTIRE LIFECYCLE OF USE

SINGLE TASKS

Page 67: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

NOT ACTUALLY AND ARC, THOUGH, BUT MORE LIKE THIS

From “The Art of Game Design: A Book of Lenses” by Jesse Schell

Page 68: Storytelling in Digital Service Design

EXPOSITION

EXPOSITION

Introducing the protagonist, the world & status quo of the controlling idea

Combining elements from “Story” by Robert McKee, Joseph Campbell’s Hero’s Journey and Gustav Freytag’s Freytag's Pyramid

Page 69: Storytelling in Digital Service Design

EXPOSITION

INCITING INCIDENT

INCITING INCIDENT

Accepting a call to adventure à suddenly everything changes Entering a different world There’s no way back to the old

Combining elements from “Story” by Robert McKee, Joseph Campbell’s Hero’s Journey and Gustav Freytag’s Freytag's Pyramid

Page 70: Storytelling in Digital Service Design

Setting & inciting incident

Landing page &

onboarding

Page 71: Storytelling in Digital Service Design

EXPOSITION

RISING ACTION

INCITING INCIDENT

Battle over the winning value gets more intense Being constantly surprised & feeding curiosity Showing affordances and foreshadowing

RISING ACTION

Battle over the winning value gets more intense Being constantly surprised & feeding curiosity Showing affordances and foreshadowing Providing breaks, too

Combining elements from “Story” by Robert McKee, Joseph Campbell’s Hero’s Journey and Gustav Freytag’s Freytag's Pyramid

Page 72: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONSurprises create emotional stamps that make up

most of the memory of the experience

From “The Service Startup” by Tenny Pinheiro

Page 73: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONGive people what they want but not the way

they expect it

From “Story” by Robert McKee

Page 74: Storytelling in Digital Service Design

Creating delightful surprises during the journey

Page 75: Storytelling in Digital Service Design

LEAN SERVICE C

REATIONTurn errors and inconveniences into opportunities to enforce the story

Page 76: Storytelling in Digital Service Design

‘Secret’ game in Chrome browser

Page 77: Storytelling in Digital Service Design

Queuing areas in theme parks are

designed to deepen the story

They can also

help to build excitement for

the ride

Page 78: Storytelling in Digital Service Design

EXPOSITION

CLIMAX

INCITING INCIDENT

RISING ACTION

The most dramatic moment, biggest conflict It all leads to this Inevitable, but must also be a choice Can’t go back

CLIMAX

Combining elements from “Story” by Robert McKee, Joseph Campbell’s Hero’s Journey and Gustav Freytag’s Freytag's Pyramid

Page 79: Storytelling in Digital Service Design

EXPOSITION

RESOLUTION

INCITING INCIDENT

RISING ACTION

Everything is different Showing how the world has changed Wrapping things up, removing confusion

CLIMAX

RESOLUTION

Combining elements from “Story” by Robert McKee, Joseph Campbell’s Hero’s Journey and Gustav Freytag’s Freytag's Pyramid

Page 80: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Introducing the protagonist, the world & status quo of the controlling idea

Accepting a call to adventure à suddenly everything changes Entering a different world There’s no way back to the old

Battle over the winning value gets more intense Being constantly surprised & feeding curiosity Showing affordances and foreshadowing Providing breaks, too

The most dramatic moment, biggest conflict It all leads to this Inevitable, but must also be a choice Can’t go back

Everything is different Showing how the world has changed Wrapping things up, removing confusion

INCITING INCIDENT

CLIMAX

EXPOSITION

STRUCTURE OF THE STORY

RISING ACTION

RESOLUTION

Combining elements from “Story” by Robert McKee, Joseph Campbell’s Hero’s Journey and Gustav Freytag’s Freytag's Pyramid

Page 81: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Group Work

Page 82: Storytelling in Digital Service Design

4) DESIGN ELEMENTS

Page 83: Storytelling in Digital Service Design

BUILDING BLOCKS OF IMMERSIVE WORLDS

THEMES & CONCEPT

ASSOCIATIONS COLOR CONTRAST &

VALUE SHAPE,

COMPOSITION, FOCUS

MOTION JUICINESS

All aligned with the controlling idea

Page 84: Storytelling in Digital Service Design

// THEME EXPLORATION

Page 85: Storytelling in Digital Service Design

EXPLORING THEMES & CONCEPT ASSOCIATIONS 1)  What concepts, ideas &

themes help make the controlling idea more concrete?

2)  What design motifs and symbols represent the theme & associations?

From “The Immersive World Handbook” by Scott Lukas

Page 86: Storytelling in Digital Service Design

Example for the recipe service with the controlling idea of “LIFE’S MORE FUN WHEN YOU CAN IMPROVISE AND LET GO OF FEAR OF FAILING”

CONCEPT IDEAS

MOTIF IDEAS

Experimentation Laboratory (but

not clinical) Explosions

Smoke, burning

Sprinkles (exploding)

Excitement Joy

Surprises

Mystery present

Mystery

Thinking on your feet

Living in the moment

Laughing at yourself

Ingredients

Weird tools Prototypes

Nothing is ever final/done

Bad ideas

Celebration

A world of possibilities

Makeshift workspace

Unconventional materials, texture

Piles, mess

Branching out, branches

Stirring, whisks

Veggies etc. that are not perfect

Page 87: Storytelling in Digital Service Design

// COLOR & MOOD

Page 88: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Passion Danger

Optimism Joy Caution

Life Growth

Calmness Trustworthiness Cold

Mysterious Energy Vitality

COLOR & MOOD

Not that simple, though…

Page 89: Storytelling in Digital Service Design

Context matters…

Page 90: Storytelling in Digital Service Design

// CONTRAST & VALUE

Page 91: Storytelling in Digital Service Design

Color values affect the mood

High key – happy

Low key – threatening Contrast – dramatic

etc.

Page 92: Storytelling in Digital Service Design
Page 93: Storytelling in Digital Service Design

// SHAPE, COMPOSITION, FOCUS

Page 94: Storytelling in Digital Service Design

Building a mood visually

(composition, fonts, etc.)

http://www.zevendesign.com/

mood-lines-giving-designs-attitude/

Originally from “Landscape Architecture” by John Ormsbee

Simonds

Page 95: Storytelling in Digital Service Design

Using scale & mass to create sense of awe

and attract you towards something

Scale, composition, focal points

From “The Immersive World Handbook” by Scott Lukas

Page 96: Storytelling in Digital Service Design

// MOTION

Page 97: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

MEANING OF MOTION Examples

From “Landscape Architecture” by John Ormsbee Simonds

HORIZONTAL MOTION

Easy Free

Visually interesting Easy to control

Effortless movement

DOWNWARD MOTION

Hiding, digging in Confinement

Protection Privacy

Minimal effort

UPWARD MOTION

Exhilarating Sense of accomplishment

Going up in life Detachment from earthly things

Command, higher ground

Page 98: Storytelling in Digital Service Design

// ’JUICINESS’

Page 99: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

ENGAGE AS MANY SENSES AS POSSIBLE WITH SOUND, TEXTURE, SMELL, TASTE, TEMPERATURE, BALANCE, ETC.

REMEMBER THAT DIGITAL SERVICES HAVE A ‘FEEL’ TO USING THEM, TOO

Page 100: Storytelling in Digital Service Design

Some things feel good to use and

fiddle with.

Different types of feedback make

them feel ‘juicy’ to use.

Page 101: Storytelling in Digital Service Design

Juiciness in action: ‘Game Feel - Why

your death animation sucks’

https://www.youtube.com/

watch?v=pmSAG51BybY

More in “Game Feel: A Game Designer's Guide to Virtual Sensation” by Steve Swink

Page 102: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Group Work

Page 103: Storytelling in Digital Service Design

5) PRESENTING YOUR STORY

Page 104: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Different options for presenting the story: storyboards, customer journey, role playing

etc.

Pick one that suits your story

Page 105: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

Agenda •  2.00 – 2.20 INTRO •  2.20 – INSPIRATION / GROUP WORK

•  Part 1 – Service Concept & Controlling Idea •  Part 2 – Hero

•  3.30 Break •  3.40 – INSPIRATION / GROUP WORK

•  Part 3 – Narrative •  Part 4 – Design Elements •  Part 5 – Group Presentation Prep

•  4.50 Break •  5 – 6 PRESENTATIONS & WRAP UP

Page 106: Storytelling in Digital Service Design

LEAN SERVICE C

REATION

BREAK TIME!

Page 107: Storytelling in Digital Service Design

PRESENTATIONS

Page 108: Storytelling in Digital Service Design

WRAP-UP

Page 109: Storytelling in Digital Service Design

THE END