Top Banner
SOME THINGS YOU CAN’T WIREFRAME Wolf Becvar @wdbecvar webexpo 2013
84

Some Things You Can't Wireframe

Aug 17, 2014

Download

Design

Wolf Becvar

Wireframes are great for structuring content and demoing concepts. They help us think about important user experience aspects upfront. We can lay out and test-drive something in almost no time. We can gather feedback and iterate over and over. But here is something they can't: wireframes can't deliver the full experience.

This talk is not about wireframes it's about how to identify and apply customer touch points throughout a service. You will witness different approaches on how to design for experience. Which UX methods help us to identify and apply touch points? You will walk away from this talk with a flair for transforming your visitors into customers and a better understanding of the magic behind turning a like into love.
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Some Things You Can't Wireframe

SOME THINGSYOU CAN’TWIREFRAMEWolf Becvar@wdbecvar

webex

po 2

013

Page 2: Some Things You Can't Wireframe

Ahojhotgloo.com

#appvertising

@wdbecvar

WOLF BECVAR

Page 3: Some Things You Can't Wireframe

USER EXPERIENCE DESIGN

Page 4: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Can experience be designed?

Page 6: Some Things You Can't Wireframe

Credit: http://static.androidnext.de/apple-maps.jpg

Page 8: Some Things You Can't Wireframe

Credit: Richard Baker http://i.dailymail.co.uk/i/pix/2010/12/07/article-1336571-0C5E514A000005DC-166_634x402.jpg

Page 9: Some Things You Can't Wireframe

HACKCredit: http://p.twimg.com/AxjYgoRCMAEcQL5.jpg:large

Page 10: Some Things You Can't Wireframe
Page 11: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Page 12: Some Things You Can't Wireframe
Page 13: Some Things You Can't Wireframe

HACK

Page 14: Some Things You Can't Wireframe

Tweet me @wdbecvar 

HACK

Page 15: Some Things You Can't Wireframe

Usability is not everything.

Page 16: Some Things You Can't Wireframe

“If usability engineers designed a nightclub, it would be clean, quiet, brightly lit, with lots of places to sit down, plenty of bartenders, menus written in 18-point sans-serif, and easy to find bathrooms. But nobody would be there. They would all be down the street at Coyote Ugly pouring beer on each other.”

- Joel Spolsky

Page 17: Some Things You Can't Wireframe

Tweet me @wdbecvar 

1. What are customer touchpoints?

2. Why touchpoints matter?

3. How to identify/improve touchpoints?

4. How to translate customer touchpoints into a project?

5. Q & As

Page 18: Some Things You Can't Wireframe

Tweet me @wdbecvar 

1. What are customer touchpoints?

Page 19: Some Things You Can't Wireframe

Tweet me @wdbecvar 

DESIGN

Page 20: Some Things You Can't Wireframe

Tweet me @wdbecvar 

CONTEXT

Page 21: Some Things You Can't Wireframe

Tweet me @wdbecvar 

“[...] every point in time the customer touches or connects with your company throughout the entire product/service delivery; pre-, during and post-purchase.”

- Touchpoint Experience (2004)

Page 22: Some Things You Can't Wireframe

Tweet me @wdbecvar 

“[...] every point of contact - online and off each communication, human resource, branding, marketing and sales process initiative creates touchpoints ...

Page 23: Some Things You Can't Wireframe

Tweet me @wdbecvar 

The quality of touchpoint experiences drives perceptions, actions and relationships.”

- Touchpoint Metrics (2003)

Page 24: Some Things You Can't Wireframe

Touchpoints =

Interactions

Page 25: Some Things You Can't Wireframe

Customer Service

SocialMedia

Channels

InteractiveMarketing

Digital Experience

Credit: http://incentmedia.files.wordpress.com/2009/10/customer-touch-points.gif

Page 26: Some Things You Can't Wireframe

Tweet me @wdbecvar 

How do I improve our customer experience?

Page 27: Some Things You Can't Wireframe
Page 28: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Page 29: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Page 30: Some Things You Can't Wireframe

Tweet me @wdbecvar Credit: http://joshunfried.com/wp-content/uploads/2010/10/wallmart_facebook.jpg

Page 31: Some Things You Can't Wireframe

Credit: http://www.rapha.cc

Page 32: Some Things You Can't Wireframe

Credit: http://www.rapha.cc

Page 33: Some Things You Can't Wireframe

Credit: http://techcrunch.com/Credit: http://www.rapha.cc

Page 34: Some Things You Can't Wireframe

Tweet me @wdbecvar 

2. Why touchpoints matter?

Page 35: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Touchpoints make or break a good experience.

Page 36: Some Things You Can't Wireframe
Page 37: Some Things You Can't Wireframe
Page 38: Some Things You Can't Wireframe
Page 39: Some Things You Can't Wireframe
Page 40: Some Things You Can't Wireframe
Page 41: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 42: Some Things You Can't Wireframe

Tweet me @wdbecvar 

“We connect people who have space to spare with those who are looking for a place to stay. Guests can build real connections with their hosts, gain access to distinctive spaces, and immerse themselves in the culture of their destinations ...”

- airbnb.com

Page 43: Some Things You Can't Wireframe

Credit: http://techcrunch.com/

Page 44: Some Things You Can't Wireframe

Credit: http://techcrunch.com/

Page 45: Some Things You Can't Wireframe

