Some thoughts on discoverability and learnability. A talk given at MOBX 2011 in Berlin.

1. Nothing you
can see that
isn't shown...
The Beatles
“All You Need is Love”

2. Tap to Launch Turn off
screen
Press and Hold to Move or Delete
Screen Shot
Take Screen
Shot
Drag Icon Onto Another Icon
to Make Folder
Slide for Next/Previous/Search Screen
Double-Click to Reveal Active Apps
Return to Home
or Stop Moving Mode
Press and Hold for Voice (Siri)

3. Affordances?
NEIN!

4. Interaction design...can be thought
WTF?
of in part as providing
AFFORDANCES so that the features
and functionality of a product can be
discovered and correctly used.
Dan Saffer
Designing for Interaction (2009)

5. The New Era of
(Non) Discoverability
Dan Saffer
@odannyboy

6. DISCOVERABILITY is
the ability to detect
a feature by its
AFFORDANCES or
VISUAL CUES.

7. DISCOVERABILITY
Object with Affordance
Button
and Label
Object with Label
Object without Affordance
or Label
Label Only
Nothing

8. DISCOVERABILITY
Mainframe Command Line GUI Post-PC
Physical Controls
Keyboard
Mouse and Stylus
Touch
Gesture
Voice

9. The more important
the task, the more
DISCOVERABLE it
should be.

10. The Top Three kinds
of features that should
be DISCOVERABLE
(via Scott Berkun):

11. 1.Things most people do,
most often.
2. Things most people do,
somewhat often.
3. Things some people do,
most often.

12. HOWEVER: In almost
any UI, not everything
is going to be
DISCOVERABLE. Not.
Going. To. Happen.

13. Why ever hide
ANYTHING?
1. Screen Real Estate
2. Emphasis
3. Aesthetics

14. Operational Simplicity
v. Perceived Simplicity

15. PROGRESSIVE
DISCLOSURE

16. More DISCOVERABLE
= More INTUITIVE ?
NEIN!

18. DISCOVERABLE is
what can be FOUND.
INTUITIVE is what
can be LEARNED.

19. If a control isn’t
DISCOVERABLE, it
should at least be
LEARNABLE.

20. Discoverability Expected Ease of Learning
Mainframe Command Line GUI Post-PC

22. Discoverability Expectation of Ease Learnability
Mainframe Command Line GUI Post-PC

23. As DISCOVERABILITY
declines, the ability to
LEARN how a product
works should rise to
accommodate for it.

24. The CELLO PRINCIPLE

26. A LEARNABLE UI is
one where users can
make a MENTAL
MODEL of it easily.

27. A LEARNABLE UI
is also one where
interactions build
on one another.

28. The RULES are
understood and
logically applied
across the system.

29. How do you make
non-discoverable UIs
LEARNABLE?

30. Coach Marks?
NEIN!

31. NO ONE wants an
owners’ manual for a
mobile app.

32. If [an app] needs to
be explained, then
it’s probably broken.
Khoi Vinh

35. Users need
INFORMATION to
make decisions:
information about
what they can do.

36. Without affordances
or labels, users only
have their memories to
rely on.

37. Without information,
users are left to their
own methods:

38. 1. Not doing it
2. Work arounds
3. Looking for help
4. TRYING RANDOM
SHIT

39. The penalty for
experimenting should
be NONE.

40. If (Expectation != Outcome) {
Learning;
}

41. Make controls for
low-frequency tasks
GUESSABLE.

43. NEVER make an
essential task gesture-
or voice only...unless it
is rapidly LEARNABLE.

45. For high-priority tasks:
use gestures and
voice as shortcuts,
while providing visible
controls to do the
same thing.

46. TWO-PLY PRODUCTS:
Visible controls for
DISCOVERABLE high-priority tasks
Gestural/voice
LEARNABLE shortcuts for high-
priority tasks,
guessable controls
for low-priority tasks

47. Come for the
DISCOVERABLE,
stay for the
LEARNABLE.

48. DANKE. THANKS.
dan@odannyboy.com
@odannyboy on twitter