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.
UX, Psychology and
the Power of 100
mr joe leech @mrjoe
A framework for product design
I’m @mrjoe
but you can
call me Joe
Have you ever?
Bought a raspberry pi?
Are you on the giffgaff phone
network?
Booked a hot...
⅓ ⅓
Interaction
Design
⅓
User
Research
Product
Direction
@mrjoe
Do the right
things in the
right order.
I help companies and startups
I’m series editor for
these books
@mrjoe
October 2011 Dubai Police
noted a 20% drop in
car accidents.
In Abu Dabai it was 40%.
Why?
@mrjoe
http://www.slideshare.net/cxpartners/driven-to-distraction-giles-colborne
http://money.cnn.com/2011/10/13/technolog...
@mrjoe
Part #1 – The
Problem
9
@mrjoe
About half of all
smartphone and tablet
owners use these devices
while watching TV
http://www.fastcodesign.com/1672...
@mrjoe
1. Distraction
We are distracted
@mrjoe
Extraneous factors in judicial decisions
Time of the day
http://www.pnas.org/content/108/17/6889.full
Proportionof
...
@mrjoe
1. Distraction
2. Tiredness / Hunger
@mrjoe
…I’m tired, I’ve had a
hard day, the last thing
I want to do is my car
insurance.
@mrjoehttps://mrjoe.uk/maslows-hierarchy-needs-psychology-myth-busting-1/
Do you know this? A
model for motivation
from Ma...
@mrjoe
“no clear
evidence for
Maslow…”
https://mrjoe.uk/maslows-hierarchy-needs-psychology-myth-busting-1/
But it’s a myth!
@mrjoe
1. Distraction
2. Tiredness / Hunger
3. Motivation
#p4d @mrjoe @mrjoe
18
6 vs 30
A study with jam. On
alternate Saturdays 6 or
30 jams were sold. On
which did they sell more...
@mrjoe
Time
taken to
respond
Number of options
@mrjoe
Time
taken to
respond
Number of options
Hick’s
LawWhat’s the best thing
about Hick’s Law. ITS A
LAW! No-one can arg...
@mrjoe
Cognitive
Load
Thinking
reasoning
deciding
=
@mrjoe
1. Distraction
2. Tiredness / Hunger 3.
Motivation
4. Choice
Choice is hard
@mrjoe
All that leads to
this…
@mrjoe
I want to punch this
website in the face!
@mrjoe
My car insurance is through
Money Saving Market I think,
or Sheila’s Wheels, or
something, it had the opera
guy.
Th...
@mrjoe
h‫מּ‬p://en.wikipedia.org/wiki/Hawthorne_effect
The Hawthorne effect,
psychologists observed
the productivity of worke...
@mrjoe
Beware user research.
You won’t see the four
things I mentioned.
@mrjoe
You can use this to
evaluate your digital
stuff. Coming soon…
@mrjoe
Total cognitive capacity (or
thinking energy) is 100
An example.
This is someone is feeling
great, not distracted, ...
@mrjoe
Perfect cognitive capacity available 100
1. Is the TV on in the
background?
Yes, take 20
@mrjoe
Perfect cognitive capacity available 100
1. Is the TV on in the
background?
Yes, take 20
2. Is it before a mealtime...
@mrjoe
Perfect cognitive capacity available 100
1. Is the TV on in the
background?
Yes, take 20
2. Is it before a mealtime...
@mrjoe
Perfect cognitive capacity available 100
1. Is the TV on in the
background?
Yes, take 20
2. Is it before a mealtime...
@mrjoe
Perfect cognitive capacity available 100
1. Is the TV on in the
background?
Yes, take 20
2. Is it before a mealtime...
@mrjoe
Part #2 – The
Solution
35
@mrjoe
The micro:
Psychology and
Interaction Design
@mrjoe
Wikipedia from 2010
@mrjoe
@mrjoe
Intuitively we know it’s bad. But how can
psychology tell us it’s bad? We need to
go back to theory…
@mrjoe
N
S
We know these two. But it’s
not always easy to
remember the other two.
@mrjoe
N
S
W
Wrong! I do this all the
time.
@mrjoe
Never
Wrong! I do this all the
time.
@mrjoe
Never
S
Eat
Shredded
Wheat
Here’s how humans deal
with this. More examples:
Example of a mnemonic
Divorced, beheade...
@mrjoe
Facts
Declarative
knowledge
N
S
EW
@mrjoe
45
Sequences
Procedural
knowledge
Never
Shredded
Eat
Wheat
N
S
EW
@mrjoe
46
Facts Sequences
Declarative
knowledge
Procedural
knowledge
The two types of
knowledge
@mrjoe
Two types of interaction,
which matches each type of
knowledge?
@mrjoe
Declarative. (Mostly!) Procedural.
@mrjoe
Taking us back to
wikipedia. This breaks out
existing procedures. Our
mental model of how this
works breaks. Here’s...
@mrjoe
1
Where do you go for
search? Top right!
@mrjoe
1
2
What are you looking for?
A text box.
@mrjoe
1
2
Search
3
And a bu‫מּ‬on.
You are all smart, you could have
designed this fix. Here psychology
tells us why this w...
@mrjoe
axiom
Design
A statement or proposition
which is regarded as being
established, accepted, or
self-evidently true.
@mrjoe
Here’s a design axiom, click
on the logo to go back
@mrjoe
Axiom: where should
navigation be placed?
@mrjoe
Log in
@mrjoe
Cart / basket
@mrjoe
Cart / basket
This icon!
@mrjoe
Language
Where does it
go and how
does it look?
@mrjoe
Language
@mrjoe
So what did
wikipedia do?
@mrjoe
Not bad! that
icon isn’t the
best.
How did users
feel?
@mrjoe
97% OF ALL PEOPLE
WANT THE SEARCH
BOX BACK ON THE
LEFT SIDE. SO
WHEN WILL THIS
FINALLY BE FIXED ?
--Georg Scholz 

