We think of ourselves as logical and creative. However, these concept applies only when we are processing information. Fundamentally, there are still some behavior that applies to all of us, and thats how we (humans) are wired. The key intent of this presentation is share more about how our brain are wired and how we process information so we design better interface Follow me on twitter @limdonald

1. Donald Lim

2. 2

3. 3

4. 4

6. 6

7. 7
• Decision about whether to
trust a website are based
heavily on superficial aspect
of UI.
[BJ Fogg’s study of website credibility with 2500 participants]
Superficial evaluation
Requires processing
Requires prior experience

8. 8
Structure of Information
Information Focus
Design Look of the Site

9. 9
• Evolved an efficient way of dealing with the millions of
pieces of sensory information
• Most of the information we take in is processed
efficiently and quickly – unconsciously
Is this good or bad?
Can I eat it?
Dangerous or harmless?

10. 10

11. 11
Grabs attention:
• Attractive
• Looking right at the
camera
• Large enough to see the
face
Hold attention:
• Message that is of
relevance or interest Processing sets in
• What are the USP or
messages worth
highlighting
Further engagement
• Supported by imagery and
key messages

12. 12

13. 13
• A person’s response and behavior may vary depending
on the behavior of other people which are salient to
them.
• When in doubt, people look for social cues

14. 14

15. 15
Online, when people are
uncertain, they look for:
• Testimonials
• Ratings
• Reviews
Good testimonials have the
following characteristics:
• More information than just a
score
• Tell a story

16. 16
• People want to feel that they are growing and acquiring
knowledge in a field or gaining skill in a task.
• To get sense of mastery  need to feel progress
http://www.youtube.com/watch?v=u6XAPnuFjJc&feature=youtu.be&t=6m43s

17. 17
Some general behavior pattern:
• The shorter the distance to
goal, the more motivated
• Boost of motivation can be
triggered with illusion of
progress
• Motivation plummets right after
goal is reach. Need more
incentive to start on the next
one.

18. 18
• We end up clicking to various website instead of
following a linear path to our objective.
• 3 Key reasons:
A. We are wired to scan for food, danger or anything that might
affect us in a positive/negative ways.
B. While our central vision may be focusing on a subject, our
peripheral vision scan for hint.
C. We can’t multi-task, hence, we get distracted when there are
more than one sensory input.

19. 19

20. 20
• Easy to draw attention as it is easy to distract.
• But getting people to concentrate on one part may be
hard.
• Things that grabs attention or annoy:
– Anything that moves (video, animation, scrolling banners)
– Photos of people, food, sex and dangerous scenes
– Anything that blinks
• Use distraction to grab attentions but eliminate them
when you want people to stay focused.

21. 21
• Herbert Simon: People operate on a principle called
“satisficing”.
• Pick the option that is adequate rather than optimal
• Analyzing all option may
A. not worth the investment or
B. not possible
Satisfy + Suffice = Satisfice

22. 22
• Design website for scan, not read
(Steve Krug, Don’t make me think)
• Assume people look for shortcuts.
• But if shortcuts are too hard to figure out, they’ll do it the
old way. (perceived effort)
• Provide defaults

23. 23
• Mental Model – People’s assumption on how things may
work when they interact with it
– Shape behavior
– Influence attention
– Define how people approach and solve problem

24. 24

25. 25
• User create models very quickly
• Mental models are subject to change with experience
• Based on prior experience with something similar,
assumption, observation and direct experience with the
product.
• People use them to predict what a product will do and
what they should do with it.

26. 26
A mental model is the
representation that a person has in
his mind about the object he is
interacting with.
A conceptual model is the actual
model that is given to the person
through the design and interface of
the actual product.

27. 27
• Why the distinction matters? Product become hard to learn and use
when:
– Product conceptual model doesn’t match user’s mental model
– When designer didn’t account/study for user’s mental model
– When product has multiple user group and conceptual model is design to
just match one user
– When conceptual model is not deliberate and designed to matched the
hardware and software
• Understand the user’s mental model (through task analysis,
observation, interview, etc)
• Designing a conceptual model to fit user’s mental model (through
interface design, iteration, validation testing, etc)

28. 28
After learning user mental model to know how it diverges.
Training can be done through:
A) Contextual Tutorial B) Video

29. 29
• People make mistake often, and they don’t like being
wrong
• Reality = something always goes wrong.

30. 30

31. 31

32. 32
Defensive design (Design for when things go wrong):
• Employs validation to check for mistakes before they
frustrate the user,
• Expands available options based on the user’s implied
intent,
• Protects site visitors from server errors and broken links
with informative messages and
• Assists the user before mistakes happen.

33. 33
Inline & Contextual Help Slow Connection
Form Validation & Error Handling On-Site Search
Server Error“Page not found” error

34. 34
• Think about what mistake are likely to occur and adjust accordingly
• Create a prototype and get real people to use it to see what errors
they made
• Write error message in plain language. They need to cover:
– That an error has been made and
– What is the error
– How can it be corrected
– Where to go for more help
• Use active voice and be direct.
• The more costly the mistake, the more you need to do to avoid
them.

35. 35
• People:
1. Made most decisions unconsciously
2. Make quick judgment on whether to trust your site
3. Look to others when they are uncertain (social validation)
4. Are motivated by desire for mastery (game mechanics)
5. Are easily distracted
6. Are inherently lazy (satisfice)
7. Have mental model of how something work (familiarity)
8. Made mistake (defensive design)

36. 36