1. User/customer centric design
principes voor digital touchpoints
Yvonne van Laarhoven
Manager Customer Experience Analytics @Digital Power

3. De lente van 2015 komt op de 4e plek
van zonnigste lentes

4. Yvonne van Laarhoven
• Bachelor: Applied Physics
• Master: Human Technology Interaction

5. Agenda
• Understanding UCD
• Stages in UCD
– Discovery ochtend
– Design & Evaluation middag

8. User-Centered Design (UCD) is a
multidisciplinary design approach based on the
active involvement of users to improve the
understanding of user and task requirements,
and the iteration of design and evaluation.

10. How can we improve the
wake up experience?

11. Discovery stage
1. User analyses
2. Task analyses
3. Environment analyses

12. 1. user analyes to
understand your ‘users’

13. Identify your (potential) customers

14. User analyses “methods and tools”
attitudes
behavior
quantitativequalitative
Persona creation
(Remote) User Testing
Visitor session playback
Customer Journey Mapping
Click Tests (actual behavior)
Web Analytics Data
A/B Testing
Heatmaps/scroll maps/clickmaps
Survey (closed)
Click Tests (preference)
Navigation and site structure
analyses (card sort & tree test)
Survey’s (open)
Social media and
sentiment analyses
Expert review

15. User analyses “data sources”
• Market intelligence
• Customer intelligence

16. Know their (dis)abilities

17. Know their (dis)abilities
Requires knowledge about human information
processig (cognition, perception, decision
making) and the individual and cultural
differences

18. Make overview
About your (potential) customer’s cognitive
aspects, personality traits and demographics

19. Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex
ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur.
Motivations
 Excepteur sint occaecat cupidatat non.
 Sunt in culpa qui officia deserunt mollit
anim id est laborum.
 Excepteur sint occaecat cupidatat non.
Goals
 Excepteur sint occaecat cupidatat non.
 Sunt in culpa qui officia deserunt mollit
anim id est laborum.
 Excepteur sint occaecat cupidatat non.
Pain points
 Excepteur sint occaecat cupidatat non.
 Sunt in culpa qui officia deserunt mollit
anim id est laborum.
 Excepteur sint occaecat cupidatat non.
Name <name>
Type <type>
Role <role>
“Insert quote that
characterises this persona
in one sentence.”
Behaviours
A behaviour Opposite behaviour
Variable description
A behaviour Opposite behaviour
Variable description
A behaviour Opposite behaviour
Variable description
A behaviour Opposite behaviour
Variable description
A behaviour Opposite behaviour
Variable description
A behaviour Opposite behaviour
Variable description
<Persona name>
Source: http://asinthecity.com/2011/05/13/explaining-personas-used-in-ux-design-%E2%80%93-part-2/

20. Discovery stage
1. User analyses
2. Task analyses
3. Environment analyses

21. 2. task analyes to understand
their needs and goals

22. Identify what your customers’
interaction goals
Run task analyses to understand why (potential)
customers interact with you via the different
touchpoints.
– What are the users’ goals?
– How do they get there?
– How can we improve this?

23. Task analyses

24. Task analysis “methods and tools”
attitudes
behavior
quantitativequalitative
Persona creation
(Remote) User Testing
Visitor session playback
Customer Journey Mapping
Click Tests (actual behavior)
Web Analytics Data
A/B Testing
Heatmaps/scroll maps/clickmaps
Survey (closed)
Click Tests (preference)
Navigation and site structure
analyses (card sort & tree test)
Survey’s (open)
Social media and
sentiment analyses
Expert review

25. Task analyses “data sources”
• Call center
• Market intelligence
• Customer intelligence
• Webcare

27. Discovery stage
1. User analyses
2. Task analyses
3. Environment analyses

28. 3. Environmental analyses to
understand the context of use

29. attitudes
behavior
quantitativequalitative
Persona creation
(Remote) User Testing
Visitor session playback
Customer Journey Mapping
Click Tests (actual behavior)
Web Analytics Data
A/B Testing
Heatmaps/scroll maps/clickmaps
Survey (closed)
Click Tests (preference)
Navigation and site structure
analyses (card sort & tree test)
Survey’s (open)
Social media and
sentiment analyses
Expert review
Environmental analysis “methods and
tools”

30. • Digital analytics
• CRM data base
• All data sources per touchpoint
Environmental analyses “data sources”

31. Create overview touchpoint usage

32. Define main goals per touchpoint

33. Consumer perspective:
Booking on a different device
orientation.

34. Business perspective:
Unable to take the right
‘optimising’ issues that might
problem.

36. TELCO
“My smartphone is broken, I
want to know whether I can get a
new one already”

37. TELCO
Business perspective:
Damaged reputation and high
visitors end up calling the call

39. Design interaction/service

40. • Define user goals
• Link business goals to user goals
• User goal = starting point: create the most
favorable CJ with users
• Map customer journey’s
– Per touchpoint
– Per task

42. • List the data sources and/or departments for
creating persona’s and explain how and why
you would use them

43. • Select one of the major user goals for your
website and do a task analyses

44. • List the top 3 user goals why people would visit your website
• List the business goals of your website
• List per user goal which business goal will be accomplished by
users teaching their goal

45. Part 2
Design:
Usability & User Experience principes

