1. Advanced simplicity
Giles Colborne
cxpartners

2. Hello!
2

3. Advanced simplicity?
WTF?
3

4. He means:
I would not give a fig Dumbing Down
for the simplicity this is bad.
But GENius
side of complexity, simplicity is
great.
but I would give my life
for the simplicity on
the other side of
complexity
Oliver Wendell Holmes
4

5. Part 1 Part 2
understanding it achieving it
5

6. is your life
too simple or
too complicated?
6

7. Do you always
buy the simplest
product on offer?
7

8. Do you try to
do more things than
you have time for?
8

9. Have your
choices made
your life too
complicated?
9

10. You see, we
always want to
keep it simple...
10

11. but temptation
often gets the
better of us.
11

12. If you can’t explain it simply
you don’t understand it
well enough
Albert Einstein
so let’s see if
we can make
simplicity
simple again.
12

13. 13

14. What is minimal?
GO
about ten
years ago, i
was working
on this online
bank
statement.
14

15. ol
the date contr
e
worked just fin
Usable in testing. But
ed
the more i look
at it, the less i
liked it.
Mar 2011 GO
15

16. t
you could selec
a date in the
future.
Nov 2011 GO
ERROR!
16

17. and you could
select a date
more than 12
ey
months ago (th
only kept
1
statements for
?)
year - who knew
Jan 2010 GO
ERROR!
17

18. Simple
Mar 2011
Feb 2011
and it struck m
e Jan 2011
there was a Dec 2010
better way to
design this. Nov 2010
Oct 2010
18

19. simplicity = Extreme usability
which made me
t
realise that jus
because
something was
usable, that
as
didn’t mean it w
simple.
19

20. n
the web focuses o
ne
Web Usability getting the job do
in the users’ own
n’t
time. Efficiency is
a big factor - even
when you watch
users.
Effectiveness Satisfaction Efficiency
ISO 9241-11 perceived
efficiency
20

21. if you’re aiming fo
r Extreme Usability
extreme usability,
it
then you try to h
high scores in all
areas.
Effectiveness Satisfaction Efficiency
ISO 9241-11
21

22. e
So an interface lik
this, which seems
fine online...
22

23. e
ends up looking lik
this - efficiency,
effectiveness and
ll
satisfaction are a
important.
23

24. Simple!
So - that’s all we
h
need to do. hit hig
ee.
scores on all thr
24

25. not so fast!
25

26. ACTIVITY
let’s vote on
gs
whether these thin
are simple and
d
complex. We shoul
all agree - right?
simplE complex
26

27. Looks simple. But
?
what does it mean
27

28. Simple. On the
outside.
28

29. e
but complex on th
inside.
29

30. do
do one thing and
it well. That’s the
ity.
mantra of simplic
Right?
30

31. So what happens
when you have a
kitchen full of ‘do
it
one thing and do
well’?
31

32. Complex? if you’ve
a
ever tried ‘typing’
URL with a Wii-remote
the n this looks a lot
better.
(although i have to
t ake issue with any
re mote control with
two on/off
buttons.)
32

33. Simplicity
is not the answer
Donald Norman
simplicity is a
slippery
e
concept. mayb
we need to
reconsider.

34. Simplicity is the ultimate
sophistication
Leonardo Da Vinci
but this guy also
k
has a great trac
record and he
thinks it’s
important. So let’s
not give up yet.

35. er
can we find a bett
the
way of explaining
ex
dual simple-compl
e
nature of all thes
things?
35

36. Simplicity isn’t a
solution or a
quality. simplicity
rs’
happens in the use
head.
Simplicity is experienced
36

37. Strong
What using it feels like
What it looks like
Weak How it’s made
and with
e
e xperiences, som
things matter
s.
more than other
37

38. works for any experience
but today, we’re talking about
simplicity
great. but if we aim
fo r simplicity all the
t
time, won’t we jus
get... bland?
38

39. Simplicity does not mean want or
poverty. It does not mean the absence
of any decor or absolute nudity.
It only means that the decor should
belong intimately to the design proper,
and that anything foreign to it should
be taken away.
Paul Jacques Grillo, Form, Function and Design
39

40. Simple so we can add
another layer to
e
simplicity to creat
.
richer experiences
We do that with
e motion and mood.
modern traditional elegant
40

41. in the business
world, we’re not
ing
very good at talk
about emotion.
41

42. two identical
products -
mastercard with
added loyalty
benefits. and both
brands have a
reputation for
r.
m aking stuff simple
he
but you’d expect t
experience to be
ere
different if you w
eir
to call each of th
call centres.
42

43. name of product / service
Practical: it makes simple
Emotional: it makes me feel
Social: it makes me look
y
here’s a simple wa
nd .
of capturing a bra
43

44. ACTIVITY
Pick a brand
MARKS & (or any
SPENCER other)
and a product
(or any
other)
and describe the experience
44

45. how did you get on?
45

46. Can you make this
simple &
Friendly?
how does brand +
te
simplicity transla
into designing
?
better interfaces
to
the first thing is
find the points of
friction.
46

