Embed Size (px)
Citation preview
FR100: You Call That Intuitive? Principles for
Integrating User Experience Into Training Chris King
Project Director
Jeff Barnes
User Experience Designer
You Call That Intuitive?
2SRA Proprietary
What is User Experience?
User Experience in Training Design
User Interface Design Examples
Conclusion
What is User Experience?
3SRA Proprietary
Information Architecture
Section 508 Compliance
Inte
rface D
esig
n
UI DevelopmentUser Centered Design
Interface Development Interaction Design
Content Management Systems
Usability
Human Computer Interaction
Wireframe
Web Development
User Experience
Conte
nt
Str
ate
gyPersonas
Dashboard Design
Hum
an F
acto
rs
Websites
Accessibility
Search Engine Optimization
Mobile Usability Web Analytics
Help
Desk
User Experience in Training Design
Efficiency
The time it takes to complete a task or
learn a system
Effectiveness
The number errors in task completion
Satisfaction
The user’s perception of how the system makes them feel based on their expectations
4SRA Proprietary
User Experience in
Training Design
Apply UX Principles
Increase user
satisfaction
Higher conversion
rate
Reduce helpdesk
tickets
Lighter cognitive
load
Technology fades into
background
5SRA Proprietary
User Experience in Training Design
6SRA Proprietary
User Experience in Training Design
7SRA Proprietary
User Research
Heuristics
Personas
Prototypes
IA
Heuristics
Agile/Iteration
Interface
508/Accessibility
Instructions
Business Process
Communication
User Surveys
User Testing
Web Analytics
Help Desk
Analyze
Design
DevelopImplement
Evaluate
Audience Analysis
• User Research
Interviews, contextual observations, focus groups, web analytics,
and helpdesk or user support data.
• Personas
A profile of a user that details
their goals, frustrations,
and demographics
8SRA Proprietary
Design Principles
Visibility of system status
Match between system and the real world
User control and freedom
Consistency and standards
Error prevention
Recognition rather than recall
Flexibility and efficiency of use
Aesthetic and minimalist design
Help users recognize, diagnose, and recover from errors
Help and documentation
SRA Proprietary 9
Copyright © 2005 by Jakob Nielsen. ISSN 1548-5552
Heuristics
Iterative Design
10SRA Proprietary
Traditional ADDIE
has the bulk of
testing after
deployment. Result
is rework and re-
deployment 4 or 5
times
Iterative Design
11SRA Proprietary
Iterative process (Agile,
LLAMA, SAM, etc.) has
evaluation, identification
of issues and re-design
all taking place before
the training has been
deployed
Iterative Design
12SRA Proprietary
By conducting heuristic reviews, quick user tests, and getting feedback
earlier in the design lifecycle, there is a potential to save time and reduce
waste in both the development and deployment phases.
Supplemental Documentation
Instructions and
Communication
Help and Training Aids
CompletionCertificates
13SRA Proprietary
Supplemental documentation like email communication, instructions, and
training aids are integral to the user experience and deserve the same
amount of consideration as you course itself.
Evaluating User Experience
User Surveys
Did you have any difficulty accessing this training?
Did you have any difficulty getting your certificate after you completed the training?
Was the navigator easy to use?
What do you find most frustrating about this training?
14SRA Proprietary
Ask users directly by
adding or modifying 1-2
questions on your Level
1 evaluations. A bad user
experience will reduce L1
results regardless of the
instructional integrity of
the content.
Evaluating User Experience
Paper Prototype
User Observations
Formal User Testing
15SRA Proprietary
User Testing
Collect information
directly from the
source. The more
information you can
collect from real users
before or after the
launch, the better off in
the end.
Consistency 1
16
Is it clear
where
the user
should
click on
this
screen to
proceed?
Nav button
has
disappeared!
Consistency 1
17
Set your
user’s
expectations
– tell them
where to click
if you break
the navigation
convention
Consistency 2
18
All
navigation
has
disappeared!
The user
must now
click on a
button in the
content area,
again
breaking the
navigation
convention.
Consistency 3
19
Sticky note,
meant to be
the “more
information”
resource
Consistency 3
20
!
Why is it over
here now?
Consistency 3
21
!
And a 3rd
location,
same course.
Inconsistency
looks
disorganized
and can make
the interface
more
noticeable to
the user.
Error Prevention 1
22
Good
Example: the
process is
very clear,
pick a
response
option, then
click submit
Error Prevention 2
23
The user is
already
looking at that
portion of the
screen where
the answer
appears. The
navigation
fades into the
background
and the user
knows to
select
“Continue”
Match the Real World
24
Good Example:
Here the
interface
presents the
alphabet in a
continuous
format, as the
user would
expect.
Actionable
letters are
highlighted;
bonus points
for alternate
navigation
presented on
the left side.
Navigator Controls
25
Here is a list of
menu options
on the left, exit
in the middle,
and a
navigation
control on the
right
there is no visual distinction
made between these different
types of buttons
Icons should be
used
consistently, not
mixed with text
Navigator Controls
26
Example of
good controls.
Buttons on the
bottom have
clear icons;
there is a solid
navigation
strategy in the
bottom right
which includes
a progress
indicator.
Top right you
has a list of
menu options,
that
consistently
pop-up
windows.
Visibility of System Status
27
Good Example:
the progress
bar shows the
portion of the
course the user
has completed,
and the bottom
bar shows
progress
through the
current video.
This helps the
user see
quickly where
they are and
what the
system is
doing.
SRA Proprietary 28
Visual Layout
Training automatically loads player in a small,
almost unusable size; open on top of cluttered
page, this can be confusing; poor user interface
reduces the learner’s trust on our competence, and
therefore reduces their faith in the content
SRA Proprietary 29
Visual Layout
Screen
presented from
the LMS,
developer has
zero control.
What to do with
this mess? A
job aid that
explains what
the user is
seeing and how
to interact with
this screen.
??
?
Summary
• User experience is
about efficiency,
effectiveness, and
satisfaction
• You can use these
techniques to
improve all three of
these criteria
30SRA Proprietary
User Research
Heuristics
Personas
Prototypes
IA
Heuristics
Agile/Iteration
Interface
508/Accessibility
Instructions
Business Process
Communication
User Surveys
User Testing
Web Analytics
Help Desk
Analyze
Design
DevelopImplement
Evaluate
