telling stories through design
DESCRIPTION
Web Directions @Media, London 11:45, 11 June 2010 Hannah Donovan talks about the designer as a storyteller—especially in terms of the importance of this role within a team. Improve your output as a designer by taking a closer look at influencing the input. As a visual narrator we help to visualise, inspire and curate for the people we work with as well as connecting scenarios around the larger product saga that supports the interfaces we design. By examining your input, make your output more effective with your team and users alike, paving paths for people to tell their own stories as your product evolves over time.TRANSCRIPT
TELLING STORIES THROUGH DESIGN
11 June 2010 — Hannah Donovan
MY FRUSTRATION...
Prologue
Prologue
IT’S NOT YOUR DESIGN OUTPUT THAT WILL MAKE OR BREAK THE PRODUCT, IT’S ALL THAT OTHER STUFF...
ALL THE INPUTS.
Prologue
IT DOESN’T MATTER HOW TALENTED THE PEOPLE ARE, IF THE PROCESS SUCKS, THE PRODUCT IS SUCKS.
Prologue
Prologue
Prologue
SO WHAT DOES THIS HAVE TO DO WITH STORYTELLING?
YOU ARE THE STORYTELLERPart 1
YOUR SUPERPOWER: YOU CAN DRAW
Part 1
Examples of sequential visuals: Comics & film storyboards
Art credit: Ron Smith
Cred
it: L
ucas
Art
s
My (crappy) sketches for Last.fm’s Best of 2009 feature
1.The finished product
1.Some of our tools
1.
For Phase 2, we will round out the group to showcase the breadth of scrobblers and possibly
include content like: deep links to build, tutorials, developer links and generally more granularity.
JOIN THE GROUPFOR MORE UPDATES!
IN BETA
DOES IT SCROBBLE?The answer is almost
always, YES!
Scrobbling tracks what you listen to
in a media player. Learn more.
Looking for scrobbling tips? Trade
them in the forums.
Don’t see your favourite? Check out Build for the more exotic
scrobblers (more always being added)
Spotify HypeMachine MOGNEW & FEATURED SCROBBLERS
PLUS MANY MORE — WHICH DO YOU USE?
page content
Learn More » Learn More » Learn More »
iTunesiPOdWindows Media PlayerWinamp
AmarokAndroidlalaCoverSutra
More…
Featured content could be the latest ‘o!cial’ partners or
just new cool scrobbling clients. Since this content changes
regularly, it might make sense to do these using a ‘gumball’
template.
More easily maintainable list for our veteran scrobbling
clients.
A hint that there is more on Build, but that it’s a work in
progress.
Letting users know we will be adding more soon
House style “sketchy” visual
PART 1 — RECAP• Drawing in front of, or with others motivates and inspires
• Sets the stage for the story, puts everyone on a similar track.
• Starts a dialogue, breaks down barriers, allows others to start adding & gives them peace of mind
Part 2
GOOD TEAMWORK IS STORYTELLING
STORYTELLING COMES FROM AN ORAL TRADITION
Part 2
STORYTELLING IN AGILE
Part 2
MAKING CONVERSATIONS HAPPEN
Part 2
ARM YOURSELF WITH A DRAWING (OR THE ABILITY TO MAKE ONE) AND A STORY.
Part 2
THINK LIKE A FILM CREW
Part 2
LET INFLUENCES IN. YOU’RE THE EDITOR.
Part 2
Bits & bobs of the overarching story arc
Tactical UI implementation for a single story…
PART 2 - RECAP• Get good at starting conversations. Put yourself at the centre of the narrative
• Take advantage of Agile to keep conversations flowing. Think like a film crew; edit against the plot.
• Like a serial publication, start with a story arc, then write as many stories as you need
STORYTELLING WITHIN AN ORGANISATION
Part 3
STORIES ARE ALREADY NATURAL FOR AN ORGANISATION.
Part 3
ORGANISATIONAL LORE
Part 3
Examples of lore collecting 2007 - 2010
Weaving user’s stories into the organisational lore…
A NARRATIVE APPROACH TO PRESENTATION
Part 3
STORIES: UP, DOWN& AROUND…
Part 3
A project that sparked educational storytelling
PART 3 — SUMMARY• Gather company lore & spread it
• Use a narrative approach to storytelling
• Give everyone (especially people up the chain) a story to tell.
YOUR TOOLKITPart 4
Part 4
BE MULTI-DISCIPLINARY
“PUT A LOT OF GUNS IN A LOT OF DRAWERS”.
Part 4
Part 4
WRITE BIG PARTS FOR YOUR USERS.
Guerilla user testing
WRITE IT DOWN AND PASS IT ON.
Part 4
DOING A 180
Part 4
PLACE:
TAKES EFFECT:DATE:
COMPONENT:
13 / 04 / 10
LONDON HQ
SPRINT 35 VERSION NUMBER: 1
DDM Template
Your NEW story here
PART 4 — RECAP• Don’t just design, learn a bit of everything
• Explore a lot of routes
• Write big parts for your users
• Write down your stories so people can refer to them later.
STORIES FOR THE END USER Part 5
“STORY IS ABOUT RESPECT FOR THE AUDIENCE”
Part 5
Part 5
“STORIES ARE ABOUT ARCHETYPES, NOT STEREOTYPES”
APPLY A CLASSIC NARRATIVE STRUCTURE TO SCENARIOS
Part 5
Part 5
HURDLING THE CONCEPTUAL MODEL
Part 5
THE “HOW” NEEDS TO BE A STORY
Part 5
SHOW NOT TELL.
Part 5
PART 5 — RECAP• Treat the audience with respect
• Don’t resort to clichés, create realistic scenarios
• Create ‘BME’ narratives around these scenarios
• Back *new* conceptual models with a story; attempt to show it, not tell it!
“STORIES ARE WHAT DREAMS ARE MADE OF”*
* Warning: late-night whisky quotation
Epilogue
Thanks for Listening!
CONTACT:Email: [email protected] / Twitter: @han
FLICKR POOL:http://www.flickr.com/groups/1456738@N23/pool
SOURCES & FURTHER READING:http://delicious.com/hannahdonovan/storytelling