47. name of product / service Photojojo
Buying Photo
Practical: it makes simple
supplies
Emotional: it makes me feel playful
great
so take a Social: it makes me look creative
online store like
photojojo...
47

48. Photojojo.com
f
and at the point o
friction, that’s
e
where they choos
to do something
y.
simple and friendl
48

49. 49

50. ACTIVITY
Think of an experience that
felt complicated to you
what and why?
50

51. Find anything interesting?
let’s pick out a
couple of key
points from
...
what we found
51

52. things feel
complex when
w e’re acting like
r
a mainstreame
Expert and the system mainstreamer
r
is designed fo
perfection experts. completion
precise control Ease of control
take it apart, explore afraid of breaking it
Exact match good enough
Principles examples, stories
detailed mental model loose mental model
deferred gratification i want it now!
Read the manual What does RTFM mean?
52

53. if you’re ‘geek like
ed
me’ then you’re us
to feeling like an
d
e xpert. Let’s remin
ourselves what it
feels like to be a
mainstreamer.
ou
so tell me what y
do when you drive
nd
through a right ha
did
bend in your car.
you say ‘turn the
wheel’?
53

54. on
this is jackie stewart
rld
his way to being F1 wo
champion in the 70’s.
He says that by the time
he
he’d reached the top,
saw each corner as
having seven distinct
phases. When you’re a
d
mainstreamer, it’s har
to understand how
.
experts see the world
54

55. desire for system
there are more experts
knowledge ers.
than mainstream
Experts parad ox: experts have
Customised the status.
experience mainstreamers
us.
nat urally want stat
so they gravitate to
en
high -spec models. Th
em.
they can’t use th
Mainstreamers
Simple, Stable, Fast
User (n)
55

56. these world views
are useful when
ou t
you’re thinking ab
personas.
56

57. Can you make an expert
behave like
a Mainstreamer?
57

58. in 1990 steward
k
pearce is a free kic
s pecialist. 20 goals
in two seasons -
not bad for a
defender.
58

59. he travels to italy
wit h england’s world
cup squad. in the
w.
semi final against
o
Germany, it goes t
penalties.
59

60. pearce puts his
le
p enalty in the midd
e
of the goal and th
s
ge rman ‘keeper save
it. England are
e
eliminated. (and w
on
never stop going
about it.)
60

61. r
u nder pressure, ou
s
p erformance break
down. the more
complex the task,
to
the faster we fall
pieces.
Yerkes-Dodson Law
61

62. So i can look at this
now and it makes
.
per fect sense to me
g
But when i’m tryin
to print out
documents on a
ter
deadline, the prin
always ‘breaks’.
62

63. s
what other device
do we use when
we’re under
pressure?
63

64. we had three
really great
design exercises
at this point.
you’ll have to
come to one of
these workshops
some time!
Create a simpler
user experience for...
64

65. report back
65

66. Part 1 Part 2
understanding it achieving it
66

67. Part 1 Part 2
understanding it achieving it
67

68. k
so let’s try a quic
exercise. take
els
something that fe
a
complicated - like
ol
DVD remote contr
and...
http://www.flickr.com/photos/redjar/136216608/
68

69. Simplify this!
69

70. On/Off
Quick OSD (On-Screen Display menu)
FL Select (change the display on DVD player)
Open/Close (Eject DVD)
Advanced Disc Review (Review playlist)
AV Enhancer (Adjust audio and video)
Repeat (Repeat play)
Multi Re-Master (Improve audio quality)
Numeric Keypad
Depth Enhancer (Reduce picture ‘noise’)
Manual Skip (Skip 30 seconds forward)
Quick Replay (Skip back a few seconds)
Cancel
Skip Forward
Skip Back
Slow Forward
Slow Back
Stop
Pause
Play
Direct Navigator/Top Menu (Main menu)
Play List/Menu (Show a disk menu or play list)
Functions (Change on screen menu)
Return (Return to previous menu)
Up Arrow
Down Arrow
Left Arrow
Right Arrow
Enter
Subtitle
Audio (Change soundtracks)
Angle/Page (Change angle/advance still pictures)
Setup (Quick setup menu)
Play Mode (All/group/random play)
Play Speed (Changes play speed)
Zoom
Group (Selects groups of items to play)
simpleandusable.com
70

71. 71

72. The four solutions
72

73. 73

74. Remove
74

75. 75

76. Perfection is achieved
not when there is nothing
more to add
but when there is
nothing more to take away
Antoine de Saint Exupery
o
great - but how d
you know what to
n
take away and whe
to stop?
76

77. Expert mainstreamer
perfection completion
precise control Ease of control
take it apart, explore afraid of breaking it
Exact match good enough
Principles examples, stories
detailed’s a clue - tamodel loose mental model
mental ke
here
deferredallnthot trol.
a
away gratification i want it now!
c n
precisio
f
There are 5 ways o
fast-forwarding.
most of them can
go.
77

78. n’t
mainstreamers do
n
want customisatio
and fine-grain
control. in places
t
like this, you’ll ge
clues to what
.
experts only want
78

