View
2.240
Download
0
Category
Preview:
DESCRIPTION
Slides from my talk around storytelling in design at the UCD 2013 Conference in London http://2013.ucduk.org. 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 UCD 2013 I talked about why as well as how we can use it, from the start, during definition and development as well as going forwards.
Citation preview
D!"#$%#%$ &r'(%) "*'r+*!,,#%$ The power of stories & how they can be used in user centred design
by Anna Dahlström | @annadahlstrom@ucduk #ucd2013
O%-! (p'% & *#.! in a city called ‘Lund’...
xxxxwww.flickr.com/photos/ulfk/7976687420
/!r! w0!r! plenty of story time
www.flickr.com/photos/excomedia/sets/72157622519563566with/5233990438
W! *r&v!,,!) through those stories
www.flickr.com/photos/conorkeller/7860288604
“ W! &r! &" & "p!-#!" addicted to stories. ”- /! S*'r+*!,,#%$ A%#.&, b+ J'%&*0&% G'**"-0&,,
www.flickr.com/photos/namkeng/3209117837
S*'r+*!,,#%$ Storytelling
S*'r+*!,,#%$
Ev!r+ br&%) wants to tell their story
www.flickr.com/photos/kelstew/3658900542
www.flickr.com/photos/g-ratphotos/3404474275
“ If +'( -&%’* *!,, #*, you can’t sell it. ”- P!*!r G(b!r
www.flickr.com/photos/g-ratphotos/3404474275
“ R!"(,*" r!p!&*!),+ "0'w" 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."
E%*!r#%$ 1-*#'%&, w'r,)" radically alters the way information is processed. ”
- F&"*C'.p&%+, W0+ "*'r+*!,,#%$ #" *0! (,*#.&*! w!&p'%
S*'r#!" as persuasion tools
www.flickr.com/photos/saucef/7184615025
N'* 2("* for messaging but alsoan integral part of the design process
www.flickr.com/photos/g-ratphotos/3404474275
“ S*'r+*!,,#%$ is at the heart of everything ”- S*!v! L!v#**
www.flickr.com/photos/carlosfpardo/6791950592
/!r! #" an element of magic involved
www.flickr.com/photos/declanjewell/2181100986
‘ N'w +'( "!! .!. ’
J&v#!r P!r3 via http://the-wonderist.com/2013/11/05/how-to-see-things-with-new-eyes
‘ Now you don’t. ’
Q(!!%#! L#&'’" ‘W!%$!%% #% W'%)!r,&%)’ via www.boredpanda.org/wengenn-in-wonderland-sioin-queenie-liao
W0&* )' w! w&%* '(r ("!r" *' "!!?What is the story we want to tell?
W0!r! )' w! w&%* to take them?
www.flickr.com/photos/g-ratphotos/3404474275
“ H#"*'r#-&,,+, stories have always been igniters of action, moving people to do things. ”
- P!*!r G(b!r
Ev!r+ "*'r+ takes us on a journey
www.flickr.com/photos/photomequickbooth/3966382067
S*'r+*!,,#%$ can provide powerful call to actions
www.flickr.com/photos/piermario/4188959762
W0&* makes for a good story?
/! !%)
/! b&"#- structure of a story
A b!$#%%#%$ A .#)),!
Dr&.&*(r$+ knowing how to apply & structure
elements to tell a story
A-* *0r!!
/r!! act structure
A-* '%!Setup Resolution
A-* *w'Confrontation
inciting incident mid point climax
confronts the main character
tries to solve the problem but don’t yet have the skills
the dramatic question is answered
PLOT POINT ONE PLOT POINT TWO
A-* *0r!!
/r!! act structure - applied to UCD
A-* '%!Setup Resolution
A-* *w'Confrontation
inciting incident mid point climax
confronts the main character
tries to solve the problem but don’t yet have the skills
the dramatic question is answered
PLOT POINT ONE PLOT POINT TWO
1. B!-'.!" &w&r! 5. T&4!" &-*#'%/ %' &-*#'%
4. M&4!" & )!-#"#'%
3. L''4" 5r*0!r #%*' #*
2. S*&r*" *' -'%"#)!r
www.flickr.com/photos/perolofforsberg/6691744587
I &"4!) .+ )&) for 3 principles around good storytelling
01 Captures the imagination
www.flickr.com/photos/g-ratphotos/3404474275
“ If +'( -&% imagine yourself in a situation, it’s infinitely scarier. ”
- Br&) F&,-0(4
U"!r" %!!) to be able to relate
www.flickr.com/photos/estherase/1292315618
W! %!!) *' understand who they are
www.flickr.com/photos/cannedtuna/4852756417
www.flickr.com/photos/g-ratphotos/3404474275
“ I %!!) *' (%)!r"*&%) 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. ”
- S*!v! W0#**#%$*'%Design Director
Dare
02 The dynamic of the story
W0&* &r! *0! !v!%*"& people that tie it all together
www.flickr.com/photos/erin_ryan/2584551310
/! !v!r #.p'r*&%*red thread
www.flickr.com/photos/pulpolux/3692396234
03 An element of surprise
www.flickr.com/photos/g-ratphotos/3404474275
“ I% $!%!r&, 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. ”
- Br&) F&,-0(-4
I%-,()! an element of surprise & exploration
www.flickr.com/photos/conorkeller/4028043294
L!* users find their way around your content
www.flickr.com/photos/conorkeller/3879321839
www.flickr.com/photos/soundslogical/4255801733
C'%"#)!r non-linear & new forms of storytelling
H'w do we go about it?
A-* *0r!!
I* "*&r*" with this
A-* '%!Setup Resolution
A-* *w'Confrontation
inciting incident mid point climax
confronts the main character
tries to solve the problem but don’t yet have the skills
the dramatic question is answered
PLOT POINT ONE PLOT POINT TWO
1. B!-'.!" &w&r! 5. T&4!" &-*#'%/ %' &-*#'%
4. M&4!" & )!-#"#'%
3. L''4" 5r*0!r #%*' #*
2. S*&r*" *' -'%"#)!r
A-* *0r!!
I)!%*#f+ key points
A-* '%!Setup Resolution
A-* *w'Confrontation
inciting incident mid point climax
confronts the main character
tries to solve the problem but don’t yet have the skills
the dramatic question is answered
PLOT POINT ONE PLOT POINT TWO
1. B!-'.!" &w&r! 5. T&4!" &-*#'%/ %' &-*#'%
4. M&4!" & )!-#"#'%
3. L''4" 5r*0!r #%*' #*
2. S*&r*" *' -'%"#)!r
Hygie
neFe
el go
odDe
light
www.flickr.com/photos/31878512@N06/4945216951/in/photostream
L''4 &* where you want to delight them
www.flickr.com/photos/kruger_otto/5581886586
A%) &,"' where the biggest barriers may be
P,&% f'r multiple entry & exit points
www.flickr.com/photos/danieldslee/6913766642
I)!%*#f+ content, functional & interaction elements to addresses the needs
www.flickr.com/photos/angietorres/4564135455
E%"(r! there is a good balance
www.flickr.com/photos/17207222@N02/5601758478
A-* *0r!!
N'* appropriate, or realistic
A-* '%!Setup Resolution
A-* *w'Confrontation
inciting incident
mid point climaxconfronts the main
charactertries to solve the problem but
don’t yet have the skillsthe dramatic question
is answered
PLOT POINT ONE PLOT POINT TWO
1. B!-'.!" &w&r! 5. T&4!" &-*#'%/ %' &-*#'%
4. M&4!" & )!-#"#'%
3. L''4" 5r*0!r #%*' #*
2. S*&r*" *' -'%"#)!r
Hygie
neFe
el go
odDe
light
W! -&%%'* be at the top all the time
www.flickr.com/photos/alexnormand/5992512756
A-* *0r!!
M'r! realistic
A-* '%!Setup Resolution
A-* *w'Confrontation
inciting incident mid point climax
confronts the main character
tries to solve the problem but don’t yet have the skills
the dramatic question is answered
PLOT POINT ONE PLOT POINT TWO
1. B!-'.!" &w&r! 5. T&4!" &-*#'%/ %' &-*#'%
4. M&4!" & )!-#"#'%
3. L''4" 5r*0!r #%*' #*
2. S*&r*" *' -'%"#)!r
Hygie
neFe
el go
odDe
light
D!,#v!r#%$ the right content at the right time
W! %!!) to know:
W0&* w! w&%* to say
W0&* w! w&%* our users to do
U"!r" are different
www.robotshop.com/blog/where-is-wall-e-1391
I)!%*#f+ content & functionality for each main user
www.flickr.com/photos/soundslogical/4255801733
L''4 &* how to tailor views based on who the user is & their behaviour
C'%*6* & prior knowledge plays a key role
www.flickr.com/photos/pgoyette/168076182
T&#,'r messaging & tone of voice
C'%"#)!r location & cultural differences
www.flickr.com/photos/scary_mary/5700384580
www.flickr.com/photos/g-ratphotos/3404474275
“ V#"#* #%*!%* 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. ”
- E-'%"(,*&%-+
M&4! ("! 'f different ways to capture & engage the user
www.flickr.com/photos/snugglepup/5225953124
T!,, & continuos story with delights along the way
www.maxfactor.co.uk
C'%"#)!r & &)&p* your message across touch points
www.flickr.com/photos/visualpunch/7351572896
E%"(r! *0! .!""&$! is considered & delivered across devices
www.thismanslife.co.uk/projects/lab/responsivewireframes/#desktop/
“ C'%*!%* %!!)" *' b! -0'r!'$r&p0!) to ensure the intended message is preserved on any
device and at any width “- Tr!%* W&,*'%
www.flickr.com/photos/g-ratphotos/3404474275
“ A $'') p#!-! 'f 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. ”
- S*!v! W0#**#%$*'%Design Director
Dare
www.flickr.com/photos/jox1989/5143301136
W0'!v!r our work is for, we always need to sell it
I* &,, "*&r* w#*0 Once upon a time...
www.flickr.com/photos/snugglepup/3317051065
Or maybeO%-! (p'% & )!"#$%...
www.flickr.com/photos/snugglepup/3317051065
www.flickr.com/photos/perolofforsberg/6691744587
A%+ questions?
www.flickr.com/photos/katerha/8435321969
/&%4 +'(@annadahlstrom | anna.dahlstrom@gmail.comwww.annadahlstrom.com
Recommended