Credit: http://techcrunch.com/

Page 46: Some Things You Can't Wireframe

Credit: http://techcrunch.com/

Page 47: Some Things You Can't Wireframe

Credit: http://techcrunch.com/

Page 48: Some Things You Can't Wireframe

Credit: http://techcrunch.com/2011/07/31/another-airbnb-victim-tells-his-story-there-were-meth-pipes-everywhere/

Page 49: Some Things You Can't Wireframe
Page 50: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 51: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 52: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 53: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 54: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 55: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 56: Some Things You Can't Wireframe

Credit: http://www.airbnb.com

Page 57: Some Things You Can't Wireframe

Tweet me @wdbecvar 

3. How to identify/improve customer touchpoints?

Page 58: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Touchpoints evolve from user insights

Credit: http://wvs.topleftpixel.com/photos/2013/05/lego_heads_01.jpg

Page 59: Some Things You Can't Wireframe

Tweet me @wdbecvar 

RESEARCH

Credit:http://www.scifinow.co.uk/wp-content/uploads/2013/02/sleepy-hollow-765071l.png

Page 60: Some Things You Can't Wireframe

Credit: http://2.bp.blogspot.com/-nbAoHKQqGcM/TYouAEwFE0I/AAAAAAAABvU/y7JW7o5-zlM/s1600/IMG_3872.JPG

Don’t just scratch

the surface

Page 61: Some Things You Can't Wireframe

It’s about the

INSIGHTS

Credit: http://lh3.ggpht.com/-G6C6bHMPsvI/UB9GDxBMKII/AAAAAAAAABU/aA0j_eJ7sBE/swim_with_sharks.jpeg

Page 62: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Research Concept Build

customer surveys

benchmark

usability testing

stakeholder interviews

experience maps

user test

sitemapflowchartwireframing

design<code/>

Run

Page 63: Some Things You Can't Wireframe

Tweet me @wdbecvar 

The customer experience process starts at the moment the customer becomes aware of your company.

Page 64: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Map out a customer journey

Page 65: Some Things You Can't Wireframe

Tweet me @wdbecvar 

•documents individual user NEEDS.

•illustrates INTERACTIONS, necessary to fulfill needs.

•EMOTIONAL STATES a user experiences throughout the process.

Customer Journey Map

Credits: Chris Risdon

Page 66: Some Things You Can't Wireframe

Tweet me @wdbecvar 

•Encourage conversation and collaboration.

•Highlight the flow of the customer

experience.

•Enable stakeholders to discuss

opportunities to improve CX.

Key Benefits

Credits: Chris Risdon

Page 68: Some Things You Can't Wireframe

“We understand what is and what is not important to the customer in that experience and then we design a WOW experience to improve it.”

- Richard Sollery, Senior Director of Consumer Experiences, LEGO

Page 70: Some Things You Can't Wireframe

Tweet me @wdbecvar Credit: http://experiencematters.files.wordpress.com/2009/03/legowheel.png

Page 71: Some Things You Can't Wireframe

Tweet me @wdbecvar 

•Formal approach to describing experiences.

•Starts with the description of a specific customer.

•Life cycle of experiences: before, during & after.

•Easy to use and simple to understand.

Page 72: Some Things You Can't Wireframe
Page 75: Some Things You Can't Wireframe

tour

sign up

sign in

helpcontact

pricing

landingpage

copy

keyvisual

callto

action

IA

support

systemmailing

facebook

blog APP

twitter

customerforum

tutorials

newsletter

Usabilitywebsite

channels

Page 76: Some Things You Can't Wireframe

Tweet me @wdbecvar 

4. How to translate touchpoints into a project?

Page 77: Some Things You Can't Wireframe

Tweet me @wdbecvar Credit: http://img.geocaching.com/cache/35db4b04-246a-43c9-833f-231be7c75507.jpg

Page 78: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Break down the silos

Credit: http://www.michal-silosy.pl/nowa/download/tapeta1280x960.jpg

Page 79: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Can experience be designed?

Page 80: Some Things You Can't Wireframe

Tweet me @wdbecvar 

TEAMWORK

Credit: http://www.independent.co.uk/incoming/article8604460.ece/BINARY/original/Team-Sky.jpg

Page 81: Some Things You Can't Wireframe

Tweet me @wdbecvar 

“A beholder must create his own experience.”

- John Dewey, Philosopher

Page 82: Some Things You Can't Wireframe

THANK YOU@wdbecvar

PS: I’m very interested in new hacks :)If you spot one make sure to tag them #hackspotter

Page 83: Some Things You Can't Wireframe

Tweet me @wdbecvar 

Q&As

Page 84: Some Things You Can't Wireframe

Tweet me @wdbecvar 

LINKLIST•http://uxmag.com/articles/6-disciplines-for-reaching-customer-experience-maturity

•http://uxmag.com/articles/experience-maps-identify-inefficiencies-and-opportunities

•http://uxmag.com/topics/customer-experience

•http://uxmag.com/articles/6-disciplines-for-reaching-customer-experience-maturity

•http://www.useit.com/papers/heuristic/heuristic_list.html

•http://blogs.hbr.org/cs/2010/11/using_customer_journey_maps_to.html

•http://www.dubberly.com/articles/interactions-the-experience-cycle.html

•http://www.adaptivepath.com/ideas/the-anatomy-of-an-experience-map