79. u
i’ll bet lots of yo
got rid of the
but
su btitles button.
e
for some peopl
that ’s essential. it’s
e,
a pattern of us
. So
not a use style
y
it’s hard to justif
it’s removal.
sous titres sont disponibles
79

80. s
a nd s ome interface
ed
n eed to be pack
full of stuff.
st
W almart just lo
bn
an estimated $1.8
-
in sales by ‘de
cluttering’ its
ov e
s helves. So rem
is n’t always the
.
right solution
80

81. Organise
81

82. i like ‘organize’
because it’s cheap
and really
powerful.
82

83. and even when
something works
well in testing -
like this
interface...
83

84. ... a little bit of
‘organize’ makes
things feel a lot
simpler.
84

85. Hide
85

86. hide: either using
a hatch - like this
or by using a
touch-screen and
putting the
additional
controls in
hidden ‘layers’
86

87. Back in office
2000, microsoft
tried to hide by
only revealing
the ‘most
frequently used
features’.
87

88. but what i use
frequently isn’t
the same as what
you use
frequently. so
this approach led
to confusion.
so, again, a
better way of
hiding is based on
expert versus
mainstreamer.
88

89. the other thing
about hiding is,
people are afraid
to hide stuff
properly.
as i read this
article in the
NYT, i wondered
‘what’s a bodega’.
So i highlighted
the word ready
to google it...
89

90. and this feature
popped up - NYT
will define any
word you
highlight. but the
feature is hidden.
the trigger is
your behavior.
Anything else
would distract
from the reading
experience and
make it feel
complicated.
90

91. Displace
91

92. one other
solution is to
turn the remote
into a kind of
mouse and
displace all the
complex stuff to
an on-screen
menu.
of course you
need to make
that on-screen
menu simple. By
removing, hiding
and organizing.
but you can also
displace to
another part of
the system - the
user. 92

93. My Travel Plan
STRATFORD-UPON-AVON
OXFORD
LONDON
BATH
a few years ago i was
asked to create a
travel planner. So i
wireframed an
interface where
users could add
journeys and
destinations to an
itinerary and it
would tell them
when they had the
perfect itinerary. 93

94. My Travel Plan
click on an
activity...
STRATFORD-UPON-AVON
OXFORD
LONDON
BATH
The Roman Baths
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Morbi commodo, ipsum sed pharetra gravida, orci
magna rhoncus neque, id pulvinar odio lorem non
turpis.
Mon-Fri 0900-1830 (includes Bank Holidays)
Sat-Sun 0900-1730
Christmas: Closed
£10 Adults, £5 Children / Student / Over 65
Allow 1 hour minimum
Add this
94

95. My Travel Plan
build up a
LOCATION ACTIVITY TIME
travel plan
STRATFORD-UPON-AVON
Excelsior
Bath N/A
Hotel
OXFORD
The Roman
Bath 0930-1030
Baths
LONDON
BATH Train to
Bath 1042-1153
Oxford
The King’s
The Roman Baths Oxford 1230-1400
Head
Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Morbi commodo, ipsum sed pharetra gravida, orci
magna rhoncus neque, id pulvinar odio lorem non
turpis. Oxford Punting 1415-1515
Mon-Fri 0900-1830 (includes Bank Holidays)
Sat-Sun 0900-1730 Ashmolean
Christmas: Closed Oxford 1530-1700
Museum
£10 Adults, £5 Children / Student / Over 65
Train to
Oxford 1722-1835
London
Allow 1 hour minimum
Add this
95

96. My Travel Plan
LOCATION ACTIVITY TIME
STRATFORD-UPON-AVON
Excelsior
Bath N/A
Hotel
OXFORD
The Roman
Bath 0930-1030
Baths
LONDON
but the system tried
BATH Bath
Train to
1042-1153
Oxford
to do too much. users
felt constrained. it Oxford
The King’s
1230-1400
Head
was like trying to
complete a jigsaw Oxford Punting 1415-1515
puzzle without knowing
what the picture was. it Oxford
Ashmolean
1530-1700
Museum
didn’t work in testing
and we decided to put Oxford
Train to
1722-1835
London
our effort elsewhere.
96

97. when i next tackled the
problem, i just gave
users a set of folders
which they could name
as they pleased and
Tuesday
save whatever they
thought would fit.
People set their own
goals and used it in
ways i’d not expected.
Kid’s things
Travel discounts
97

98. these kinds of
interface - a few
simple rules that
people can easily
learn and put to use -
are remarkably
adaptable and develop
in unexpected ways.
For me, that is the
essence of
advanced simplicity
- the ‘so simple
it’s genius’ kind of
simplicity.
98

99. 1. Remove features
2. Organise features
3. Hide features
4. Displace features
99

100. Let’s try!
so, take what
you’ve learned
and apply that to
the design
exercises.
100

101. Defining simplicity (or any user experience)
Making it emotional
Experts / mainstreamers
Four strategies
1. Remove features
2. Organise features
3. Hide features
4. Displace features
101

102. No matter how cool your
user interface,
it would be better
if there were less of it
Alan Cooper
102

103. Thank you!
@gilescolborne
103