...
@mrjoe
So when you are
tired, distracted
or consfused.
You can’t use
new or novel
interactions. You
go back to the
stuff yo...
@mrjoe
The macro:
Psychology and the
User Experience
@mrjoe
Why do French waiters
treat British and
American customers
differently to French
ones? When do they
ask them to pay?...
@mrjoe
Because Starbuck
taught them how to
order coffee.
What’s the mental
model here?
1. Stand in line
2. Order
3. Pay
4. ...
@mrjoe
There are design
axioms that tells us
which model to use
Counter easily visible
Line to get cofee
@mrjoe
There are design
axioms that tells us
which model to use
The menus tell you to
wait to be seated
The waiter tells y...
@mrjoe
You know how to use a
life right?
@mrjoe
Um.
When the mental model
breaks we feel nervous.
@mrjoe
Let’s go away for
the weekend
Decide on…
What do we need to
do?
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in July
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in July
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in July
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in July
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in July
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in July
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
What
• Beach
• City
• Ski
• Spa
When
• A weekend in June
• Thu / Fri to Sun / Mon
• School holidays
Where
• Drive, ...
@mrjoe
Let’s go to the Beach, drive,
max three hours, on the first
or second week in July
And we apply that to…
@mrjoe
Let’s go to the Beach, fly, max three hours away on
the first or second week in July
This sucks!
@mrjoe
Booking is be‫מּ‬er, it’s
not perfect, but it’s
much be‫מּ‬er.
@mrjoe
Which explains…
@mrjoe
A designer
who doesn't
understand
psychology
is going to be no
more successful
than an architect
who doesn’t
unders...
@mrjoe
joe@mrjoe.uk
Stay in
touch
@mrjoe
h‫מּ‬ps://mrjoe.uk
Upcoming SlideShare
Loading in …5
×

17

Share

Download to read offline

UX, Psychology and the Power of 100 mrJoe Leech

Download to read offline

What do an overnight 40% drop in road accidents, a night in on the sofa watching TV and a good night's sleep have to do with digital product design?

Humans only have limited mental capacity and no-one is ever operating at 100%. We are all influenced by the world around us and by how our minds work. As designers we need to be able to understand this and design for it.

The power of 100 is a powerful way to understand the modern world we are designing for. How your website or app will be used in real life and to design for how people live their lives today. Combining psychology theory and the latest in UX techniques, the power of 100 is a modern design framework that matches the modern complex world we and our users live in.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all