46. Why is it important to understand
the concepts of usability and user
experience in optimization of CX
on Digital Touchpoints?

47. Technology Acceptance Model

48. Usability, User Experience,
Customer Experience

50. Usability ≠ User Experience

51. If something is easy to use,
doesn’t mean it has a good
user experience…

52. Usability:
The extent to which a product can be
used by specified users to achieve
specified goals with effectiveness,
efficiency and satisfaction in a
specified context of use.

53. User experience:
A person's perceptions and responses that
result from the use and/or anticipated use
of a product, system or service.

55. usability
Usability is a quality attribute
of a user interfaces
user experience
"User experience"
encompasses all aspects of the
end-user's interaction with the
company, its services, and its
products.

56. http://alexandria.tue.nl/extra2/afstversl/tm/Zheng_2014.pdf

57. What do you need to know
to optimize usability of your
digital touchpoints?

58. Usability is defined by 5 quality components
1. Learnability
2. Efficiency
3. Memorability
4. Errors
5. Satisfaction

59. 1. Learnability
Efficiency
Memorability
Errors
Satisfaction

60. 1. Learnability

61. 2. Efficiency

62. 2. Efficiency

63. 2. Efficiency

64. 3. Memorability

65. 3. Memorability

66. 3. Memorability

67. 4. Errors

68. 4. Errors

69. 5. Satisfaction

70. 5. Satisfaction

71. “Good design means that beauty and usability
are in balance. An object that is beautiful to the
core is no better than one that is only pretty if
they both lack usability.”
Donald Norman

73. How to evaluate usability of your digital
touchpoints?
10 usability heuristics

74. 1. Visibility of system status
The system should always keep users informed
about what is going on, through appropriate
feedback within reasonable time.
Because we crave information

75. Feedback

76. Feedback

77. 2. Match between system and the real world
The system should speak the users' language, with
words, phrases and concepts familiar to the user,
rather than system-oriented terms. Follow real-
world conventions, making information appear in a
natural and logical order.
People create mental models

80. 3. User control and freedom
Users often choose system functions by mistake
and will need a clearly marked "emergency exit"
to leave the unwanted state without having to
go through an extended dialogue. Support undo
and redo.
People want to feel in control

83. 4. Consistency and standards
Users should not have to wonder whether
different words, situations, or actions mean the
same thing. Follow platform conventions.
Attention is limited

85. 5. Error prevention
Even better than good error messages is a
careful design which prevents a problem from
occurring in the first place. Either eliminate
error-prone conditions or check for them and
present users with a confirmation option before
they commit to the action.
People make mistakes

87. 6. Recognition rather than recall
Minimize the user's memory load by making
objects, actions, and options visible. The user
should not have to remember information from one
part of the dialogue to another. Instructions for use
of the system should be visible or easily retrievable
whenever appropriate.
People don’t want to think more than they
have to

88. visibility

89. visibility

90. visibility

91. affordance

93. affordance

94. affordance

95. affordance

96. 7. Flexibility and efficiency of use
Accelerators -- unseen by the novice user -- may
often speed up the interaction for the expert
user such that the system can cater to both
inexperienced and experienced users. Allow
users to tailor frequent actions.
People don’t want to ‘work’ and think
more than they have to

99. 8. Aesthetic and minimalist design
Dialogues should not contain information which
is irrelevant or rarely needed. Every extra unit of
information in a dialogue competes with the
relevant units of information and diminishes
their relative visibility.
Users have limited attention

101. 9. Help users recognize, diagnose, and recover
from errors
Error messages should be expressed in plain
language (no codes), precisely indicate the
problem, and constructively suggest a solution.
People make errors

105. 9. Help and documentation
Even though it is better if the system can be
used without documentation, it may be
necessary to provide help and documentation.
Any such information should be easy to search,
focused on the user's task, list concrete steps to
be carried out, and not be too large.
People make errors

107. Measuring usability & UX
• What do you need to measure
• Methods, tools and data collection

108. Measure usability & experience
• Performance metrics in quantitative studies
Success (error) rates
• Time on task
• Satisfaction scores
• Usability questionnaires Website Usability
Scale (WUS)
• Net-Promoter Score (NPS)

109. Types of insights for CJ optimization
attitudes
Why
behavior
• How often…
• Where do they come from…
• Which path…
• What do people:
• Feel about, prefer…
• Need, think about…
• How are they getting to…
• How do they…
• Where do they get stuck…
WhatHow
• Why do people:
• Follow specific paths…
• Get stuck…
What
quantitativequalitative

110. Data collection tools & methods
attitudes
behavior
quantitativequalitative
Persona creation
(Remote) User Testing
Visitor session playback
Customer Journey Mapping
Click Tests (actual behavior)
Web Analytics Data
A/B Testing
Heatmaps/scroll maps/clickmaps
Survey (closed)
Click Tests (preference)
Navigation and site structure
analyses (card sort & tree test)
Survey’s (open)
Social media and
sentiment analyses
Expert review

111. How the brain processes an experience

112. Yvonne van Laarhoven
y_v_laarhoven
yvonne.vanlaarhoven@digital-power.com

113. Select one of your main interactions on your
website and review this by applying the 10
usability heuristics, list a top 5 improvement
points