Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Design for Security — Web Directions Summit 2019

Serena Chen
October 31, 2019

Design for Security — Web Directions Summit 2019

Serena Chen

October 31, 2019
Tweet

More Decks by Serena Chen

Other Decks in Technology

Transcript

  1. design for
    security
    web directions summit 2019

    View full-size slide

  2. tena koutou

    tena koutou

    tena koutou
    tena koutou
    tena koutou
    tena koutou

    View full-size slide

  3. tena koutou

    tena koutou

    tena koutou
    tena koutou
    tena koutou
    tena koutou

    View full-size slide

  4. the internet
    owns our lives

    View full-size slide

  5. –Literally everyone not watching Mr Robot right now
    “I don’t care about security.”

    View full-size slide

  6. product design
    hierarchy of needs
    content, accessibility, performance, security
    information architecture, consistency
    typography, colour
    animation

    View full-size slide

  7. good security
    is a part of 

    good design

    View full-size slide

  8. Usability Security

    View full-size slide

  9. Usability
    Security

    View full-size slide

  10. Usability
    Security

    View full-size slide

  11. –Literally everyone not watching Mr Robot right now
    “I don’t care about security.”

    View full-size slide

  12. –Serena Chen, lone nerd shouting into the void
    “I care !!!”

    View full-size slide

  13. it’s our job 

    to care.

    View full-size slide

  14. it’s our job 

    to care.

    View full-size slide

  15. design
    nerds
    security
    nerds-

    View full-size slide

  16. the design/security trilogy
    1.
    2.
    3.
    4.

    View full-size slide

  17. the design/security trilogy
    1. paths of least resistance
    2.
    3.
    4.

    View full-size slide

  18. paths of least
    resistance

    View full-size slide

  19. it’s always 1989 in security
    • Security through obfuscation
    • Security through excessive complexity
    • Password rotation

    View full-size slide

  20. Source: https://mobile.twitter.com/joernchen/status/915587942130896896

    View full-size slide

  21. bad security:

    walls
    everywhere

    View full-size slide

  22. Illustration by Megan Pendergrass

    View full-size slide

  23. —Serena Chen,
    “I KNOW HOW TO INTERNET”
    a grown adult

    View full-size slide

  24. people are
    lazy efficient

    View full-size slide

  25. align your
    goals to your
    users’ goals

    View full-size slide

  26. bad security:

    walls
    everywhere

    View full-size slide

  27. good security:

    smartly placed
    doors

    View full-size slide

  28. Illustration by Susanna Yee




    View full-size slide

  29. Illustration by Susanna Yee




    View full-size slide

  30. normalise
    security

    View full-size slide

  31. look at journey maps
    • determine likely paths
    • what is the easiest path?
    • what is the most secure / ideal path?
    • can you merge the two?

    View full-size slide

  32. align your
    goals to your
    users’ goals

    View full-size slide

  33. Illustration by Susanna Yee

    View full-size slide

  34. the design/security trilogy
    1. paths of least resistance
    2.
    3.
    4.

    View full-size slide

  35. the design/security trilogy
    1. paths of least resistance
    2. intent
    3.
    4.

    View full-size slide

  36. finding intent

    View full-size slide

  37. Usability Security

    View full-size slide

  38. tension happens
    when we can’t
    determine intent

    View full-size slide

  39. Usability Security

    View full-size slide

  40. we fall back on patterns
    everything
    needs to be easy
    usability is my
    responsibility
    Illustration by Chloe Cathcart

    View full-size slide

  41. it’s not our job
    to make
    everything
    easy

    View full-size slide

  42. Our job is to make legitimate actions
    • that legitimate users want to take
    • at that time
    • in that place
    … easy
    Everything else we can lock down.

    View full-size slide

  43. get more
    specific about
    the user’s
    intent

    View full-size slide

  44. the design/security trilogy
    1. paths of least resistance
    2. intent
    3.
    4.

    View full-size slide

  45. the design/security trilogy
    1. paths of least resistance
    2. intent
    3. (mis)communication
    4.

    View full-size slide

  46. (mis)commu-
    nication

    View full-size slide

  47. miscommunications
    are human security
    vulnerabilities

    View full-size slide

  48. what are you
    unintentionally
    miscommunicating?

    View full-size slide

  49. https://blog.chromium.org/2018/05/evolving-chromes-security-indicators.html

    View full-size slide

  50. connection is encrypted domain is who they say they are

    View full-size slide

  51. miscommunications
    are human security
    vulnerabilities

    View full-size slide

  52. (i didn’t actually do this)

    View full-size slide

  53. human

    security

    vulnerability
    https://blog.chromium.org/2018/05/evolving-chromes-security-indicators.html

    View full-size slide

  54. do your users know 

    what you're trying to
    communicate?

    View full-size slide

  55. what is their
    mental model
    of what’s
    happening?

    View full-size slide

  56. the design/security trilogy
    1. paths of least resistance
    2. intent
    3. (mis)communication
    4.

    View full-size slide

  57. the design/security trilogy
    1. paths of least resistance
    2. intent
    3. (mis)communication
    4. mental models

    View full-size slide

  58. mental models

    View full-size slide

  59. design model user model
    system image
    Source: The Design of Everyday Things, Don Norman
    designers users

    View full-size slide

  60. design model user model
    system image
    Source: The Design of Everyday Things, Don Norman
    designers users

    View full-size slide

  61. design model user model
    system image

    View full-size slide

  62. A system is secure
    when the user
    expectations match
    the design intentions
    and the system itself
    A system is secure
    when the user
    expectations match
    the design intentions
    and the system itself
    A system is secure
    when the users’
    expectations match
    the design intentions
    and the system itself
    A system is secure
    when the users’
    expectations match
    the design intentions
    and the system itself
    A system is secure
    when the users’
    expectations match
    the design intentions
    and the system itself

    View full-size slide

  63. • observe non-tech users,
    customer sessions
    • ask them what they expect
    • infer intent through
    context
    1
    understand
    their model

    View full-size slide

  64. 2
    influence
    their model
    • when we make, we teach
    • whenever someone interacts

    a thing we made, they learn.
    • path of least resistance
    becomes the default “way to
    do things”.

    View full-size slide

  65. how are we
    already
    influencing
    users’ models?

    View full-size slide

  66. https://krausefx.com/blog/ios-privacy-stealpassword-easily-get-the-users-apple-id-password-just-by-asking
    iOS Phish

    View full-size slide

  67. what are we
    teaching?

    View full-size slide

  68. —Serena Chen,
    “I KNOW HOW TO INTERNET”
    a grown adult

    View full-size slide

  69. it’s all about
    their mental
    model

    View full-size slide

  70. what are your
    users’ mental
    models?

    View full-size slide

  71. takeaways
    takeaways
    takeaways
    takeaways
    takeaways
    takeaways

    View full-size slide

  72. take
    take
    take
    take
    take
    take
    • cross-pollination is a missed opportunity
    • our jobs are about outcomes, 

    not “what we’re supposed to do”
    • align user goals to your security goals

    View full-size slide

  73. take
    take
    take
    take
    take
    take
    • aim to know their intent
    • craft a path of least resistance
    • understand their mental model
    • communicate accurately to that model

    View full-size slide

  74. one final anecdote

    View full-size slide

  75. thanks!
    fight me @sereeena

    View full-size slide