Design for Humans: Build Human-Centered Products with Cognitive Psychology

A presentation at Digital Summit MX 2018 in November 2018 in Guadalajara, Jalisco, Mexico by Jenny Shen

Slide 1

Slide 1

Nov 2018 Digital Summit Design for Humans Build Human-centered Products with Cognitive Psychology

Slide 2

Slide 2

Slide 3

Slide 3

@jennyshen

Slide 4

Slide 4

@jennyshen

Slide 5

Slide 5

@jennyshen

Slide 6

Slide 6

Design psychology quiz @jennyshen

Slide 7

Slide 7

612241 http://kahoot.it Wifi pw: EBC565786

Slide 8

Slide 8

1 State of Using Psychology Minimal Experiment-focused Dark @jennyshen

Slide 9

Slide 9

@jennyshen

Slide 10

Slide 10

I don’t know how to design this because I didn’t find any references I designed this layout and then I’m stuck… Defaulting to drop-down when there are 3 items in list @jennyshen

Slide 11

Slide 11

Slide 12

Slide 12

Slide 13

Slide 13

Slide 14

Slide 14

Slide 15

Slide 15

Slide 16

Slide 16

Firstly, the splash screen should be quick. How quick? As quick as possible, but never more than 2 or 3 seconds. Why do you think hotels and big businesses spend so much money on their grand and impressive entrances? Because the moment you walk through that door, you know you’re in a place of quality.

Slide 17

Slide 17

But my main complaint is that I don’t like using the system. The visuals are very basic and the machine makes a very loud sound with each button press. The interface uses only two colors, bright yellow and blue, the company colors of NS. Firstly, the splash screen should be quick. How quick? As quick as possible, but never more than 2 or 3 seconds. Why do you think hotels and big businesses spend so much money on their grand and impressive entrances? Because the moment you walk through that door, you know you’re in a place of quality.

Slide 18

Slide 18

But my main complaint is that I don’t like using the system. The visuals are very basic and the machine makes a very loud sound with each button press. The interface uses only two colors, bright yellow and blue, the company colors of NS. I had to cross swords with my team mate. I had designed a placeholder for the banner just under the navigation, Firstly, the splash screen should be quick. How whereas my team mate had this idea to place some boxes for quick? As quick as possible, but never more than important information instead. And so, I quickly googled for 2 or 3 seconds. a proven answer. Why do you think hotels and big businesses spend so much money on their grand and impressive entrances? Because the moment you walk through that door, you know you’re in a place of quality.

Slide 19

Slide 19

https://medium.com/@danmaccarone/the-ux-of-learning-ux-is-broken-f972b27d3273

Slide 20

Slide 20

  • Design process
  • Deliverables ≠ Medium articles HUMANCENTERED DESIGN @jennyshen

Slide 21

Slide 21

“ If it can be a test, test it. If we can’t test it, we probably don’t do it. —Stuart Frisby, Director of Design at Booking.com @jennyshen

Slide 22

Slide 22

Dark patterns Sell my soul to the devil Confirm @jennyshen

Slide 23

Slide 23

3 1 2 Convince colleagues with a strong rationale Design effectively without experiments Feel like a pro designer @jennyshen

Slide 24

Slide 24

2 Cognitive Psychology @jennyshen

Slide 25

Slide 25

“Appearance does not matter. It’s all about the user experience.” 01 @jennyshen

Slide 26

Slide 26

@jennyshen

Slide 27

Slide 27

Aesthetic Usability Effect: Users often perceive aesthetically pleasing design as design that’s more usable. Users are more tolerant of minor usability issues when they find an interface visually appealing. This aesthetic-usability effect can mask UI problems and can prevent issue discovery during usability testing. @jennyshen

Slide 28

Slide 28

1995 26 252 easy of use https://www.researchgate.net/publication/3662967_Determinants_of_the_apparent_usability_user_interfaces aesthetics @jennyshen

Slide 29

Slide 29

Aesthetics Aesthetics Usability Usability https://www.researchgate.net/publication/3662967_Determinants_of_the_apparent_usability_user_interfaces @jennyshen

Slide 30

Slide 30

“ Users are strongly influenced by the aesthetics of any given interface, even when they try to evaluate the underlying functionality of the system. —Masaaki Kurosu and Kaori Kashimura, Hitachi Design Center @jennyshen

Slide 31

Slide 31

We all use design patterns. But why? 02 @jennyshen

Slide 32

Slide 32

Jakob’s Law: Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know. @jennyshen

Slide 33

Slide 33

Cognitive Load: The mental effort required to learn new information. Designers should strive to eliminate/minimize extraneous cognitive load because user attention is a precious resource. @jennyshen