UX, Psychology and the Power of 100 mrJoe Leech

  1. 1. UX, Psychology and the Power of 100 mr joe leech @mrjoe A framework for product design
  2. 2. I’m @mrjoe but you can call me Joe Have you ever? Bought a raspberry pi? Are you on the giffgaff phone network? Booked a hotel with Marrio‫?מּ‬ Bought a uk train ticket Bought something on eBay? You’ve used something I’ve help design.
  3. 3. ⅓ ⅓ Interaction Design ⅓ User Research Product Direction
  4. 4. @mrjoe Do the right things in the right order. I help companies and startups
  5. 5. I’m series editor for these books
  6. 6. @mrjoe
  7. 7. October 2011 Dubai Police noted a 20% drop in car accidents. In Abu Dabai it was 40%. Why?
  8. 8. @mrjoe http://www.slideshare.net/cxpartners/driven-to-distraction-giles-colborne http://money.cnn.com/2011/10/13/technology/blackberry_outage/
  9. 9. @mrjoe Part #1 – The Problem 9
  10. 10. @mrjoe About half of all smartphone and tablet owners use these devices while watching TV http://www.fastcodesign.com/1672845/report-how-people-really-use-tablets-while-watching-tv
  11. 11. @mrjoe 1. Distraction We are distracted
  12. 12. @mrjoe Extraneous factors in judicial decisions Time of the day http://www.pnas.org/content/108/17/6889.full Proportionof favourabledecisions A study made to see how judges performed before and aﬞer meals.
  13. 13. @mrjoe 1. Distraction 2. Tiredness / Hunger
  14. 14. @mrjoe …I’m tired, I’ve had a hard day, the last thing I want to do is my car insurance.
  15. 15. @mrjoehttps://mrjoe.uk/maslows-hierarchy-needs-psychology-myth-busting-1/ Do you know this? A model for motivation from Maslow, his hierarchy of need
  16. 16. @mrjoe “no clear evidence for Maslow…” https://mrjoe.uk/maslows-hierarchy-needs-psychology-myth-busting-1/ But it’s a myth!
  17. 17. @mrjoe 1. Distraction 2. Tiredness / Hunger 3. Motivation
  18. 18. #p4d @mrjoe @mrjoe 18 6 vs 30 A study with jam. On alternate Saturdays 6 or 30 jams were sold. On which did they sell more? Yes, when there were 6 to choose from They also conducted a survey. Would you prefer to choose from 6 or 30 types of jam? Pre‫מּ‬y much unanimously people said 30. That’s why surveys aren’t an indicator of behaviour
  19. 19. @mrjoe Time taken to respond Number of options
  20. 20. @mrjoe Time taken to respond Number of options Hick’s LawWhat’s the best thing about Hick’s Law. ITS A LAW! No-one can argue with that!
  21. 21. @mrjoe Cognitive Load Thinking reasoning deciding =
  22. 22. @mrjoe 1. Distraction 2. Tiredness / Hunger 3. Motivation 4. Choice Choice is hard
  23. 23. @mrjoe All that leads to this…
  24. 24. @mrjoe I want to punch this website in the face!
  25. 25. @mrjoe My car insurance is through Money Saving Market I think, or Sheila’s Wheels, or something, it had the opera guy. The brand being meaningless.
  26. 26. @mrjoe h‫מּ‬p://en.wikipedia.org/wiki/Hawthorne_effect The Hawthorne effect, psychologists observed the productivity of worker depending on light levels. They benchmarked at 100% luminosity. At 80%, productivity was the same. 60% same. 40% same, 20% Why? Because the workers were being observed!
  27. 27. @mrjoe Beware user research. You won’t see the four things I mentioned.
  28. 28. @mrjoe You can use this to evaluate your digital stuff. Coming soon…
  29. 29. @mrjoe Total cognitive capacity (or thinking energy) is 100 An example. This is someone is feeling great, not distracted, tired, offered a huge choice etc This is the power of 100.
  30. 30. @mrjoe Perfect cognitive capacity available 100 1. Is the TV on in the background? Yes, take 20
  31. 31. @mrjoe Perfect cognitive capacity available 100 1. Is the TV on in the background? Yes, take 20 2. Is it before a mealtime? Yes, take 10
  32. 32. @mrjoe Perfect cognitive capacity available 100 1. Is the TV on in the background? Yes, take 20 2. Is it before a mealtime? Yes, take 10 3. Does the user have notifications turned on on their phone? Yes, take 5
  33. 33. @mrjoe Perfect cognitive capacity available 100 1. Is the TV on in the background? Yes, take 20 2. Is it before a mealtime? Yes, take 10 3. Does the user have notifications turned on on their phone? Yes, take 5 4. How many choices are they offered on arrival? Five choices Take 5 per choice is 25
  34. 34. @mrjoe Perfect cognitive capacity available 100 1. Is the TV on in the background? Yes, take 20 2. Is it before a mealtime? Yes, take 10 3. Does the user have notifications turned on on their phone? Yes, take 5 4. How many choices are they offered on arrival? Five choices Take 5 per choice is 25 Total cognitive load is 60
  35. 35. @mrjoe Part #2 – The Solution 35
  36. 36. @mrjoe The micro: Psychology and Interaction Design
  37. 37. @mrjoe Wikipedia from 2010
  38. 38. @mrjoe
  39. 39. @mrjoe Intuitively we know it’s bad. But how can psychology tell us it’s bad? We need to go back to theory…
  40. 40. @mrjoe N S We know these two. But it’s not always easy to remember the other two.
  41. 41. @mrjoe N S W Wrong! I do this all the time.
  42. 42. @mrjoe Never Wrong! I do this all the time.
  43. 43. @mrjoe Never S Eat Shredded Wheat Here’s how humans deal with this. More examples: Example of a mnemonic Divorced, beheaded, died / Divorced, beheaded, survived.
  44. 44. @mrjoe Facts Declarative knowledge N S EW
  45. 45. @mrjoe 45 Sequences Procedural knowledge Never Shredded Eat Wheat N S EW
  46. 46. @mrjoe 46 Facts Sequences Declarative knowledge Procedural knowledge The two types of knowledge
  47. 47. @mrjoe Two types of interaction, which matches each type of knowledge?
  48. 48. @mrjoe Declarative. (Mostly!) Procedural.
  49. 49. @mrjoe Taking us back to wikipedia. This breaks out existing procedures. Our mental model of how this works breaks. Here’s how it should work.
  50. 50. @mrjoe 1 Where do you go for search? Top right!
  51. 51. @mrjoe 1 2 What are you looking for? A text box.
  52. 52. @mrjoe 1 2 Search 3 And a bu‫מּ‬on. You are all smart, you could have designed this fix. Here psychology tells us why this works.
  53. 53. @mrjoe axiom Design A statement or proposition which is regarded as being established, accepted, or self-evidently true.
  54. 54. @mrjoe Here’s a design axiom, click on the logo to go back
  55. 55. @mrjoe Axiom: where should navigation be placed?
  56. 56. @mrjoe Log in
  57. 57. @mrjoe Cart / basket
  58. 58. @mrjoe Cart / basket This icon!
  59. 59. @mrjoe Language Where does it go and how does it look?
  60. 60. @mrjoe Language
  61. 61. @mrjoe So what did wikipedia do?
  62. 62. @mrjoe Not bad! that icon isn’t the best. How did users feel?
  63. 63. @mrjoe 97% OF ALL PEOPLE WANT THE SEARCH BOX BACK ON THE LEFT SIDE. SO WHEN WILL THIS FINALLY BE FIXED ? --Georg Scholz 
 http://en.wikipedia.org/wiki/Wikipedia:User_experience_feedback/ search_box#97.25_OF_ALL_PEOPLE_WANT_THE_SEARCH_BOX_BACK_ON_THE_LEFT_SIDE._SO_WHEN_WILL_THIS_FINALLY_BE_FIXED_.3F SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! SEARCH BOX ON THE LEFT PLEASE!!!!!!!! —Preceding unsigned comment added by 192.88.212.43 (talk) 13:54, 19 May 2010 (UTC) They hated it!
  64. 64. @mrjoe So when you are tired, distracted or consfused. You can’t use new or novel interactions. You go back to the stuff you know. why the hamburger menu will never work, even if users get used to it.
  65. 65. @mrjoe The macro: Psychology and the User Experience
  66. 66. @mrjoe Why do French waiters treat British and American customers differently to French ones? When do they ask them to pay? A cafe in Paris What are the steps you go through to order a coffee here? 1. Ask to be seated 2. Order 3. Get coffee 4. Ask for bill 5. Pay Americans would leave without paying…
  67. 67. @mrjoe Because Starbuck taught them how to order coffee. What’s the mental model here? 1. Stand in line 2. Order 3. Pay 4. Get drink Their mental model tells them to pay before they get the drink. In the Parisian cafe their brain assumes they have paid
  68. 68. @mrjoe There are design axioms that tells us which model to use Counter easily visible Line to get cofee
  69. 69. @mrjoe There are design axioms that tells us which model to use The menus tell you to wait to be seated The waiter tells you it’s table service. Counter hidden right at the back of the cafe.
  70. 70. @mrjoe You know how to use a life right?
  71. 71. @mrjoe Um. When the mental model breaks we feel nervous.
  72. 72. @mrjoe Let’s go away for the weekend Decide on… What do we need to do?
  73. 73. @mrjoe What • Beach • City • Ski • Spa When • A weekend in July • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away
  74. 74. @mrjoe What • Beach • City • Ski • Spa When • A weekend in July • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away July
  75. 75. @mrjoe What • Beach • City • Ski • Spa When • A weekend in July • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away June M T W T F S S M T W T F S S T W T F S S M T W
  76. 76. @mrjoe What • Beach • City • Ski • Spa When • A weekend in July • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away July
  77. 77. @mrjoe What • Beach • City • Ski • Spa When • A weekend in July • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away
  78. 78. @mrjoe What • Beach • City • Ski • Spa When • A weekend in July • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away 3
  79. 79. @mrjoe What • Beach • City • Ski • Spa When • A weekend in June • Thu / Fri to Sun / Mon • School holidays Where • Drive, fly or train • 3 hours away July M T W T F S S M T W T F S S T W T F S S M T W 3
  80. 80. @mrjoe Let’s go to the Beach, drive, max three hours, on the first or second week in July And we apply that to…
  81. 81. @mrjoe Let’s go to the Beach, fly, max three hours away on the first or second week in July This sucks!
  82. 82. @mrjoe Booking is be‫מּ‬er, it’s not perfect, but it’s much be‫מּ‬er.
  83. 83. @mrjoe Which explains…
  84. 84. @mrjoe A designer who doesn't understand psychology is going to be no more successful than an architect who doesn’t understand physicsImage: http://victorenrich.com/archives/155
  85. 85. @mrjoe joe@mrjoe.uk Stay in touch @mrjoe h‫מּ‬ps://mrjoe.uk
  • MariaWJamba

    Feb. 5, 2021
  • zpravy

    Sep. 17, 2020
  • JakeerHussain22

    Feb. 13, 2020
  • pyroudy

    Feb. 9, 2020
  • MickDett

    Nov. 15, 2019
  • prokher

    Jul. 16, 2019
  • SantoshBharti1

    Apr. 1, 2019
  • bwhite

    Jan. 30, 2019
  • jamesherrera

    Oct. 28, 2018
  • IosiPratama

    Jul. 16, 2018
  • PushkarPatange

    Jul. 9, 2018
  • dhileepank

    Jun. 4, 2018
  • TomBritton1

    Apr. 23, 2018
  • BakoInd

    Dec. 20, 2017
  • AdelARIGUE

    Oct. 3, 2017
  • LanceWhitworth

    Jul. 5, 2017
  • MuniraAlwohaiby

    Jun. 22, 2017

What do an overnight 40% drop in road accidents, a night in on the sofa watching TV and a good night's sleep have to do with digital product design? Humans only have limited mental capacity and no-one is ever operating at 100%. We are all influenced by the world around us and by how our minds work. As designers we need to be able to understand this and design for it. The power of 100 is a powerful way to understand the modern world we are designing for. How your website or app will be used in real life and to design for how people live their lives today. Combining psychology theory and the latest in UX techniques, the power of 100 is a modern design framework that matches the modern complex world we and our users live in.

Views

Total views

22,754

On Slideshare

0

From embeds

0

Number of embeds

9,384

Actions

Downloads

93

Shares

0

Comments

0

Likes

17

×