Slides from my talk around storytelling in design at the Digital Pond meet up on 06 Feb 2014
http://www.meetup.com/The-Digital-Pond/events/159211742/
Stories have played an important part in our societies and development through history. In the last few years it's gained attention as a tool for and important aspect in communication, and rightfully so. But it's also an integral part of the design process and at the Digital Pond I talked about why as well as how we can use it, from the start, during definition and development as well as going forwards.
Designing Around Storytelling - Digital Pond, London 06 Feb 2014
1. Designing around storytelling
The power of stories & how they can be used in UX design
by Anna Dahlström | @annadahlstrom @UXFika
Digital
Pond,
06
Feb
2014
www.flickr.com/photos/katerha/8435321969
2. Once upon a time
in a city called ‘Lund’...
xxxxwww.flickr.com/photos/ulfk/7976687420
3. There where
plenty of story time
www.flickr.com/photos/excomedia/sets/72157622519563566with/5233990438
7. Every brand wants
to tell their story
www.flickr.com/photos/kelstew/3658900542
8. “ If you can’t tell it, you can’t sell it. ”
- Peter Guber
www.flickr.com/photos/g-ratphotos/3404474275
9. “ Results repeatedly shows that our attitudes, fears,
hopes, and values are strongly influenced by story. In fact,
fiction seems to be more effective at changing beliefs than
writing that is specifically designed to persuade through
argument and evidence."
Entering fictional worlds radically alters the way
information is processed. ”
- FastCompany, Why storytelling is the ultimate weapon
www.flickr.com/photos/g-ratphotos/3404474275
21. “ Historically, stories have always been igniters
of action, moving people to do things. ”
- Peter Guber
www.flickr.com/photos/g-ratphotos/3404474275
28. How a story is told impacts
the human experience of its audience
Image via Shutterstock
29. Three act structure
PLOT POINT ONE
inciting
incident
PLOT POINT TWO
mid point
climax
confronts the main
character
tries to solve the problem but
don’t yet have the skills
the dramatic question
is answered
Act one
Act two
Act three
Setup
Confrontation
Resolution
30. Three act structure - applied to UCD
PLOT POINT ONE
2. Starts to consider
inciting
incident
confronts the main
character
PLOT POINT TWO
4. Makes a decision
mid point
tries to solve the problem but
don’t yet have the skills
1. Becomes aware
3. Looks further into it
Act one
Act two
Setup
Confrontation
climax
the dramatic question
is answered
5. Takes action
/ no action
Act three
Resolution
31. I asked my dad for
3 principles around good storytelling
www.flickr.com/photos/perolofforsberg/6691744587
36. “ I need to understand who has to get what out of
the thing I'm designing and I'm only satisfied a visual
has been executed well once I'm confident it's telling
the right story to the right person in the right way. ”
- Steve Whittington
Design Director
Dare
www.flickr.com/photos/g-ratphotos/3404474275
41. “ In general there should be a basic idea of where
the story is going, but not for every character. You
don't know who's going to die and who's going to start
becoming more important.
Big picture-wise, there’s a basic idea, but you need
some surprises too. It’s like driving from New York to
LA: you know you’re going to get to LA, but there’s 10
different routes you could take. ”
- Brad Falchuck
www.flickr.com/photos/g-ratphotos/3404474275
42. Include an element of
surprise & exploration
www.flickr.com/photos/conorkeller/4028043294
43. Let users
find their way around your content
www.flickr.com/photos/conorkeller/3879321839
46. It starts with this
PLOT POINT ONE
2. Starts to consider
inciting
incident
confronts the main
character
PLOT POINT TWO
4. Makes a decision
mid point
tries to solve the problem but
don’t yet have the skills
1. Becomes aware
3. Looks further into it
Act one
Act two
Setup
Confrontation
climax
the dramatic question
is answered
5. Takes action
/ no action
Act three
Resolution
47. Feel good
Delight
Identify key points
PLOT POINT ONE
2. Starts to consider
inciting
incident
confronts the main
character
PLOT POINT TWO
4. Makes a decision
mid point
tries to solve the problem but
don’t yet have the skills
3. Looks further into it
Act one
Act two
the dramatic question
is answered
5. Takes action
/ no action
Hygiene
1. Becomes aware
climax
Setup
Confrontation
Act three
Resolution
48. Look at where
you want to delight them
www.flickr.com/photos/31878512@N06/4945216951/in/photostream
49. And also where
the biggest barriers may be
Image via Shutterstock
50. Plan for multiple
entry & exit points
www.flickr.com/photos/danieldslee/6913766642
51. Identify content, functional & interaction
elements to addresses the needs
www.flickr.com/photos/angietorres/4564135455
52. Ensure there is
a good balance
www.flickr.com/photos/17207222@N02/5601758478
53. Feel good
Delight
Not appropriate, or realistic
PLOT POINT ONE
2. Starts to consider
confronts the main
character
Hygiene
1. Becomes aware
PLOT POINT TWO
4. Makes a decision
mid point
tries to solve the problem but
don’t yet have the skills
3. Looks further into it
climax
the dramatic question
is answered
5. Takes action
/ no action
inciting
incident
Act one
Setup
Act two
Confrontation
Act three
Resolution
54. We cannot be at
the top all the time
www.flickr.com/photos/alexnormand/5992512756
55. Feel good
Delight
More realistic
PLOT POINT ONE
2. Starts to consider
inciting
incident
confronts the main
character
PLOT POINT TWO
4. Makes a decision
mid point
tries to solve the problem but
don’t yet have the skills
3. Looks further into it
Act one
Act two
the dramatic question
is answered
5. Takes action
/ no action
Hygiene
1. Becomes aware
climax
Setup
Confrontation
Act three
Resolution
62. Tailor messaging
& tone of voice
www.flickr.com/photos/pgoyette/168076182
63. Consider location
& cultural differences
www.flickr.com/photos/scary_mary/5700384580
64. “ Visit intent is likely to vary between these two
segments. For example, new visitors are less likely to
trust your brand and understand the key benefits to
shopping with you. ”
- Econsultancy
www.flickr.com/photos/g-ratphotos/3404474275
65. Make use of different ways
to capture & engage the user
www.flickr.com/photos/snugglepup/5225953124
66. Tell a continuos story
with delights along the way
www.maxfactor.co.uk
68. Ensure the message
is considered & delivered across devices
www.flickr.com/photos/visualpunch/7351572896
69. “ Content needs to be choreographed to
ensure the intended message is preserved on any
device and at any width “
- Trent Walton
www.thismanslife.co.uk/projects/lab/responsivewireframes/#desktop/
70. “ A good piece of UX has a narrative and clearly
tells a story, or at least part of a story on a particular
journey. As a designer - everything I do and make is
communicating something to someone. ”
- Steve Whittington
Design Director
Dare
www.flickr.com/photos/g-ratphotos/3404474275
71. Whoever it is for,
we always need to sell it
www.flickr.com/photos/jox1989/5143301136
72. It all start with
Once upon a time...
www.flickr.com/photos/snugglepup/3317051065
73. Or maybe
Once upon a design...
www.flickr.com/photos/snugglepup/3317051065