Slide 34

Slide 34

@jennyshen

Slide 35

Slide 35

@jennyshen

Slide 36

Slide 36

Why do users prefer less choices? 03 @jennyshen

Slide 37

Slide 37

Cognitive Load: The mental effort required to learn new information. Designers should strive to eliminate/minimize extraneous cognitive load because user attention is a precious resource. @jennyshen

Slide 38

Slide 38

Hick’s Law: The more options to choose from, the longer it takes the user to make a decision. Users bombarded with choices have to take time to interpret and decide, giving them work they don’t want. @jennyshen

Slide 39

Slide 39

@jennyshen

Slide 40

Slide 40

@jennyshen

Slide 41

Slide 41

@jennyshen

Slide 42

Slide 42

Slide 43

Slide 43

How to Build Habit-Forming Products, Nir Eyal and Ryan Hoover @jennyshen

Slide 44

Slide 44

Notifications Visit profile & catalog How to Build Habit-Forming Products, Nir Eyal and Ryan Hoover Post content / rewardable action Variable reward catalog @jennyshen

Slide 45

Slide 45

Notifications Post content / rewardable action Variable reward catalog Visit profile & catalog @jennyshen

Slide 46

Slide 46

Zegarnik effect Incomplete tasks are easier to remember than completed ones @jennyshen

Slide 47

Slide 47

Endowment Effect We place greater value on objects if emotional value has been invested @jennyshen

Slide 48

Slide 48

Completion The need for closure drives humans toward a well defined end-goal @jennyshen

Slide 49

Slide 49

Competition Survival of the fittest (Darwinian evolutionary theory) @jennyshen

Slide 50

Slide 50

Achievements Humans are motivated by achievements of personal or social significance @jennyshen

Slide 51

Slide 51

8x engagement rates

Slide 52

Slide 52

3 Dark Side of Psychology @jennyshen

Slide 53

Slide 53

https://twitter.com/darylginn/status/1053646859686809600 @jennyshen

Slide 54

Slide 54

@darkpatterns @jennyshen

Slide 55

Slide 55

TheNextWeb, Twitter/Linkedin (respective owners) @jennyshen

Slide 56

Slide 56

Emotional targeting at aspirations @jennyshen

Slide 57

Slide 57

Emotional targeting at aspirations Emotional targeting at fears

Slide 58

Slide 58

Can we do this differently? @jennyshen

Slide 59

Slide 59

Slide 60

Slide 60

@jennyshen

Slide 61

Slide 61

@jennyshen

Slide 62

Slide 62

@jennyshen

Slide 63

Slide 63

Conversion Rate 11.5% over 1 week campaign @jennyshen

Slide 64

Slide 64

@jennyshen

Slide 65

Slide 65

4 Ethics and Responsibility @jennyshen

Slide 66

Slide 66

UX Designer https://medium.muz.li/malachidigest-3cad286bba02 @jennyshen

Slide 67

Slide 67

Is using psychology ethical? @jennyshen

Slide 68

Slide 68

There is no such thing as neutral design. —Richard H. Thaler & Cass R. Sunstein @jennyshen

Slide 69

Slide 69

Ethics of using psychology: • Everyone’s scale of ethical/unethical is different • Ethics are subjective • What users don’t like is when companies manipulate them into doing things they later regret @jennyshen

Slide 70

Slide 70

User control and freedom Jakob Nielsen's 10 Usability Heuristics for Interface Design @jennyshen

Slide 71

Slide 71

“ Using psychology in design is not unethical, unless one intentionally deceives user or takes away user’s freedom to do something against company interest. —Jenny Shen @jennyshen

Slide 72

Slide 72

“ Just because you can, doesn’t mean you should. @jennyshen

Slide 73

Slide 73

ethical and humane design methods @jennyshen

Slide 74

Slide 74

Designers have responsibility to educate others about design psychology @jennyshen

Slide 75

Slide 75

Designers have the responsibility to shape design education @jennyshen

Slide 76

Slide 76

Let’s advocate heuristics and principles over tactics @jennyshen

Slide 77

Slide 77

Let’s make our industry and designs more humane @jennyshen

Slide 78

Slide 78

https://www.crowdcast.io/e/pbmoo5zh 11am CST (Guadalajara) / 12pm EST (New York) / 5pm GMT (London)

Slide 79

Slide 79

@jennyshen ! jennyshen.com 📩 get updates: jennyshen.com/newsletter

Slide 80

Slide 80

Icons: Yanick Brezet, Becris, Ryan Houk, Mello, Tim Neumann from the Noun Project Background image: Anton Darius Thesollers from Unsplash @jennyshen