The Odd Couple of UX Design

2,974
-1

Published on

PRPL Information Architect Tricia D'Antin explains the thought process behind merging business goals with user goals through user experience (UX) design.

Published in: Design
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,974
On Slideshare
0
From Embeds
0
Number of Embeds
163
Actions
Shares
0
Downloads
24
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

The Odd Couple of UX Design

  1. 1. THE ODD COUPLE OF UX DESIGN: MARRYING BUSINESS GOALS AND USER GOALS T R I C I A D ’ A N T I N
  2. 2. BUSINESS GOALS USER GOALS
  3. 3. DOES YOUR COMPANY HAVE A DYSFUNCTIONAL REL ATIONSHIP WITH YOUR USERS? WHY THIS HAPPENS WHY YOU SHOULD CARE WHAT YOU CAN DO ABOUT IT W H AT R E S U LT S YOU CAN EXPECT
  4. 4. WHY DOES THIS HAPPEN?
  5. 5. WHY DOES THIS HAPPEN? ( EXAMPLE 01) BUSINESS GOAL USER GOAL Increase Sales “All sales are final!” Shop Risk-Free “Can I return this banana slicer?”
  6. 6. WHY DOES THIS HAPPEN? ( EXAMPLE 02) BUSINESS GOAL USER GOAL GROW OUR MAILING LIST “Log in to view properties!” ASSESS PRODUCT VALUE “Is this even worth more spam and another password I have to remember?”
  7. 7. WHY DOES THIS HAPPEN? ( EXAMPLE 03) BUSINESS GOAL USER GOAL Generate Ad Revenue “Click the dancing baby!” View Content “I just want to read the news.”
  8. 8. WHY DOES THIS HAPPEN? DARK PAT TERNS “Dark Patterns are user interfaces that are designed to trick people. Normally when you think of “bad design,” you think of laziness or mistakes. These are known as design anti-patterns. Dark Patterns are different – they are not mistakes, they are carefully crafted with a solid understanding of human psychology, and they do not have the user’s interests in mind.” Types: Bait and Switch Disguised Ads Faraway Bill Friend Spam Hidden Costs Misdirection Price Comparison Prevention Privacy Zuckering Roach Motel Road Block Sneak Into Basket Trick Questions
  9. 9. WHY DOES THIS HAPPEN? DARK PAT TERN 1: J AVA Misdirection “THE ATTENTION OF THE USER IS DIRECTED TO ONE THING IN ORDER TO DISTRACT IT FROM ANOTHER.”
  10. 10. WHY DOES THIS HAPPEN? DARK PAT TERN 2: COSTCO Tr i c k Q u e s t i o n s “THE USER IS REQUIRED TO RESPOND TO A QUESTION (TYPICALLY IN THE CHECKOUT PROCESS), WHICH, WHEN GLANCED UPON QUICKLY APPEARS TO ASK ONE THING, BUT IF READ CAREFULLY, ASKS ANOTHER THING ENTIRELY. THIS PATTERN WORKS BECAUSE IT IS NORMAL FOR USERS TO EMPLOY HIGHSPEED SCAN-READING ON THE WEB – SEE STEVE KRUG: ‘WE DON’T READ PAGES. WE SCAN THEM.’”
  11. 11. WHY DOES THIS HAPPEN? DARK PAT TERN 3: APPLE Privacy Zuckering “THE ACT OF CREATING DELIBERATELY CONFUSING JARGON AND USER INTERFACES WHICH TRICK YOUR USERS INTO SHARING MORE INFO ABOUT THEMSELVES THAN THEY REALLY WANT TO.”
  12. 12. WHY SHOULD YOU CARE?
  13. 13. WHY SHOULD YOU CARE? BRAND REL ATIONSHIPS ARE LIKE HUMAN REL ATIONSHIPS
  14. 14. WHY SHOULD YOU CARE? YOU’RE TRYING TO CHANGE BEHAVIOR “You will be the least successful if you let common sense be you guide.”
  15. 15. WHAT CAN YOU DO ABOUT IT?
  16. 16. WHAT CAN YOU DO ABOUT IT? THE DESIGN THINKING PROCESS DEFINE RESEARCH IDEATION PROTOTYPE CHOOSE IMPLEMENT LEARN
  17. 17. WHAT CAN YOU DO ABOUT IT? DOUG’S AUTO REPAIR ( EXAMPLE COMPANY)
  18. 18. WHAT CAN YOU DO ABOUT IT? STEP 1: DEFINE What’s the problem? “Well, team, sales aren’t where they need to be to keep this place afloat!” How will we know if we’re successful? Your key performance metrics (KPIs) should be timely, specific, measurable, etc. “We want to increase sales by 50% per month.”
  19. 19. WHAT CAN YOU DO ABOUT IT? STEP 1: DEFINE Who’s the audience? New customers Returning customers Nathan has been scammed before. He’s new to the area, and he’s looking for a mechanic he can trust. He comes to Doug’s Auto Repair for an oil change, hoping they don’t tell him he needs a new everything. He really can’t afford a big bill right now. Carla’s car is making a funny scraping noise. Last time she came to Doug’s, she wasn’t sure if her car really needed all that work, but she’s a very trusting person. She wishes she was bold enough to ask more questions and knowledgeable enough to judge the answers.
  20. 20. WHAT CAN YOU DO ABOUT IT? STEP 2: RESEARCH What’s causing the issues? What are the obstacles? How have other people solved this problem? “I don’t have many repeat customers, so business is slow. To make up for it, I’ve been rewarding my team for upselling customers on services. We want the most work we can get out of each car, and people are skeptical of that.” “We do a good job, but they only care about the price, and many places are cheaper, faster, and only recommend the bare minimum.” Competitive Analysis Solutions “It’s hard to get our customers to trust us, take our advice, and come back.” Testimonials Reviews Social media engagement Offering quote estimates online “Ask the mechanic” forms Friendly imagery Touting experience “Trustworthy” tone and diction
  21. 21. WHAT CAN YOU DO ABOUT IT? STEP 3: IDEATION What do you want + what do your users want? New Customers Repeat Customers Make an appointment Find directions Get an accurate diagnosis of their car’s problems Get a competitive quote Judge the trustworthiness of the mechanic Compare mechanics Get a detailed understanding of the work involved Understand why the work is required Get a sense of quality assurance And they want it all in 30 minutes Make an appointment Get an accurate diagnosis of their car’s problems Get a competitive quote Have a relationship with a mechanic Receive personalized service Reference their repair history Get a detailed understanding of the work involved Understand why the work is required Get a sense of quality assurance Gain knowledge of their car’s future needs And they want it all in 30 minutes
  22. 22. WHAT CAN YOU DO ABOUT IT? STEP 3: IDEATION Focus on the most common goals. New Customers Repeat Customers Make an appointment Find directions Get an accurate diagnosis of their car’s problems Get a competitive quote Judge the trustworthiness of the mechanic Compare mechanics Get a detailed understanding of the work involved Understand why the work is required Get a sense of quality assurance And they want it all in 30 minutes Make an appointment Get an accurate diagnosis of their car’s problems Get a competitive quote Have a relationship with a mechanic Receive personalized service Reference their repair history Get a detailed understanding of the work involved Understand why the work is required Get a sense of quality assurance Gain knowledge of their car’s future needs And they want it all in 30 minutes
  23. 23. WHAT CAN YOU DO ABOUT IT? STEP 3: IDEATION Brainstorm Solutions Common Goals Solutions Make an appointment Find directions Get an accurate diagnosis of their car’s problems Get a competitive quote Judge the trustworthiness of the mechanic Compare mechanics Get a detailed understanding of the work involved Understand why the work is required Get a sense of quality assurance And they want it all in 30 minutes Have a relationship with a mechanic Receive personalized service Reference their repair history Gain knowledge of their car’s future needs “Make an appointment” form Embedded Google maps A “WebMD” for cars A “compare prices” at other shops feature A profile for each mechanic A customer-generated “trustworthiness score” for each mechanic A customer profile with their assigned mechanic A digital diagnostic report of the car Quick access to past diagnostic reports and repair plans A visual, interactive repair plan with descriptions in plain language A calendar of future repairs and maintenance Live push-notification updates on the car’s progress
  24. 24. WHAT CAN YOU DO ABOUT IT? N AV I G AT I O N STEP 4: PROTOTYPE Te s t Yo u r I d e a s . Techniques like paper prototyping and click-through are quick and easy ways to literally sketch out an idea or mock up a low fidelity wireframe, ask someone to interact with it - using a little bit of imagination - and observe what they struggle with. S U BM I T
  25. 25. WHAT CAN YOU DO ABOUT IT? STEP 5: CHOOSE “The absence of these fluff-features allows the most important users to master the software faster without having to deal with low-value complexity.” - Ty n e r B l a i n Which ideas should we keep? A customer account to access info “Make an appointment” form View their assigned mechanic Embedded Google maps Access a digital diagnostic report of the car A “WebMD” for cars Access past diagnostic reports and repair plans A “compare prices” at other shops feature Phase 2! A visual, interactive repair plan with descriptions in plain language Phase 2! A profile for each mechanic A calendar of future repairs and maintenance A customer-generated “trustworthiness score” for each mechanic Live push-notification updates on the car’s progress Phase 2!
  26. 26. WHAT CAN YOU DO ABOUT IT? STEP 6: IMPLEMENT Plan the Website. When deciding how to prioritize when to implement ideas, there’s the Kano Analysis. There are three classifications of requirements. 1. Must be. Functional barriers to entry – without these capabilities, customers will not use the product (e.g. UL approval). 2. More is better. Dimensions along a continuum with a clear direction of increasing utility (e.g. battery life or song capacity). 3. Surprise and delight. Capabilities that differentiate a product from its competition (e.g. the nav-wheel on an iPod). - Ty n e r B l a i n
  27. 27. WHAT CAN YOU DO ABOUT IT? STEP 6: IMPLEMENT Plan the Website. Site Architecture P r o d u c t Ta x o n o m y Functionality Requirements Content Strategy Wireframes
  28. 28. WHAT CAN YOU DO ABOUT IT? STEP 6: IMPLEMENT Design the Website. Build the Website.
  29. 29. WHAT CAN YOU DO ABOUT IT? STEP 7: LEARN Measure the Impact Through: Google Analytics Goal Tracking Conversion Funnels Bounce Rate User Feedback User Testing
  30. 30. W H AT R E S U LT S C A N Y O U E X P E C T ? E N D R E S U LT S F O R D O U G Doug saw an average increase of 36% in overall sales. Since his goal was 50%, he’s using a portion of the increase to conduct usability tests to find hitches in the design. His web d e v e l o p m e n t t e a m i s t a k i n g t h i s a n a l y s i s , m a k i n g CTA b u t t o n s m o r e p r o m i n e n t , r e m o v i n g c l u t t e r, r e w r i t i n g c o p y t o s o u n d f r i e n d l i e r, a n d A / B t e s t i n g a d s .
  31. 31. THE INFINITE CYCLE
  32. 32. RESOURCES Recommended Books DON’T MAKE ME THINK REVISITED: A COMMON SENSE APPROACH TO WEB USABILITY T H E D E S I G N O F E V E RY D AY THINGS DON NORMAN (AUTHOR) STEVE KRUG (AUTHOR) SEDUCTIVE INTERACTION D E S I G N : C R E AT I N G P L AY FUL, FUN, AND EFFECTIVE USER EXPERIENCES STEPHEN P. ANDERSON (AUTHOR) INFORMATION ARCHITECTURE: BLUEPRINTS FOR THE WEB CHRISTINA WODTKE (AUTHOR)
  33. 33. RESOURCES Recommended Links “Design Thinking.” An overview of the approach:  Need to back up an idea with research? Find some: The best blog by all the best people in the field:  My personal favorite UX blog:  Amazing tools where Google does a lot of this stuff for you: The article I send to everyone who wants to learn to make websites:  Take usability tests to get a sense of what it’s all about, and publish your own:   http://en.wikipedia.org /wiki/ Design_thinking http://www.uxpond.com/index.html http://alistapart.com/articles http://uxdesign.smashingmagazine.com/  http://www.google.com/ think/ tools/customer-journeyto-online-purchase.html http://www.good.is/posts/how-to-become-a-designerwithout-going-to-design-school https://usabilityhub.com/
  34. 34. RESOURCES Recommended Links  Learn, learn learn:  An overview of the field (I do everything in this chart except visual design):  https://generalassemb.ly/watch-and-learn/uxdesign?utm_content=front_row&utm_medium=fbsocialcode_PagePostLink_Phase2_UX_UXOffer http://www.uxmatters.com/mt/archives/2007/11/images/ FiveCompetencies.pdf Where to go if you don’t know what any of this stuff means, or you just need way more examples:  http:// w w w.usability.gov/ Official site of the guys who basically invented usability (Nielsen and Norman like our Skinner):  http://www.nngroup.com/ A list of my heroes. The people and organizations I follow onW Twitter for everyday inspiration:  This article explains dark patterns and brand relationships better than I ever could: h t t p s : / / t w i t t e r. c o m / t r i c i a d a n t i n / l e a r n - s o m e t h i n g / members http://www.90percentofeverything.com/2013 /07/23 / theslippery-slope/
  35. 35. QUESTIONS?
  36. 36. THANK YOU. TRICIA @ P R P L . R S @TRICIADANTIN
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×