SINterfaces

49eec51ef4a3335cb3247a41d1f08971?s=47 Jay Stakelon
April 27, 2015

 SINterfaces

I gave this talk on "dark patterns" and manipulative product design to a general audience of non-designers at a cool monthly event called Night School LA.

It's basically a big mashup of work from a lot of people much smarter than myself, with some examples thrown in. It was really fun to put this one together.

49eec51ef4a3335cb3247a41d1f08971?s=128

Jay Stakelon

April 27, 2015
Tweet

Transcript

  1. Sinterfaces The Design Patterns That Lead Us Astray

  2. Hello.

  3. Jay Stakelon User Experience / Software Product Designer

  4. @stakelon

  5. speakerdeck.com/stakes

  6. Design
 Patterns

  7. Usability

  8. Usability is about effectiveness, efficiency and the overall satisfaction of

    the user. - - usability.gov http://www.usability.gov/what-and-why/usability-evaluation.html
  9. None
  10. Usability is about effectiveness, efficiency and the overall satisfaction of

    the user.
  11. Usability is quantifiable.

  12. Usability is about effectiveness, efficiency and the overall satisfaction of

    the user.
  13. Usability is also subjective.

  14. Jakob Nielsen www.nngroup.com

  15. Five components
 of usability

  16. LEARNABILITY EFFICIENCY MEMORABILITY ERRORS SATISFACTION http://www.nngroup.com/articles/usability-101-introduction-to-usability/

  17. Design Patterns

  18. Recurring solutions that solve common design problems. - UI-Patterns.com http://ui-patterns.com/patterns

  19. A solution to a problem in context that can be

    re-used. - Michael Boeke http://www.lukew.com/ff/entry.asp?1833
  20. Design patterns produce expected behaviors.

  21. http://zurb.com/patterntap/pattern/tabbed-table-rich-metrics

  22. http://zurb.com/patterntap/pattern/schedule-future-insights-live-2013

  23. http://zurb.com/patterntap/pattern/dropdown-menu-everlane

  24. http://zurb.com/patterntap/pattern/strong-ui-megamenu-dropdown-subnavigation-reuters

  25. http://zurb.com/patterntap/pattern/login-tooltip-airbnb

  26. http://zurb.com/patterntap/pattern/tooltip-paypal

  27. None
  28. None
  29. http://blog.placeit.net/history-of-the-hamburger-icon/

  30. http://blog.placeit.net/history-of-the-hamburger-icon/

  31. http://pttrns.com

  32. http://ui-patterns.com/patterns/Wizard/examples/1460

  33. http://ui-patterns.com/patterns/Wizard/examples/1469

  34. None
  35. None
  36. Antipatterns

  37. A common response to a recurring problem that is usually

    ineffective and risks being highly counterproductive. - Wikipedia http://en.wikipedia.org/wiki/Anti-pattern
  38. None
  39. None
  40. None
  41. None
  42. http://darkpatterns.org/ryanair-marketing-list-signup/

  43. Presentations deprecate. - Josh Clark https://vimeo.com/68935393

  44. http://blog.placeit.net/history-of-the-hamburger-icon/

  45. http://www.smashingmagazine.com/2012/06/20/links-should-never-say-click-here/

  46. http://zurb.com/patterntap/pattern/login-tooltip-airbnb

  47. None
  48. Behavior and Persuasion

  49. Donald Norman Emotional Design: Why We Love (or Hate) Everyday

    Things
  50. Three levels of design

  51. VISCERAL BEHAVIORAL REFLECTIVE

  52. None
  53. None
  54. None
  55. VISCERAL BEHAVIORAL REFLECTIVE

  56. When the human mind perceives the world, it seeks to

    recognize some kind of structure or order. - Kevin Matz, “Designing Usable Apps: An Agile Approach to User Experience Design” https://books.google.com/books?id=aYjpAgAAQBAJ&pg=PA147
  57. http://architectingusability.com/2011/05/26/using-the-gestalt-laws-of-perception-in-ui-design/

  58. None
  59. The Center Stage Effect The thing in the middle is

    the most important. http://coglode.com/gems/centre-stage-effect
  60. None
  61. None
  62. Goal Gradient Effect We complete a task more quickly if

    the process is already started for us. http://coglode.com/gems/goal-gradient-effect
  63. None
  64. We place disproportionally high value on things that we (think)

    we built.
  65. http://www.bettycrocker.co.uk/the-betty-story#sthash.sWh69KUr.dpuf

  66. None
  67. None
  68. http://en.wikipedia.org/wiki/IKEA_effect The IKEA Effect

  69. Loss Aversion We prefer to avoid losses rather than to

    accrue gains.
  70. None
  71. None
  72. Little things matter.

  73. None
  74. None
  75. http://danariely.com/2008/05/05/3-main-lessons-of-psychology/

  76. I define persuasive technology as any interactive computing system designed

    to change people’s attitudes or behaviors. - B.J. Fogg, “Persuasive Technology: Using Computers to Change What We Think And Do” https://books.google.com/books?id=gfiYh_BHj94C&pg=PA1
  77. Dark
 Patterns

  78. Harry Brignull www.90percentofeverything.com

  79. BAIT & SWITCH DISGUISED FARAWAY BILL FORCED CO FORCED DISCLOSURE

    FRIE HIDDEN COSTS MISDIRECT COMPARISON PREVENTIO ZUCKERING ROACH MOTE ROADBLOCK SNEAK INTO TRICK QUESTIONS BAIT & Harry Brignull www.darkpatterns.org
  80. http://darkpatterns.org/journey_map/

  81. attitudes or behaviors

  82. attitudes or behaviors

  83. Bad Design or 
 Dark Pattern?

  84. Dark Patterns… 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. - Harry Brignull http://darkpatterns.org/what_is_a_dark_pattern/
  85. http://ui-patterns.com/patterns/Carousel/examples/298

  86. None
  87. https://wysz.com/wyszdom/category/idiot-marketing/

  88. https://wysz.com/wyszdom/category/idiot-marketing/

  89. Lookalikes

  90. None
  91. None
  92. None
  93. Roadblock

  94. None
  95. None
  96. None
  97. None
  98. None
  99. Devious Defaults

  100. None
  101. The devil is in the defaults. - Every UX Designer

    Ever
  102. http://brightvessel.com/dark-patterns-in-ui/

  103. http://darkpatterns.org/avg-installer-november-2013/

  104. http://www.technologizer.com/2009/03/02/orbitz-sales-tactics-convenient-and-sleazy/

  105. http://www.technologizer.com/2009/03/02/orbitz-sales-tactics-convenient-and-sleazy/

  106. http://www.formisimo.com/blog/5-examples-of-dark-patterns-on-airline-sites/

  107. http://www.formisimo.com/blog/5-examples-of-dark-patterns-on-airline-sites/

  108. Easy In, Impossible Out

  109. a.k.a “Roach Motel”

  110. None
  111. None
  112. None
  113. None
  114. None
  115. Consent Manipulation

  116. None
  117. http://darkpatterns.org/ryanair-marketing-list-signup/

  118. http://darkpatterns.org/mbna-credit-card-june-2013/

  119. http://www.formisimo.com/blog/5-examples-of-dark-patterns-on-airline-sites/

  120. http://darkpatterns.org/royal-mails-marketing-consent/

  121. None
  122. Piling On

  123. http://www.90percentofeverything.com/2013/07/23/the-slippery-slope/

  124. http://www.quora.com/What-are-some-Dark-Patterns

  125. http://www.theverge.com/2013/8/29/4640308/dark-patterns-inside-the-interfaces-designed-to-trick-you

  126. None
  127. None
  128. http://techcrunch.com/2013/09/27/not-so-vip/

  129. http://techcrunch.com/2013/09/27/not-so-vip/

  130. Why?

  131. Focus on a single metric or KPI

  132. Looking for a local rather than a global maxima

  133. Into The Light

  134. Nice Guys Finish First

  135. http://techcrunch.com/2013/09/27/not-so-vip/

  136. None
  137. None
  138. None
  139. http://blog.mailchimp.com/double-opt-in-vs-single-opt-in-stats/

  140. http://www.similarweb.com/website/stackoverflow.com?competitors=experts-exchange.com

  141. Positive Persuasion

  142. VISCERAL BEHAVIORAL REFLECTIVE

  143. None
  144. None
  145. None
  146. None
  147. None
  148. None
  149. None
  150. None
  151. attitudes or behaviors

  152. attitudes or behaviors

  153. Thanks!

  154. Resources

  155. Usability & Design Patterns nngroup.com patterntap.com uipatterns.com Behavior and Persuasion

    coglode.com Dark Patterns darkpatterns.org Me! @stakelon / stakelon.com / speakerdeck.com/stakes