Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Misused UX design patterns

860 views

Published on

As UX designers we all know how important design patterns are. We try to avoid reinventing the wheel and constantly look for best practices and guidelines. However, relying too much on known patterns sometimes makes us fail to question them. This talk was presented at UX Scotland 2016.

Published in: Design

Misused UX design patterns

  1. 1. MISUSED UX Design patterns Zoltan Kollin
  2. 2. Hello, I’M Zoltan Kollin
 UX director at UstreamAN IBM COMPANY
  3. 3. https://medium.com/@kollinz/misused-mobile-ux-patterns-84d2b6930570
  4. 4. Design patterns are reusable solutions to recurring problems.
  5. 5. Design patterns Are commonly used interface elements that your users already know.
  6. 6. Design patterns Are commonly used interface elements and techniques that your users already know.
  7. 7. You don’t have to reinvent the wheel and users don’t have to learn how to use them. win-win.
  8. 8. Design patterns sometimes expire
  9. 9. Design patterns sometimes expire
  10. 10. …and new ones are born
  11. 11. Design patterns Are commonly used interface elements that your users already know.
  12. 12. Misused Design patterns Are commonly used techniques that ignore users.
  13. 13. Misused patterns #1 User interface puzzles
  14. 14. The rise and fall of skeuomorphism
  15. 15. The rise and fall of skeuomorphism 2012 2013 https://dribbble.com/lobanovskiy/tags/waffle
  16. 16. The rise of simplification
  17. 17. “Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.” - Antoine de Saint-Exupéry
  18. 18. GUI is about metaphors
  19. 19. icons are metaphors
  20. 20. icons are metaphors
  21. 21. Icons are metaphors I SHOWED MY 12 YEAR OLD SON 
 AN OLD FLOPPY DISK “WOW…COOL! YOU 3D PRINTED 
 THE SAVE ICON!”
  22. 22. mysterious icons are not metaphors
  23. 23. “Where exactly are messages in instagram?” “OPen the app and in the top right corner there’s a bathtub. that’s where.”
  24. 24. “researchers at the University of Minnesota […] found that people often disagreed as to whether the same emoji represented a positive, neutral, or negative sentiment.” http://qz.com/659785/a-new-study-confirms-it-we-really-dont-know-what-were-saying-when-we-use-emoji/
  25. 25. User interface puzzles Usability first, design trends second
  26. 26. Misused patterns #2 Designing “Out of sight”
  27. 27. The evolution of white space 2009 2016
  28. 28. http://guardz1y11.blogspot.hu/2015/03/writing-css-interesting-parts.html The evolution of Scroll indicators
  29. 29. SCROLL DOWN
  30. 30. A user interface is like a joke. If you have to explain it, it’s not that good.
  31. 31. How most carousels look How carousels should look Arrows don’t give users an incentive to click Descriptive labels incentivize to click http://uxmovement.com/navigation/why-users-arent-clicking-your-home-page-carousel/
  32. 32. Out of sight, out of mind.
  33. 33. Designing “out of sight” Consider the context and keep essential options accessible
  34. 34. Misused patterns #3 patterns of distraction
  35. 35. 90 trillion emails were sent in 2009 81% were spam
  36. 36. Today, less than 0.1% of email in the average Gmail inbox is spam.
  37. 37. https://www.youtube.com/watch?v=zGl796352RI
  38. 38. Reminder 1 mins ago Call Steve about weekend Uber now Your car is arriving Mom 3 mins ago Missed call Slack now Tim archived 7 channels Instagram 1 hour ago You have 5 new followers Podcasts 30 mins ago New Alley-oop episode Twitter 5 mins ago #UXScotland is trending in your network
  39. 39. The smart way
  40. 40. The manual way
  41. 41. Nine of 10 people suffer from 
 phantom vibration syndrome where they mistakenly think 
 their mobile phone is vibrating
 in their pocket
  42. 42. Phone addiction?
  43. 43. Hey there! Have a question? Chat with us. Send a message…
  44. 44. You should really download our brilliant e-book to boost profits. Enter your email address… GET YOUR FREE EBOOK
  45. 45. http://www.moneylab.co/email/
  46. 46. Patterns of distraction Focus on the long term user experience, not quick wins
  47. 47. Misused patterns #4 technology overdrive
  48. 48. Technology should solve people’s problems, not create new ones
  49. 49. “There’s an app for that”
  50. 50. 1. Tap on continue
  51. 51. 1. Tap on continue 2. Arrive to app store
  52. 52. 1. Tap on continue 2. Arrive to app store 3. Tap on get
  53. 53. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install
  54. 54. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install 5. wait for it
  55. 55. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install 5. wait for it 6. Enter password
  56. 56. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install 5. wait for it 6. Enter password 7. wait for installing
  57. 57. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install 5. wait for it 6. Enter password 7. wait for installing 8. Tap on open
  58. 58. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install 5. wait for it 6. Enter password 7. wait for installing 8. Tap on open 9. turn off notifications
  59. 59. 1. Tap on continue 2. Arrive to app store 3. Tap on get 4. Tap on install 5. wait for it 6. Enter password 7. wait for installing 8. Tap on open 9. turn off notifications 10. Access the content
  60. 60. Apps need to be maintained. Even by the users.
  61. 61. Technology should solve people’s problems, not create new ones
  62. 62. “Slap an interface on it!”
  63. 63. Technology overdrive People should leverage technology, not serve it
  64. 64. The ultimate question: to follow or not to follow?
  65. 65. “Every website, 2015”
  66. 66. “The two possible websites…”
  67. 67. “All apps look the same…”
  68. 68. How not to misuse design patterns?
  69. 69. Get to know the patterns but unfollow them any time if that’s the best for your users.
  70. 70. Question everything and do your own research
  71. 71. Thank you Let me know your thoughts on twitter or linkedin

×