View
19
Download
3
Tags:
Embed Size (px)
DESCRIPTION
Séamus Byrne presents a customised version of What's The Story? focusing on infusing websites with the craft of storytelling
Citation preview
What’s the Story?Infusing Website Experiences with Storytelling!
Séamus T. Byrne
My Story• Séamus Byrne (@seamusbyrne)‣ Creative Director @graphic_mint
‣ My Background
‣ The Organic City
‣ Ongoing Narrative
Contents
• Why do Stories Matter?
• The Evolution of Storytellingwith Technology
• Storytelling in Web Design‣ Business Stories
‣ Customer Stories
‣ User Stories
• Improving Websites with Storytelling
Why do Stories Matter?“We experience life as a series of ongoing narratives, as conflicts, characters, beginnings, middles and ends.”
– Dr. Walter Fischer
Stories and Community• It is through the sharing of stories that communities:‣ Build their identities, pass on tradition, construct meaning
The Evolution of Storytelling with Technology• Allowing storytellers to re-craft compelling tales in
emerging media
Lascaux Caves• Estimated to be 17,000 years old
• First recorded evidence of human storytelling
• Depicting 2,000 figures: animals, humans and abstract signs
Once Upon a Time...
Oral Tradition• Stories passed on from Generation to Generation
• Verbally transmitted folktales, sayings, ballads, song or chants
• Most commonly referenced by the bard
Written Alphabet• Text Replaced the Oral Tradition (partially)
• 850 B.C. Homer the bard writes the oldest work of western literature: The Iliad
The Book of Kells• Circa 800 A.D. the book depicts the 4 Gospels
• Illuminated manuscript: juxtaposed pictorial art and text
The Printing Press• Brought about by Gutenberg in 1439
• More people had access to new and old knowledge
• Brought about a scientific revolution, rise of the novel
The 20th Century• Film, Radio and Television were born
• Story was re-purposed for the different media
Linear Stories
The Internet• In 1969, the Internet was born
• The Digital Age: Digital and Interactive Storytelling
The Modern Narrative• Web 2.0: Blogging, Micro-blogging, Social Networks
• New Media: Mobile, Broadband, Podcasting
• Author-ville: Participation via UGC and feedback
The new bards are here!
Non-Linear Stories
The Plot Thickens• Narratives are “literally” everywhere
Moores LawMoore’s Law• The number of transistors that can be placed inexpensively on
integrated circuit has doubled approximately every two years.
Websites• Tablet, Mobile, TV...
Websites• Use Storytelling for consistency across touchpoints
Storytelling in Web Design• What Stories do designers encounter:
‣ The Web Designer’s Story
‣ Business Stories
‣ Customer Stories
‣ User Stories
The Web Designer’s Story
The Web Designer’s Story
Enterprise
Ecosystem
The Web Designer’s Story
Enterprise
Ecosystem
The Web Designer’s Story
Enterprise
Brand
Ecosystem
The Web Designer’s Story
Enterprise
Product
Brand
Ecosystem
The Web Designer’s Story
Enterprise
Product
ServiceBrand
Ecosystem
The Web Designer’s Story
Enterprise
Product
ServiceBrand
Touch-points
Business Stories
• Corporate Narrative: Mission, Vision, Values, Name, Corporate Identity
Corporate
Business Stories
• Corporate Narrative: Mission, Vision, Values, Name, Corporate Identity
Corporate
• PR/Advertising Narrative: Press Releases, News and Events, Blog Posts, Social Networks, History, Annual Reports, Advertising
PR/Advertising
Business Stories
• Corporate Narrative: Mission, Vision, Values, Name, Corporate Identity
Corporate Brand
• Brand Narrative: Offering (product/service), Tone, Messaging, Positioning, Copy, Metaphor, Features, Advantages
• PR/Advertising Narrative: Press Releases, News and Events, Blog Posts, Social Networks, History, Annual Reports, Advertising
PR/Advertising
Corporate
Brand
PR/Advertising
Public Domain
Business Stories
Corporate
Brand
PR/Advertising
Public Domain Customer
Business Stories
Corporate
Brand
PR/Advertising
Public Domain Customer User
Business Stories
Customer and User Stories
• The Public Domain’s Story: Collective Public Opinion, recommendations, reviews, word of mouth, viral
Public Domain
Customer and User Stories
• The Public Domain’s Story: Collective Public Opinion, recommendations, reviews, word of mouth, viral
Public Domain Customer
• The Customer’s Story: The path a customer takes towards purchasing an offering
Customer and User Stories
• The Public Domain’s Story: Collective Public Opinion, recommendations, reviews, word of mouth, viral
Public Domain Customer
• The Customer’s Story: The path a customer takes towards purchasing an offering
User
• The User’s Story: The path a user takes when using a product and/or service
The Customer’s Story
CustomerCorporate
Brand
PR/Advertising
General Public
Public Domain
Websites
WWW
The Customer’s Story
CustomerCorporate
Brand
PR/Advertising
General Public
Public Domain
Websites
WWW
Expectations
When the need arises, the customer has to successfully discover and find your offering
Customer Journey
The Customer’s Story
Discover
Purchase
Examine
When the need arises, the customer has to successfully discover and find your offering
Customer Journey
The Customer’s Story
Discover
Purchase
Examine
Customer must easily understand the offering is appropriate for their needs
When the need arises, the customer has to successfully discover and find your offering
Customer Journey
Ease and flowof purchaseexperience
The Customer’s Story
Discover
Purchase
Examine
Customer must easily understand the offering is appropriate for their needs
When the need arises, the customer has to successfully discover and find your offering
Customer Journey
Ease and flowof purchaseexperience
The Customer’s Story
Discover
Purchase
Examine
Customer must easily understand the offering is appropriate for their needs
Sales and marketing have ensured a successful customer experience, the plane has landed but the journey is not over yet...
The User’s Story
User Journey begins by interacting with the offering:
User Journey
Use
User Goal
The User’s Story
User Journey begins by interacting with the offering:
User Journey
Use
User Goal
Easy to Use
The User’s Story
User Journey begins by interacting with the offering:
User Journey
Use
User Goal
Easy to Use
Useful
The User’s Story
User Journey begins by interacting with the offering:
User Journey
Use
User Goal
Easy to Use
UsefulMeaningful
The User’s Story
User Journey begins by interacting with the offering:
User Journey
Use
User Goal
Easy to Use
UsefulMeaningful
User-centred design brings the user to their goal.
The User’s Story
User Journey begins by interacting with the offering:
User Journey
Use
User Goal
Easy to Use
UsefulMeaningful
User-centred design brings the user to their goal.
Expectations
Expectations
Corporate
Brand
PR/Advertising
Public Domain
Customer
User
What’s the Story?
Corporate
Brand
PR/Advertising
Public Domain
Customer
User
Manage Stories via Websites
The Website
Touchpoint
Corporate
Brand
PR/Advertising
Public Domain
Customer
User
Manage Stories via Websites
The Website
Touchpoint
Love Stories• The “love story” between your client and their customer is
based on real commitment, understanding and connection
• Increase the chances of brand loyalty and offering adoption
End-to-End Story Experience
End-to-End Story Experience
Customer
End-to-End Story Experience
Customer
User
End-to-End Story Experience
Customer
User
General Public
Prospect
Beginning Middle End
Advocate
The Advocate
• I love product “x”
Example: Apple Stories• Emotional connection with customer based on Corporate,
PR and Brand stories.
• Meeting Expectations, consistency between stories
• Founded in garage, Adam and Eve eating forbidden fruit
Where Storytelling Goes Wrong!
Where Storytelling Goes Wrong!
General Public
Where Storytelling Goes Wrong!
General Public
Prospect
Where Storytelling Goes Wrong!
General Public
Prospect
Customer
Where Storytelling Goes Wrong!
General Public
Prospect
Customer U
ser
Where Storytelling Goes Wrong!
General Public
Prospect
Customer U
ser
Advocate
Where Storytelling Goes Wrong!
General Public
Prospect
Customer U
ser
Advocate
Where Storytelling Goes Wrong!
General Public
Prospect
Customer U
ser
Poor Advertising
Unclear Content Faulty
Shopping Cart Not an
easy-to-use App
Advocate
Unleash the Storyteller• Crafting a better website experience for your visitors
Discover the Story• Unearth the story central to the overall customer and user
experience (story experience).
Discover the Story• Avoid complexity by abstraction and metaphor
Map Story World• Map ecosystem and identify touch-points
• Domain, Given Circumstances, Audience
Research the Characters• What are the customer and user goals and expectations?
Outline Basic Plot• Craft a story designed to provide customers and/or users
with an optimal Beginning, Middle, End: Blue Sky Scenarios
• Remove their obstacles (- to +) (tension, time)
Set the Stage• Every element from language, Choices available, and even UI
arrangement can be used to support main story
• Presentation/visual structure, elements from theatre
Share the Script• Communicate story plan to other departments
Why Use Storytelling?
• Deeper Meaning: Enhance UCD with another layer of relevance
• Automatic Advantage: Humans are hardwired to storytelling
• Emotional response: Positive reactions increase adoption
• Cohesive Experience: Harmonic, Holistic and end-to-end
FIN.• Telling stories is as basic to human beings as eating. More so, in
fact, for while food makes us live, stories are what make our lives worth living. They are what make our condition human.
- Richard Kearny, On Stories
Text
• @seamusbyrne
• www.graphicmint.com
Thank you!
Séamus Byrne
Image Credits• http://onedollardietproject.files.wordpress.com/2009/05/img_2666.jpg
• http://www.parkland.lib.sk.ca/SASM%202009.jpeg
• http://designgraphics.ncsu.edu:82/designtech/img/Research2008_NonLinearNarative.jpg
• http://storycharts.ca/wp-content/uploads/2009/08/SchindlersList.jpg
• http://mtcompletecomm.com/images/res_sheets/overviewLG.jpg
• http://yamz.files.wordpress.com/2009/04/bard_1.jpg
• http://3.bp.blogspot.com/_vxEaWyLdV44/SwMNMuan0fI/AAAAAAAAAME/JZ2WzJlgaGM/s1600/TRUFFLES+-+dog.jpg
• http://media.photobucket.com/image/map%20storyworld/griffinial/MapleStory_world_map.png
• http://wiki.fluidproject.org/download/attachments/3904542/Kivio-personas-overview.png
• http://www.linlindesigns.com/images/exploreChicago_userScenario.jpg
• http://villagetheatre.files.wordpress.com/2009/08/p1050025.jpg
• http://img709.imageshack.us/i/sansspicture.jpg/
• http://hughgrahamcreative.com/images/blog-pilgrimsprogress.jpg
• http://2pass.files.wordpress.com/2009/10/bard.jpg