You are on page 1of 128

DESIGN & RESEARCH

USER
EXPERIENCE
GUIDELINES
REPORT BY

UX Lab
Telecommunication Regulatory Authority TRA
01 April 2020
Table of Contents

Chapter 1
User Experience Design Guidelines 7

1.0 About This Document 8


1.1 Objectives & Scope 9
The Core Objective 9
1.2 Audience 10
Benefits to the user 10
Benefits to the federal entities 10

2.0 The User-Centered Philosophy 11


2.1 Philosophy 12
Introduction 12
2.2 Focus on users 13
Persona 14
Customer Journey Mapping 15
2.3 Data-driven designs 16
Discovery and validation 17
2.4 Early and continual focus on user testing 18
Variations 18
Iterative design 19

3.0 Design Heuristics 20


3.1 10 Principles
1. Visibility of system status 21
2. Match between system and the real world 21
3. User control and freedom 21
4. Consistency and standards 21
5. Error prevention 21
6. Recognition rather than recall 22
7. Flexibility and efficiency of use 22
8. Aesthetic and minimalist design 22

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 2
Contents

9. Help users recognize, diagnose & recover from errors 22


10. Help and documentation 22

4.0 Accessibility 23
4.1 Principles 24
What is accessibility? 24
Why accessibility? 24
The 3 levels of accessibility in design 25
Level one: Sensorial Perception 25
Level two: Understanding 25
Level three: Interaction 25
4.2 Accessibility parameters 26
Audio 26
Fonts and Icons 27
Contrast 28
Color Replacement 29
No blinking media 30
Color contrast 30
Mobility 31
4.3 Evaluation Grid 32

5.0 UX Guidelines 33
1. Provide Useful Content 34
2. Be Easily Found in the Top 30 35
3. Do Not Display Unsolicited Windows or Graphics 36
4. Increase Web Site Credibility 37
5. Reduce the User’s Workload 38
6. Design for Working Memory Limitations 39
7. Minimize Page Download Time 40
8. Warn of ‘Time Outs’ 41
9. Display Information in a Directly Usable Format 42
10. Format Information for Reading and Printing 43

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 3
Contents

11. Provide Feedback when Users Must Wait 44


12. Inform Users of Long Download Times 45
13. Provide Assistance to Users 46
14. Enable Access to the Homepage 47
15. Show All Major Options on the Homepage 48
16. Limit Prose Text on the Homepage 49
17. Limit Homepage Length 50
18. Place Important Items Consistently 51
19. Avoid Scroll Stoppers 52
20. Provide Feedback on Users’ Location 53
21. Use Descriptive Tab Labels 54
22. Use ‘Glosses’ to Assist Navigation 55
23. Use Clear Category Labels 56
24. Provide Descriptive Page Titles 57
25. Use Descriptive Row and Column Headings 58
26. Use Meaningful Link Labels 59
27. Avoid Misleading Cues to Click 60
28. Repeat Important Links 61
29. Designate Used Links 62
30. Provide Consistent Click-ability Cues 63
31. Indicate Internal vs. External Links 64
32. Use Mixed-Case for Prose Text 65
33. Ensure Visual Consistency 66
34. Use at Least 16-Point Font 67
35. Color-Coding and Instructions 68
36. Label Data Entry Fields Clearly 69
37. Minimize User Data Entry 70
38. Ensure that Double-Clicking Will Not Cause Problems 71
39. Label Clickable Images 72
40. Ensure that Images Do Not Slow Downloads 73
41. Limit Large Images Above the Fold 74
42. Limit the Use of Images 75

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 4
Contents

43. Use Images to Facilitate Learning 76


44. Content Writing: Avoid Jargon - Use Familiar words 77
45. Display Only Necessary Information 78
46. Ensure Usable Search Results 79
47. Design Search Engines to Search the Entire Site 80
48. Include Hints to Improve Search Performance 81
49. Use an Iterative Design Approach 82
50. Evaluate Websites Before and After Making Changes 83

Chapter 2
User Experience Research Guidelines 84

6.0 About This Document 85


6.1 Objectives & Scope 86
The Core Objective 86

7.0 Defining Usability Testing 87


7.1 Introduction 88
What is usability testing? 88
Why usability testing? 88
What can we test? 88
7.2 Testing Stages 89
Different stages of testing 89
7.3 Testing Methods 91
Different testing methods 91
Expectancy Test 92
Card Sorting 92
Performance test 92
Visual affordance 92
Brand Definition Test 93
Free Exploration Test / Eye Tracking 93

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 5
Contents

8.0 Planning a Test 94


8.1 Introduction 95
8.2 Test Plan 96
8.3 Identifying Test Metrics 98

9.0 Roles you play 100


9.1 Different roles 101
9.2 Moderator/facilitator 102
Make the participant feel comfortable 102
Profiling of participants 103
Listen 103
Watch Yourself 104
Watch the participant 106
Watch the time 107
9.3 Note-taker 108
Examples of Effective Notes 108
9.4 Observer 111

10.0 Elements of a test plan 112


10.1 Plan checklist 113
10.2 Recruitment 114
10.3 Screener 117
10.4 Incentives & Schedule 118
10.5 Protocol 120
10.6 Note-taking & Equipment 125
11.7 Pilot test 126

11.0 Appendix 127


11.1 Documents 128

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 6
Chapter

User Experience
Design Guidelines

Page 7
1.0
About this document

Page 8
About This Document

1.1 Objectives & Scope

The Core Objective


The objective of this document is to provide the digital customer experience employees in
the federal government a ready guide to the user centric approach while designing a digital
interface. The document is aimed at ensuring seamless structural consistency and the
importance to incorporate this approach for any government sites/application.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 9
About This Document

1.2 Audience

Benefits to the user


Standards and guidelines provide a consistency that users appreciate and to which they
grow accustomed. Consistency for users translates into faster learning, greater efficiency,
fewer errors, and increased satisfaction. In short, adherence to the guidelines presented
here should result in improved application usability, easier information consumption and
intuitive processes. Standards also allow relatively easy movement across platforms.

Benefits to the federal entities


This document provides guidance to any federal entities to incorporate a user centric
design approach, while developing any user interface. The aim is to make sure the user’s
expectation is kept in mind when designing a strategy or a service. The process will ensure
the reduction of re-work, better customer happiness, increase the success rate of service
adoption and better return on investment. This documents addresses an approach and best
practices to consider, making it more readily acceptable to users.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 10
2.0
The User Centric
Philosophy

Page 11
The User Centric Philosophy

2.1 Philosophy

Introduction
Good interface design follows from good design practice and from understanding the
principles that underlie human-computer interaction. The goal of user-centered analysis is
to collect and analyze data to make informed interface design decisions for the user and
making it “useful” for them.

The first step of the process would be to understand the purpose and context of the
product or service we are designing for our users. The next step would be to specify user’s
requirement in regards to that service/product. Taking into consideration the previous two
steps, we start to design solutions to identified challenges. Our solution would then be
evaluated and validates with users.

1
Understand
Successful design
context of use
solution

4 2
Evaluate
design against Specify user
user requirements
requirement The User

3
Produce
design
solutions

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 12
The User Centric Philosophy

2.2 Focus on users

One of the keys to successful design is to develop an early focus on the users of the digital
interface. Remember that the user’s goal is not to use computers or to use the application;
the goal is to accomplish some task - find a specific document, search for contact details,
etc. Make direct contact with users; listen to them so you can efficiently facilitate the
user’s task.

The following questions will guide your understanding of the users and the tasks. As you
uncover the answers to these questions let them guide how you think about design. Also,
the answers to these questions help to focus the choices that you will make during design

• Why does someone use the site/app?


• When do they use the site/app?
• What are the characteristics of users?
• Where will they use the site/app?
• What is the skill level of the users?
• How much exposure have they had to computers?
• How well they know the tasks involved?
• How often will they have to use the site/app?
• How do users do the tasks now?
• How suited is the technology choice to the user?
• What task knowledge needs to be built into the site/app?

The above data can be gathered by various existing data touch-points you may have
access to (for e.g. google analytics, user research) or you can conduct user research (E.g.
user interviews, focus groups, survey, etc).

Once you have gathered the above data you can represent it with creating persona, that
represent your target profiles and drafting a customer journey to address the user’s pain-
points, which will help guide to build an interface focusing on these aspects. There is a
sample persona and customer journey provided in the next page.

Data from: Ameritech

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 13
The User Centric Philosophy

2.2 Focus on users

Persona
A persona is fictional character of your users that you create– although fictional this will
closely represent your target audience, their behavior (platform used, technical knowledge,
etc.), needs, goals and frustrations. These are the insights you will be getting from your
user while interviewing them and observing their behaviour. The persona will identify the
key objectives that will help you put together the customer journey.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 14
The User Centric Philosophy

2.2 Focus on users

Customer Journey Mapping


This experience map document will help understand your product/service interaction from
the user’s perspective. Take each goal listed in the persona and create a journey of how
would the user fulfil the task, with that record the user’s thoughts, feelings and emotions at
every stage. Now look at the journey again (especially the pain points) and list down
features/functionality that would help ease the user’s tasks and address the issues the user
face with the solution. Below is an example of an application an HR has to submit for her
employee and a solution to an online portal with features that will help her be efficient with
her work.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 15
The User Centric Philosophy

2.3 Data Driven Designs

Data-driven design
Good design means solving problems for users. To effectively solve problems, designers
rely on available information as much as possible. In the 21st century digital age, it is
crucial to make use of the large amounts of the data available. Every action choice decision
made by the user online can be recorded and therefore it is logical expectation from the
user to experience more tailored services. Data could be digital ( ie: Google Analytics) or
insights gathered from users during the research phase and when validating solutions.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 16
The User Centric Philosophy

2.3 Data Driven Designs

Discovery and validation


There is also data gathered from user testing which could be qualitative or quantitative.
You can use data gathering to understand the problem better, and to validate the solutions
you come up with.
Data-driven design oscillates between quantitative inputs and qualitative insights.
Some of the key points that need to be captured include:

• What do users want the most from this site/application.


• What are the alternatives available to the users instead of using this site/app and
platform
• What they consider as a minimum requirement to achieve their goal/tasks.
• What can make this site/app of great quality in their perspective.
• What is the most likely to annoy/confuse them in this site/app.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 17
The User Centric Philosophy

2.4 Early and continual focus on user testing

Variations
The design process should begin with exploring different solutions before refining one.
For every key template, start with a few variations at low-fidelity level (sketches or
wireframes shown below) as they are easy to modify or even toss without investing too
much time in them.
Produce 3 to 5 variations, as diverse as possible, then explore the strong points of each of
them and see what can be carried forward in a consolidated design. Be decisive: not all
features are compatible and there should still be a clear hierarchy in each of them.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 18
The User Centric Philosophy

2.4 Early and continual focus on user testing

Iterative design
Once the design has been created and tested,
use the output from the validation to make
changes. The design-modify-test cycle is critical
for getting the best application user interface.
Use contact with users to find flaws in the
application, not in the users. Continually try to
understand what users need and want and be
willing to make changes as a result. Remember,
it’s impossible to get the design right the first
time.

Many designers skip or shortchange testing of


the most critical system component: the user.
User testing (often called “usability testing”) is
not simply gathering opinions. The purpose of
code reviews is to find flaws and weaknesses in
code; the purpose of user testing is to find flaws and weaknesses in how the users interact
with the site/app.

User tests can be constructed that are every bit as quantifiable and rigorous as established
methods for testing quality. As a business owner, designer or a developer, you are not an
impartial judge of the interface. You have different (probably much more technical) skills
than the user community and you will use the site/application differently than your users.
The only way to uncover and confront usability problems is through user testing.

User testing is often neglected because there is a lack of information on what it is, how to
do it, and when to do it. In short, user testing involves having a sample of representative
users perform typical tasks under realistic constraints. It should be done early enough in
the process so that key problems can be identified and rectified before the interface is
released.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 19
3.0
Design Heuristics

Page 20
Design Heuristics

3.1 10 Principles

According to Jakob Nielsen, the below are 10 general “heuristic” principles that help with
identifying usability issues.

1. Visibility of system status


The system should always keep users informed about what is going on, through
appropriate feedback within reasonable time.

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.

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.

4.Consistency and standards


Users should not have to wonder whether different words, situations, or actions mean the
same thing. Follow platform conventions.

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.

Data from: Nielsen Norman

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 21
Design Heuristics

3.1 10 Principles

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.

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.
Accelerators help the user to guide their action like for example the Information icon that is
found to give instructions to users.

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.

9.Help users recognize, diagnose & recover from errors


Error messages should be expressed in plain language (no codes), precisely indicate the
problem, and constructively suggest a solution.

10.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.

Data from: Nielsen Norman

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 22
4.0
Accessibility

Page 23
Accessibility

4.1 Principles

What is accessibility?
It simply means “Giving the opportunity for everyone to navigate your content”
Many of us can potentially struggle to see, hear, touch, or talk. Whether because of an
injury, condition, or simply aging, we all need a design that understands our limitations, and
accommodates them. Accessibility in design simply means making sure people can use a
product or service, even with their own limitations.

A design that works in any situation


Whether it is too dark inside, too bright outside, while on the go, without a connection, we
all can experience situations in which the content we try to access needs to adapt to a
specific context. Making sure that this content can be consumed in a variety of settings is
also at the core of accessibility.

Why accessibility?
It is the right thing to do
As a government entity, making sure that all citizens can access services is at the core of
our mission statement. Even more than businesses, governments should set the example
and define how good design can help everyone access content.

It is good for business


A service that everybody can easily access also means more incoming requests, simply
because more people are able to reach out.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 24
Accessibility

4.1 Principles

The 3 levels of accessibility in design

Level one: Sensorial Perception


Can everyone realize what’s going on a digital platform? Content should be easily perceived
even with impaired vision, hearing or mobility.

Level two: Understanding


Can everyone fully comprehend the message that is being used? Are we using simple
structure, sentences and vocabulary? Even people with limited proficiency in the language
should be able to understand the key messages. The most important elements should be
insisted on and visually highlighted.

Level three: Interaction


Designed pages should enable different types of interaction: touch, scroll, long press,
swipe (mobile) mouse or keyboard navigation (desktop). When relevant, voice command
will help users ask specific queries.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 25
Accessibility

4.2 Accessibility Parameters

1. Audio

Provide text description of images and videos.

• Descriptions can be hidden but should be accessible to voice readers.


• Synchronized captions should be provided for videos
• Alternatively, a full transcript can be provided
• Avoid text as part of an image, as readers will not be able to pick it up. Use plain text as
an overlay, a caption or simply side description instead.
• No audio or video files should be without contextual action taken by the user( ie: play,
pause ,etc…)

DO’s DONT’s
Keep audio content linked to Autoplay audio/video content or
actions taken by the user. apply background music.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 26
Accessibility

4.2 Accessibility Parameters

2. Fonts & Icons

Size

• The minimum font size used at all times should be 16 dp.


• Icons should follow accordingly and not be smaller than 16 dp
• Use real text rather than text within graphics.
• Select basic, simple, easily-readable fonts.
• Use a limited number of fonts.

DO’s DONT’s
Keep all text above 16 dp across Write any copy below 14 dp, even
screens. Work your way upwards for small details.
from that minimum size.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 27
Accessibility

4.2 Accessibility Parameters

3. Contrast
Contrast should have a ratio of at least 4.5:1 for copy under 16 dp (for more details about
text size, see the Typography section). For copy of 16 dp and more, a minimum contrast
ratio of 3:1 should be applied.

DO’s DONT’s
Test the contrast ration for the Use the same copy color on both
style guide, then stick to the exact light and dark backgrounds.
color codes.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 28
Accessibility

4.2 Accessibility Parameters

4. Color replacement
Do not rely exclusively on color to convey meaning. Associate color with a symbol or text.
This will help users understand important messages

DO’s DONT’s
Provide help text for users in order Use the same copy color on both
to help them understand what they light and dark backgrounds.
need to do

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 29
Accessibility

4.2 Accessibility Parameters

5. No blinking media
Remove all media that produces flashes more than three times in a second. This could
potentially cause seizures for some users.

6. Logo contrast
Logos should have a strong contrast by definition, as they should be identifiable by shape.
Logos should not be altered to match contrast requirements, as they cannot be tempered
with in general.

DO’s DONT’s
Keep logos as per Brand Alter logos, even to increase their
guidelines. contrast.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 30
Accessibility

4.2 Accessibility Parameters

7. Mobility
Interaction areas, especially for mobile, should be at least 48x48 dp

button height tapping area tapping area


36 dp Call to action 48 dp height Call to action <48 dp height

DO’s DONT’s
Make the whole container clickable Restrain clickable elements to text
if the UI element is visually smaller areas in mobile design
than 48 x 48 dp

Whenever content (e.g. completion of a form, automatic log-out) is time-bound, time


limits should be adjustable in order to enable users with less mobility to complete tasks at
their own pace.

• Exceptions to this involve contexts of high security, or whenever modifying the time
would alter the experience altogether for other users (e.g. auction).

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 31
Accessibility

4.3 Evaluation Grid

In order to ensure that your website is accessible, you need to ensure that all points below
are compliant.

Non
No Criterion Compliant
Compliant

All audio and video content is only triggered by an


1
interaction.

2 Audio and video content have captions.

3 Text is not part of images

4 Text is at least 12 dp font size

5 Icons are not smaller than the smallest font size

Contrast has at least a 4.5:1 ratio between copy and


6
background for small text under 14 dp

Contrast has at least a 3:1 ratio between copy above


7
14 dp and the background

Colour is not the only signifier. Complementary icons


8
or text convey meaning together with colours.

9 Logo contrast is not altered compared to the original

Interaction areas are at least 48 x 48 dp on mobile


10
and tablet

11 Limited time can be extended

12 Page items are reachable through keyboard

13 The language level is accessible to most users

All abbreviations and acronyms are at least explained


14
once

The destination of the links are either explicit or clear


15
from context

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 32
5.0
UX Guidelines

Page 33
5.0 UX Guidelines

1. Provide Useful Content

Guideline
Provide content that is engaging, relevant, and appropriate to the audience.

Comments
Content is the information provided on a Web site. Do not waste resources providing easy
access and good usability to the wrong content. One study found that content is the most
critical element of a Web site. Other studies have reported that content is more important
than navigation, visual design, functionality, and interactivity.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 34
5.0 UX Guidelines

2. Be Easily Found in the Top 30

Guideline
In order to have a high probability of being accessed, ensure that a Web site is in the ‘top
30’ references presented from a major search engine.

Comments
One study showed that users usually do not look at Websites that are not in the ’top 30.’
Some of the features required to be in the ‘top 30’ include appropriate meta-content and
page titles, the number of links to the Web site, as well as updated registration with the
major search engines.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 35
5.0 UX Guidelines

3. Do Not Display Unsolicited Windows or Graphics

Guideline
Do not have unsolicited windows or graphics ‘pop-up’ to users.

Comments
Users have commented that unsolicited windows or graphics that ‘pop up’ are annoying
and distracting when they are focusing on completing their original activity.

Example
Users Feedback pops on the homepage for the first time landed users [Don’t]

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 36
5.0 UX Guidelines

4. Increase Web Site Credibility

Guideline
Optimize the credibility of information- oriented Web sites.

Comments
Based on the results of two large surveys, the most important Web site-related actions that
organizations can do to help ensure high Web site credibility are to:

• Provide a useful set of frequently asked questions (FAQ) and answers


• Ensure the Web site is arranged in a logical way
• Provide articles containing citations and references
• Show author’s credentials
• Ensure the site looks professionally designed
• Provide an archive of past content (where appropriate)
• Ensure the site is as up-to-date as possible
• Provide links to outside sources and materials
• Ensure the site is frequently linked to other credible sites.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 37
5.0 UX Guidelines

5. Reduce the User’s Workload

Guideline
Allocate functions to take advantage of the inherent respective strengths of computers and
users.

Comments
Let the computer perform as many tasks as possible, so that users can concentrate on
performing tasks that actually require human processing and input. Ensure that the
activities performed by the human and the computer take full advantage of the strengths of
each. For example, calculating body mass indexes, remembering user IDs, and mortgage
payments are best performed by computers.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 38
5.0 UX Guidelines

6. Design for Working Memory Limitations

Guideline
Do not require users to remember information from place to place on a Web site.

Comments
Users can remember relatively few items of information for a relatively short period of time.
This ’working memory’ capacity tends to lessen even more as people become older. One
study compared the working memory performance of age groups 23-44 years and 61-68
years. The younger group performed reliably better than the older group.

When users must remember information on one Web page for use on another page or
another location on the same page, they can only remember about three or four items for a
few seconds. If users must make comparisons, it is best to have the items being compared
side-by-side so that users do not have to remember information—even for a short period of
time.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 39
5.0 UX Guidelines

7. Minimize Page Download Time

Guideline
Minimize the time required to download a Web site’s pages.

Comments
The best way to facilitate fast page loading is to minimize the number of bytes per page.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 40
5.0 UX Guidelines

8. Warn of ‘Time Outs’

Guideline
Let users know if a page is programmed to ’time out,’ and warn users before time expires so
they can request additional time.

Comments
Some pages are designed to ’time out’ automatically (usually because of security reasons).
Pages that require users to use them within a fixed amount of time can present particular
challenges to users who read or make entries slowly.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 41
5.0 UX Guidelines

9. Display Information in a Directly Usable Format

Guideline
Display data and information in a format that does not require conversion by the user.

Comments
Present information to users in the most useful and usable format possible. Do not require
users to convert or summarize information in order for it to be immediately useful. It is best
to display data in a manner that is consistent with the standards and conventions most
familiar to users.

Do not require users to convert, transpose, compute, interpolate, or translate displayed


data into other units, or refer to documentation to determine the meaning of displayed data.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 42
5.0 UX Guidelines

10. Format Information for Reading and Printing

Guideline
Prepare information with the expectation that it will either be read online or printed.

Comments
Documents should be prepared that are consistent with whether users can be expected to
read the document online or printed. One study found that the major reason participants
gave for deciding to read a document from print or to read it online was the size of the
document. Long documents (over five pages) were printed, and short documents were read
online. In addition, users preferred to print information that was related to research,
presentations, or supporting a point. They favored reading it online if for entertainment.

Users generally favored reading documents online because they could do it from anywhere
at any time with 24/7 access. Users were inclined to print (a) if the online document
required too much scrolling, (b) if they needed to refer to the document at a later time, or
(c) the complexity of the document required them to highlight and write comments.

Example
Service Cards

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 43
5.0 UX Guidelines

11. Provide Feedback when Users Must Wait

Guideline
Provide users with appropriate feedback while they are waiting.

Comments
If processing will take less than 10 seconds, use an hourglass to indicate status. If
processing will take up to sixty seconds or longer, use a process indicator that shows
progress toward completion. If computer processing will take over one minute, indicate this
to the user and provide an auditory signal when the processing is complete.

Users frequently become involved in other activities when they know they must wait for
long periods of time for the computer to process information. Under these circumstances,
completion of processing should be indicated by a non- disruptive sound (beep).

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 44
5.0 UX Guidelines

12. Inform Users of Long Download Times

Guideline
Indicate to users the time required to download an image or document at a given
connection speed.

Comments
Providing the size and download time of large images or documents gives users sufficient
information to choose whether or not they are willing to wait for the file to download. One
study concluded that supplying users with download times relative to various connection
speeds improves their Web site navigation performance.

Example:

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 45
5.0 UX Guidelines

13. Provide Assistance to Users

Guideline
Provide assistance for users who need additional help with the Web site.

Comments
Users sometimes require special assistance. This is particularly important if the site was
designed for inexperienced users or has many first time users. For example, in one Web site
that was designed for repeat users, more than one-third of users (thirty- six percent) were
first time visitors. A special link was prepared that allowed new users to access more
information about the content in the site and described the best way to navigate the site.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 46
5.0 UX Guidelines

14. Enable Access to the Homepage

Guideline
Enable users to access the homepage from any other page on the Web site.

Comments
Many users return to the homepage to begin a new task or to start a task over again. Create
an easy and obvious way for users to quickly return to the homepage of the Web site from
any point in the site.

Many sites place the organization’s logo on the top of every page and link it to the
homepage. While many users expect that a logo will be clickable, many other users will not
realize that it is a link to the homepage. Therefore, include a link labeled ‘Home’ near the
top of the page to help those users.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 47
5.0 UX Guidelines

15. Show All Major Options on the Homepage

Guideline
Present all major options on the homepage.

Comments
Users should not be required to click down to the second or third level to discover the full
breadth of options on a Web site. Be selective about what is placed on the homepage, and
make sure the options and links presented there are the most important ones on the site.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 48
5.0 UX Guidelines

16. Limit Prose Text on the Homepage

Guideline
Limit the amount of prose text on the homepage.

Comments
The first action of most users is to scan the homepage for link titles and major headings.
Requiring users to read large amounts of prose text can slow them considerably, or they
may avoid reading it altogether.

Example
Clean, prose-free design allows users to quickly discern the primary headings and sub-
headings without the distraction of paragraphs of text.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 49
5.0 UX Guidelines

17. Limit Homepage Length

Guideline
Limit the homepage to one screenful of information, if at all possible.

Comments
Any element on the homepage that must immediately attract the attention of users should
be placed ’above the fold.’ Information that cannot be seen in the first screenful may be
missed altogether—this can negatively impact the effectiveness of the Web site. If users
conclude that what they see on the visible portion of the page is not of interest, they may
not bother scrolling to see the rest of the page.

Some users take a long time to scroll down ’below the fold,’ indicating a reluctance to move
from the first screenful to subsequent information. Older users and novices are more likely
to miss information that is placed below the fold.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 50
5.0 UX Guidelines

18. Place Important Items Consistently

Guideline
Put important, clickable items in the same locations, and closer to the top of the page,
where their location can be better estimated.

Comments
Users will try to anticipate where items will appear on their screen. They will start
’searching’ a page before the layout appears on their screen. When screen items remain
constant, users learn their location on a page, and use this knowledge to improve task
performance. Experienced users will begin moving their mouse to the area of the target
before the eye detects the item. Users can anticipate the location of items near the top
much better than those farther down the page.

Example
Important items in this example is the primary navigation tabs - they are consistently
placed at the top of each page

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 51
5.0 UX Guidelines

19. Avoid Scroll Stoppers

Guideline
Ensure that the location of headings and other page elements does not create the illusion
that users have reached the top or bottom of a page when they have not.

Comments
In one study, three headings were positioned in the center of a page below a section of
introductory text—the headings were located about one inch below the navigation tabs.
When users scrolled up the page from the bottom and encountered these headings, they
tended to stop, thinking the headings indicated the top of the page.

Similarly, users have been found to not scroll to the true bottom of a page to find a link
because they encountered a block of text in a very small font size. This small type led users
to believe that they were at the true bottom of the page. Other elements that may stop
users’ scrolling include horizontal lines, inappropriate placement of ’widgets,’ and cessation
of background color.

Example
The user in this example will not notice the scrolling and what comes below the fold.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 52
5.0 UX Guidelines

20.Provide Feedback on Users’ Location

Guideline
Provide feedback to let users know where they are in the Web site.

Comments
Feedback provides users with the information they need to understand where they are
within the Web site, and for proceeding to the next activity. Examples of feedback include
providing path and hierarchy information (i.e., ’breadcrumbs’), matching link text to the
destination page’s heading, and creating URLs that relate to the user’s location on the site.
Other forms of feedback include changing the color of a link that has been clicked
(suggesting that destination has been visited), and using other visual cues to indicate the
active portion of the screen.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 53
5.0 UX Guidelines

21. Use Descriptive Tab Labels

Guideline
Ensure that tab labels are clearly descriptive of their function or destination.

Comments
Users like tabs when they have labels that are descriptive enough to allow error-free
selections. When tab labels cannot be made clear because of the lack of space, do not use
tabs.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 54
5.0 UX Guidelines

22.Use ‘Glosses’ to Assist Navigation

Guideline
Provide ’glosses’ to help users select correct links.

Comments
’Glosses’ are short phrases of information that popup when a user places his or her mouse
pointer close to a link. It provides a preview to information behind a link. Users prefer the
preview information to be located close to the link, but not placed such that it disturbs the
primary text. However, designers should not rely on the ’gloss’ to compensate for poorly
labeled links.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 55
5.0 UX Guidelines

23.Use Clear Category Labels

Guideline
Ensure that category labels, including links, clearly reflect the information and items
contained within the category.

Comments
Category titles must be understood by typical users. Users will likely have difficulty
understanding vague, generalized link labels, but will find specific, detailed links, and
descriptors easier to use.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 56
5.0 UX Guidelines

24.Provide Descriptive Page Titles

Guideline
Put a descriptive, unique, concise, and meaningfully different title on each Web page.

Comments
Title refers to the text that is in the browser title bar (this is the bar found at the very top of
the browser screen). Titles are used by search engines to identify pages. If two or more
pages have the same title, they cannot be differentiated by users or the Favorites capability
of the browser. If users bookmark a page, they should not have to edit the title to meet the
characteristics mentioned above.

Remember that some search engines only list the titles in their search results page. Using
concise and meaningful titles on all pages can help orient users as they browse a page or
scan hot lists and history lists for particular URLs. They can also help others as they
compile links to your pages.

To avoid confusing users, make the title that appears in the heading of the browser
consistent with the title in the content area of the pages.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 57
User Experience Design Guidelines

25.Use Descriptive Row and Column Headings

Guideline
Ensure that data tables have clear, concise, and accurate row and column headings.

Comments
Use row and column headings to indicate unique cell contents. Users require clear and
concise table headings in order to make efficient and effective use of table information.
Row and column headings will indicate to screen readers how data points should be labeled
or identified, so the user can understand the significance of the cell in the overall scheme
of the table.

Example
In this example, There is no meaning of some columns while it has a header that can be
used to clarify what information these columns provide. [Don’t]

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 58
5.0 UX Guidelines

26.Use Meaningful Link Labels

Guideline
Use link labels and concepts that are meaningful, understandable, and easily differentiated
by users rather than designers.

Comments
To avoid user confusion, use link labels that clearly differentiate one link from another.
Users should be able to look at each link and learn something about the link’s destination.
Using terms like ’Click Here’ can be counterproductive.

Clear labeling is especially important as users navigate down through the available links.
The more decisions that users are required to make concerning links, the more
opportunities they have to make a wrong decision.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 59
5.0 UX Guidelines

27. Avoid Misleading Cues to Click

Guideline
Ensure that items that are not clickable do not have characteristics that suggest that they
are clickable.

Comments
Symbols usually must be combined with at least one other cue that suggests click-ability. In
one study, users were observed to click on a major heading with some link characteristics,
but the heading was not actually a link.

However, to some users bullets and arrows may suggest click-ability, even when they
contain no other click-ability cues (underlining, blue coloration, etc.). This slows users as
they debate whether the items are links.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 60
5.0 UX Guidelines

28.Repeat Important Links

Guideline
Ensure that important content can be accessed from more than one link.

Comments
Establishing more than one way to access the same information can help some users find
what they need. When certain information is critical to the success of the Web site, provide
more than one link to the information. Different users may try different ways to find
information, depending on their own interpretations of a problem and the layout of a page.
Some users find important links easily when they have a certain label, while others may
recognize the link best with an alternative name.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 61
5.0 UX Guidelines

29.Designate Used Links

Guideline
Use color changes to indicate to users when a link has been visited.

Comments
Generally, it is best to use the default text link colors (blue as an unvisited location/link and
purple as a visited location/ link). Link colors help users understand which parts of a Web
site they have visited. In one study, providing this type of feedback was the only variable
found to improve the user’s speed of finding information. If a user selects one link, and
there are other links to the same target, make sure all links to that target change color.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 62
5.0 UX Guidelines

30.Provide Consistent Click-ability Cues

Guideline
Provide sufficient cues to clearly indicate to users that an item is clickable.

Comments
Users should not be expected to move the cursor around a Web site to determine what is
clickable. Using the eyes to quickly survey the options is much faster than ’guessing’
Similarly, relying on mouseovers to designate links can confuse newer users, and slow all
users as they are uncertain about which items are links.

Be consistent in your use of underlining, bullets, arrows, and other symbols such that they
always indicate click-ability or never suggest click-ability. For example, using images as
both links and as decoration slows users as it forces them to study the image to discern its
click-ability.

Items that are in the top center of the page, or left and right panels have a high probability
of being considered links. This is particularly true if the linked element looks like a real-
world tab or push button.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 63
5.0 UX Guidelines

31. Indicate Internal vs. External Links

Guideline
Indicate to users when a link will move them to a different location on the same page or to a
new page on a different Web site.

Comments
One study showed that users tend to assume that links will take them to another page
within the same Web site. When this assumption is not true, users can become confused.
Designers should try to notify users when they are simply moving down a page, or leaving
the site altogether.

Example
You can show the external links in the title of the link itself when it is going outside the
website.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 64
5.0 UX Guidelines

32.Use Mixed-Case for Prose Text

Guideline
When users must read a lot of information, use lower-case fonts and appropriate
capitalization to ensure the fastest possible reading speed.

Comments
Using ’mixed-case’ fonts for reading prose text means that most letters will be lowercase,
with all letters that should be capitalized being in uppercase. Most users have had
considerable experience reading lowercase letters and are therefore very proficient at it.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 65
5.0 UX Guidelines

33.Ensure Visual Consistency

Guideline
Ensure visual consistency of Website elements within and between Web pages.

Comments
Two studies found that the number of errors made using visually inconsistent displays is
reliably higher than when using visually consistent displays. Visual consistency includes the
size and spacing of characters; the colors used for labels, fonts and backgrounds; and the
locations of labels, text and pictures. Earlier studies found that tasks performed on more
consistent interfaces resulted in (1) a reduction in task completion times; (2) a reduction in
errors; (3) an increase in user satisfaction; and (4) a reduction in learning time.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 66
5.0 UX Guidelines

34.Use at Least 16-Point Font

Guideline
Use at least a 16-point font on all Web pages.

Comments
Research has shown that fonts smaller than 16 points elicit slower reading performance
from users. Never use less than fourteen-point font on a Web site.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 67
5.0 UX Guidelines

35.Color-Coding and Instructions

Guideline
When using color-coding on your Web site, be sure that the coding scheme can be quickly
and easily understood.

Comments
One study found that participants were able to answer questions significantly faster when
the interface was color-coded, but only when information about the color-coding was
provided. When both color-coding and information about how to interpret the colors were
provided, user performance improved by forty percent. Be sure that the information
provided does not require the user to read and comprehend a lot of text to understand it.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 68
5.0 UX Guidelines

36.Label Data Entry Fields Clearly

Guideline
Display an associated label for each data entry field to help users understand what entries
are desired.

Comments
Employ descriptive labels that clearly, concisely, and unambiguously define the required
entry. Make labels distinct enough so that readers do not confuse them with the data
entries themselves. This can be done by bolding the labels or providing other visual cues,
such as an asterisk.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 69
5.0 UX Guidelines

37. Minimize User Data Entry

Guideline
Do not require users to enter the same information more than once.

Comments
Requiring re-entry of data imposes an additional task on users, and increases the
possibility of entry errors. When entries made by users on one page are required on
another page, the computer should retrieve the original entries, rather than requiring re-
entry of the same information. In general, require users to make as few entries as possible.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 70
5.0 UX Guidelines

38.Ensure that Double-Clicking Will Not Cause


Problems

Guideline
Ensure that double-clicking on a link will not cause undesirable or confusing results.

Comments
Many users double-click on a link when only one click is needed. Developers cannot stop
users from double-clicking, but they should try to reduce the negative consequences of
this behavior.

Usability testing has indicated that if users start with quick double-clicks, they tend to
continue to do this for most of the test. Sometimes, when both clicks are detected by the
computer, the first click selects one link and the second click selects a second link, causing
unexpected results.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 71
5.0 UX Guidelines

39.Label Clickable Images

Guideline
Ensure that all clickable images are either labeled or readily understood by typical users.

Comments
Occasional or infrequent users may not use an image enough to understand or remember
its meaning. Ensure that images and their associated text are close together so that users
can integrate and effectively use them together. Additionally, alt text should accompany
every clickable image.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 72
5.0 UX Guidelines

40.Ensure that Images Do Not Slow Downloads

Guideline
Take steps to ensure that images on the Web site do not slow page download times
unnecessarily.

Comments
User frustration increases as the length of time spent interacting with a system increases.
Users tolerate less delay if they believe the task should be easy for the computer. One
study reported that users rated latencies of up to five seconds as ’good.’ Delays over ten
seconds were rated as ’poor.’ Users rate pages with long delays as being less interesting
and more difficult to scan. One study reported no relationship between slow page
download times and users giving up.

To speed download times, use several small images rather than a single large image on a
page; use interlacing or progressive images; and use several of the same images.
Designers should also minimize the number of different colors used in an image and put
HEIGHT and WIDTH pixel dimension tags in an image reference. To achieve faster response
time for users with dial-up modems, limit page size to less than 30,000 bytes.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 73
5.0 UX Guidelines

41. Limit Large Images Above the Fold

Guideline
Do not fill the entire first screenful with one image if there are screensful of text information
below the fold.

Comments
Large graphics that cover most of the screen at the top of the page suggest to users that
there is no more information below the graphic. In one study, because a graphic filled the
screen, some users did not use the scrollbar to scroll down to more content. In fact, some
users did not even suspect that more information might be located below the fold.

Example
This is a bad example of the area above the fold. The users will never expect to find
something below this area. [Don’t]

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 74
5.0 UX Guidelines

42.Limit the Use of Images

Guideline
Use images only when they are critical to the success of a Web site.

Comments
Ensure that a Web site’s graphics add value and increase the clarity of the information on
the site. Certain graphics can make some Web sites much more interesting for users, and
users may be willing to wait a few extra seconds for them to load. Users tend to be most
frustrated if they wait several seconds for a graphic to download, and then find that the
image does not add any value. Some decorative graphics are acceptable when they do not
distract the user.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 75
5.0 UX Guidelines

43.Use Images to Facilitate Learning

Guideline
To facilitate learning, use images rather than text whenever possible.

Comments
The superiority of pictures over text in a learning situation appears to be strong. For
example, pictures of common objects are recognized and recalled better than their textual
names. Exceptions seem to occur when the items are conceptually very similar, or when
items are presented so quickly that learners cannot create verbal labels.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 76
5.0 UX Guidelines

44.Content Writing: Avoid Jargon - Use Familiar


words

Guideline
Do not use words that typical users may not understand. Use words that are frequently
seen and heard.

Comments
Terminology plays a large role in the user’s ability to find and understand information. Many
terms are familiar to designers and content writers, but not to users.
To improve understanding among users who are accustomed to using the jargon term, it
may be helpful to put that term in parentheses. A dictionary or glossary may be helpful to
users who are new to a topic, but should not be considered a license to frequently use
terms typical users do not understand.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 77
5.0 UX Guidelines

45.Display Only Necessary Information

Guideline
Limit page information only to that which is needed by users while on that page.

Comments
Do not overload pages or interactions with extraneous information. Displaying too much
information may confuse users and hinder assimilation of needed information. Allow users
to remain focused on the desired task by excluding information that task analysis and
usability testing indicates is not relevant to their current task. When user information
requirements cannot be precisely anticipated by the designer, allow users to tailor displays
online.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 78
5.0 UX Guidelines

46.Ensure Usable Search Results

Guideline
Ensure that the results of user searches provide the precise information being sought, and
in a format that matches users’ expectations.

Comments
Users want to be able to use the results of a search to continue solving their problem.
When users are confused by the search results, or do not immediately find what they are
searching for, they become frustrated. Make sure to show proper titles and links and don’t
forget to have the empty state with search suggestions to help the users to know where to
go.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 79
5.0 UX Guidelines

47. Design Search Engines to Search the Entire Site

Guideline
Design search engines to search the entire site, or clearly communicate which part of the
site will be searched.

Comments
Designers may want to allow users to control the range of their searches. However, users
tend to believe that a search engine will search the entire Web site. Do not have search
engines search only a portion of the site without clearly informing users which parts of the
site are being searched.

Keep in mind that what a designer may consider to be the entirety of a site may not be the
same as what the user thinks is the ’whole’ site. For example, many large sites have various
subsections that are maintained by different designers, so the user may think of a site as
something that designers think of as several sites. Make sure it is clear to users what
part(s) of the Web site are being searched. Provide a means for users to narrow the scope
of searches on large Web sites by providing easy access to specific sub-sites when
searching.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 80
5.0 UX Guidelines

48.Include Hints to Improve Search Performance

Guideline
Include specific hints to improve search performance.

Comments
A major tradeoff that must be considered in the design of a search input interface is related
to the need to provide sufficient instructions for users to take advantage of the power of
the search engine, while keeping in mind the reluctance of users to read instructions.

One study found a direct link between the content of search hints and task effectiveness.
When syntactic information was included in the search hint, participants achieved
significantly greater syntactic performance. When semantic information was included in the
search hint, participants achieved significantly greater semantic performance. In addition,
participants’ confidence that their queries would retrieve the correct answer was reliably
enhanced by the presence of semantic search hints (but not syntactic hints). The presence
of examples improved semantic performance, but had no effect on syntactic performance.
When hints contained more than one type of information (syntactic, semantic, or
examples), performance was generally lower than when only one hint type was presented.
Also, participants were able to complete the search tasks faster when only one hint was
presented.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 81
5.0 UX Guidelines

49.Use an Iterative Design Approach

Guideline
Develop and test prototypes through an iterative design approach to create the most useful
and usable Web site.

Comments
Iterative design consists of creating paper or computer prototypes, testing the prototypes,
and then making changes based on the test results. The ’test and make changes’ process
is repeated until the Web site meets performance benchmarks (usability goals). When
these goals are met, the iterative process ends.

The iterative design process helps to substantially improve the usability of Web sites. One
recent study found that the improvements made between the original Web site and the
redesigned Web site resulted in thirty percent more task completions, twenty-five percent
less time to complete the tasks, and sixty-seven percent greater user satisfaction. A
second study reported that eight of ten tasks were performed faster on the Web site that
had been iteratively designed. Finally, a third study found that forty-six percent of the
original set of issues were resolved by making design changes to the interface.

Example

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 82
5.0 UX Guidelines

50.Evaluate Websites Before and After Making


Changes

Guideline
Conduct ’before and after’ studies when revising a Web site to determine changes in
usability.

Comments
Conducting usability studies prior to and after a redesign will help designers determine if
changes actually made a difference in the usability of the site. One study reported that only
twenty-two percent of users were able to buy items on an original Web site. After a major
redesign effort, eighty-eight percent of users successfully purchased products on that site.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 83
Chapter

User Experience
Research Guidelines

Page 84
6.0
About this document

Page 85
About This Document

6.1 Objectives & Scope

The Core Objective


The objective of this document is to provide guideline to federal government to conduct
usability testing, along with guiding steps and documents that will help plan and conduct
session. This document covers the below structure:

• Defining usability test: This section defines usability testing and the different methods
you can use.
• Planning a test: The different elements of planning a test and defining a test metrics.
• Roles: The different roles and responsibility of each.
• Elements of a test plan: Detailed explanation of the different test sections.
• Appendix: Sample documents.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 86
7.0
Defining Usability Test

Page 87
Defining Usability Test

7.1 Introduction

What is usability testing?


Usability testing is the focal point of user centric design philosophy which aims to gain
direct feedback from the user and collect actionable data. Usability testing is usually
conducted with one user at a time to get feedback on the proposed flows to ensure the
flows are intuitive.

Why usability testing?


• Gets feedback directly from the users and remove biases from the designers or
stakeholders.
• It provides data for design decision and is not opinion based.
• Helps save development time by avoiding extensive re-work late in the development
stage.
• Creates positive return on investment (ROI).

What can we test?


Usability testing can evaluate any dimension of a UI design. Depending on the phase of the
interface design development, UT can evaluate:

Navigation Presentation Content Interaction

Site/app organization Layout Page layout Visual affordance


Menu organization Fonts Task funcitonality Widgets
Labelling Use of color Task flow
Feedback

Refer to the usability testing guidelines for details on the process.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 88
Defining Usability Test

7.2 Testing Stages

Different stages of testing


There is always a question around ‘when is the right time to test?’, especially with the
different stages of design thinking and developing an interface for the user. A typical
project will have the below stages:
• Understanding the goal of the project - To identify the business needs, the different
user profiles you are targeting their needs
• Research phase - Speaking to the user, understanding the trends and benchmarks in
the region and internationally.
• Strategy - Putting a strategy together with KPI and building it based on the research
insights.
• Design - Drafting concepts/wireframes/designs which aligns to the strategy
• Implementation - Developing the designs to interactive interface for the user.

So where does testing fit? Most developer or traditional testing always revolves after the
implementation phase, before launch. But ideally, you will have to test it preferably after
every stage. Each testing along the different stages could vary from usability testing, card
sorting, tree testing etc… The method depends on the objective of the testing which will be
identified at each stage.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 89
Defining Usability Test

7.2 Testing Stages

Different stages of testing


Launch

Testing

Implementation
Concept wireframes/designs based
on the strategy.

Testing

Design
Testing
Develop the idea to interface

Strategy
Proposing a unique strategy,
aligning to the research.

Research
Research the landscape to see
what competitors are doing and
understanding the user needs.

Testing Testing

Objective
Getting together to discuss
company’s goals and user’s needs.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 90
Defining Usability Test

7.3 Testing Methods

Different testing methods


A usability test can be a formative evaluation, which is conducted early in the design
process to find problems improve the product, or summative evaluation, conducted to
validate the design against specific goals

Ideation of a product/ Launch of the product/


interface interface

Beginning What you think is the end

Formative testing Summative testing (but it’s not)

The kind of outcome you are looking for would define the kind of test you would need to
conduct. For example, below are few testing methods against the outcome/objective of the
test.

Objective Test Method

Initial mental model/1st impression Expectency Test

Organization of content Card-sorting

Navigation design Performance Test

Affordance Visual-affordance test

Brand message Brand definition test

Actual usage Free exploration Test / Eye-Tracking

Layout, task flow, controls and content Performance Test

Data from: HFI


User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 91
Defining Usability Test

7.3 Testing Methods

Expectancy Test
The structure of the test would be around taking participants through different scenarios
and asking them what would they expect. It is a method to evaluate how the project
matches with the expectation of users. This is usually performed as an early usability test
to evaluate the initial mental model of the user and their expectations about what the
application site would do.

Card Sorting
Card sorting is a technique used to comprehend how users categorize various groups.
Essentially, users are asked to sort a set of cards with individual item names into related
piles and label them accordingly. Additionally, there are three types of card sorting
activities : closed, open and Hybrid. Closed card sorting require users to put labels in pre-
set categories. Open card sorting requires users to put labels in categories of their choice.
The hybrid card sorting is a mix of both open and closed, where users have to put labels in
categories that are pre-set but could also create categories of their own.

Performance test
User s are asked to complete journeys by using a prototype and think aloud. The test
focusses on the organization of content, layout alignments, controls and execution. Its aim
is to eliminate the any lockable of the conversion flow. It could rage from loading time,
response time, scalability issue, network utilizations etc… Additionally, this walkthrough
exercise gives the researcher a clearer idea of the user’s thought process.

Visual affordance
Visual affordance tests are used to investigate user’s expectations on possible interactions
with an interface by simply looking at it. Users are asked to give feedback during the test
based on the elements of designs and are not asked to complete any specific tasks.

Data from: HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 92
Defining Usability Test

7.3 Testing Methods

Brand Definition Test


Participants are required to test out the individuality and market value of a certain brand
(based on the concept of a product name). Doing so, companies can convert
distinctiveness and comprehend how their audiences define the brand’s ethics, products
and overall mindset.

Free Exploration Test / Eye Tracking


Participants are asked to explain how they would use the site without necessarily going
through different steps or journeys. Free Exploration tests enable researchers to gather
more realistic data on how the website or product is usually explored. One way of testing
this is by using an eye tracking device which saved the main touchpoint for each
participant, measure the time spent on different areas of the product. Afterwards, a heat
map can be collected showing such data.

Data from: HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 93
8.0
Planning a test

Page 94
Planning a test

8.1 Introduction

Introduction
One of the first steps in each round of usability testing is to develop a plan for the test. The
purpose of the plan is to document what you are going to do, how you are going to conduct
the test, what metrics you are going to capture, number of participants you are going to
test, and what scenarios you will use.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 95
Planning a test

8.2 Test Plan

Test Plan
You will need to include these elements in the usability test plan.

Scope
Indicate what you are testing: Give the name of the Web site, Web application, or other
product. Specify how much of the product the test will cover (e.g. the prototype as of a
specific date; the navigation; navigation and content).

Purpose
Identify the concerns, questions, and goals for this test. These can be quite broad; for
example, "Can users navigate to important information from the prototype's home page?"
They can be quite specific; for example, "Will users easily find the search box in its present
location?" In each round of testing, you will probably have several general and several
specific concerns to focus on. Your concerns should drive the scenarios you choose for the
usability test and this will help you with your protocol/scenario document.

Schedule & Location


Indicate when and where you will do the test. If you have the schedule set, you may want
to be specific about how many sessions you will hold in a day and exactly what times the
sessions will be.

Sessions
You will want to describe the sessions, the length of the sessions (typically one hour to 90
minutes). When scheduling participants, remember to leave time, usually 15-30 minutes,
between session to reset the environment, to briefly review the session with observer(s)
and to allow a cushion for sessions that might end a little late or participants who might
arrive a little late

Equipment
Indicate the type of equipment you will be using in the test; desktop, laptop, mobile/
Smartphone. If pertinent, include information about the monitor size and resolution,
operating system, browser etc. Also indicate if you are planning on recording or audio…

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 96
Planning a test

8.2 Test Plan

taping the test sessions or using any special usability testing and/or accessibility tools, eye
tracking device, etc.

Participants
Indicate the number and types of participants to be tested you will be recruiting. Describe
how these participants were or will be recruited and consider including the screener to help
getting the right profile. (Example of screener document: Section 6)

Scenarios
A scenario is a task that users have to perform like for example register or buy a product.
Indicate the number and types of tasks included in testing. Typically, for a 60 min. test, you
should end up with approximately 10 (+/-2) scenarios for desktop or laptop testing and 8
(+/- 2) scenarios for a mobile/smartphone test. Choosing the You may want to include
more in the test plan so the team can choose the appropriate tasks. (Example of protocol
document: Section 6).

Metrics
There are two types: Subjective and Qualitative

Subjective metrics
Include the questions you are going to ask the participants prior to the sessions (e.g.,
background questionnaire).After each task scenario is completed as about the ease and
satisfaction on the specific task and when the sessions is completed ask about overall
ease, satisfaction and likelihood to use/recommend questions. Ie: On a scale from 0 to 10,
how would you rate the design?

Quantitative metrics
Indicate the quantitative data you will be measuring in your test (e.g., successful
completion rates, error rates, time on task).

Data from UXpin

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 97
Planning a test

8.3 Identifying Test Metrics

Identifying Test Metrics


There are several metrics that you may want to collect during the course of testing.

Successful Task Completion


Each scenario requires the participant to obtain specific data that would be used in a
typical task. The scenario is successfully completed when the participant indicates they
have found the answer or completed the task goal. In some cases, you may want give
participants multiple-choice questions. Remember to include the questions and answers in
the test plan and provide them to note-takers and observers.

Critical Errors
Critical errors are deviations at completion from the targets of the scenario. For example,
reporting the wrong data value due to the participant’s workflow. Essentially the participant
will not be able to finish the task. Participant may or may not be aware that the task goal is
incorrect or incomplete. Critical errors prevent the users from completing a task.

Non-Critical Errors
Non-critical errors are errors that are recovered by the participant and do not result in the
participant’s ability to successfully complete the task. These errors result in the task being
completed less efficiently. For example, exploratory behaviors such as opening the wrong
navigation menu item or using a control incorrectly are non-critical errors. Non-critical
errors do no prevent the users from completing the tasks but delays the time of
completion/

Error-Free Rate
Error-free rate is the percentage of test participants who complete the task without any
errors (critical or non-critical errors).

Time On Task
The amount of time it takes the participant to complete the task.The moderator should
keep track of the time the users spends in completing a task to be able to compare the
time it has taken all users.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 98
Planning a test

8.3 Identifying Test Metrics

Subjective Measures
These evaluations are self-reported participant ratings for satisfaction, ease of use, ease of
finding information, etc where participants rate the measure on a 5 to 7-point Likert scale.
In the example, it is a 6 point Likert scale.

www.fieldboom.com/blog/likert-scale/

Strongly Slightly Slightly Strongly


Disagree Agree
Disagree Disagree Agree Agree

1 2 3 4 5 6

50 % Negative 50 % Positive

Likes, Dislikes and Recommendations


Participants provide what they liked most about the site, what they liked least about the
site, and recommendations for improving the site

Data from UXpin

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 99
9.0
Roles you play

Page 100
Roles you play

9.1 Different Roles

Roles
Part of planning is getting your team right and defining each person’s responsibilities. An
ideal team would be a group of 3 people - The moderator/facilitator, the note-taker and the
observer (optional).

Moderator/Facilitator
They are the ones leading the sessions with the participants. They are also the one leading
the project from the planning of the test to analysis and reporting.

Note-taker
They are the one’s recording every notes in the session and observations from the
participants. They are not directly interacting with the participants but will supporting the
moderator incase if they missed any questions to ask. They help out on the reporting.

Observer
They are the one who typically observes the sessions and helps if there’s support required.
For example, if there is any issues on the prototype or equipment, they’ll be on standby to
help out so the moderator and note-taker can concentrate on their task.

Depending on the type of communication you have setup you can have the seating
arrangement. For example, if the moderator and note-taker can easily communicate, then
the option 2 could work.

Option 1 Option 2
Lab Room

Lab Room

Participant Moderator Note-taker Participant Moderator


Observer

Observer
room

room

Observer Observer Note-taker

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 101
Roles you play

9.2 Moderator/Facilitator

The moderator plays a pivotal role that involves building a partnership with the participant.
Most research findings are derived by observing the participant’s actions and gathering
verbal feedback. To be an effective moderator, you need to be able to make quick decisions
while simultaneously overseeing various aspects of the research session.

Make the participant feel comfortable


An ideal UT session should replicate the exact environment in which the real user interacts
with the product. However, this is rarely the case.

Participants often:
• Feel nervous
• Are conscious of how they are perceived
• Are aware that they are being tested and observed

As a moderator, you should be friendly, sincere, open-minded and flexible. Always be


sensitive to how your participant is reacting.When you greet the participants, start the
conversation by introducing yourself, or by asking him about how easy it was to find the
location. Explaining that the session is something they will enjoy could also be a great way
to start a small chat, making them feel more comfortable.

Remember, a relaxed participant will give you more accurate results and the UT session will
be more pleasant.

Data from: Government Digital Services - Singapore

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 102
Roles you play

9.2 Moderator/Facilitator

Profiling of participants
Be aware of the kind of participants you are dealing with and adjust your moderation
technique based on the user type. For some you would need to probe, for some you would
need to get them focused on the task because they like to talk. Below are the usual user
persona you will find in your session:

• The mouse: Very quiet and reluctant to share


• The talker: Very verbal and tends to go off topic
• The naysayer: Extremely negative and tears everything apart
• The know-it-all: Acts like the subject matter expert on everything
• The designer: Highly critical of colors, images and anything visual
• The yes man: Everything is great no matter how much he struggles to complete the
tasks

As a moderator, you have to be aware that personas are just loose stereotypes and only
serve as an initial point of reference. There is no one-size-fits-all classification for
participants. You should constantly review and adjust the persona of the participant based
on your own judgement, and alter the way you communicate with him/her accordingly.

Listen
The purpose of a UT session is to gather feedback from the participant. A good moderator
should find the correct balance between listening and taking the lead.

Minimize interruptions by speaking only when the participant pauses so that you do not
break the participant’s train of thought and miss out on valuable insights. Always give the
participant the chance to internalize and think about your questions.

Data from: Government Digital Services - Singapore

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 103
Roles you play

9.2 Moderator/Facilitator

Watch yourself
Know your moderation style

As a moderator, you should be aware of your own style of moderation, it’s limitations and
how to compensate for them. Your personality affects how you moderate a research
session. Ask yourself if you have a tendency to be:

• Robotic vs Animated (asking question after another vs having a conversation with the
user (Personality)
• Transactional vs relational (asking questions without nuances, without context and
just following the script vs asking questions based on the user’s answer and not
following the script) (Moderation method)

Try to avoid the extreme ends of each spectrum. If you are robotic, consciously make an
effort to be more lively and engaging. If you are transactional, add a human touch. Simple
gestures like words of affirmation can help the participant feel more comfortable.

Be aware of researcher bias

Researcher bias is a common pitfall of UT moderation. It happens so subtly that even


experienced moderators are susceptible to it. You can identify and control bias by first
being familiar with the different types of biases. This would allow you to be more mindful of
the way you structure and deliver questions.

Common researcher biases:

• Question-order bias
• The order of the questions posed by the moderator can give the user an indication as to
what is being tested. In this case, participants might feel compelled to answer in a
certain way. In order to not fall into this trap, it is ideal to keep asking different questions
to each user to eliminate any possible bias.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 104
Roles you play

9.2 Moderator/Facilitator

• Confirmation bias
• When users subconsciously search for, notice or interpret information in a manner that
is associated with a previously made belief or opinion.

• Leading question and wording bias


• The tendency of participants to structure their answers in a way that would be socially
acceptable, in hopes to not divulge from common opinions or practice.

• Halo effect
• The impression given to alter or influence one’s opinion and sometimes even nudging
participants to focus on another area of interest.

Data from: Government Digital Services - Singapore / HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 105
Roles you play

9.2 Moderator/Facilitator

Watch the participant


Be aware of respondent bias

Respondents are also prone to bias. Once again, recognize the types of bias and take steps
to reduce incidences that might affect the quality of your research.

Common respondent biases:

• Acquiescence bias: users agree to all the question or indicate a positive feedback.
• Social desirability bias: users respond to a question in a way that will be viewed
favorably by others.
• Demand characteristics: user’s response are based on what they have guessed is
expected from them.

Read and respond to non-verbal cues

Non-verbal behaviours like body language and tone of voice are great indicators of a
participant’s mood and comfort level. Such behaviours often accompany spoken words and
can augment or contradict what is spoken.

Learn to identify such cues and adjust the way you interact with the participant to ensure
that you are in the best position to interpret his/her responses. E.g. A fidgety participant
might be anxious. Start with easier tasks and adopt a more reassuring demeanour. If this
doesn’t work, the participant might actually be impatient or bored. Look for other cues,
reassess your interpretation and react accordingly.

Picking up subtle non-verbal behaviours often requires you to make inferences that take
into account situational and sociocultural factors. It takes some experience to be able to
notice and read these gestures accurately so don’t be too hard on yourself if you are just
starting out.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 106
Roles you play

9.2 Moderator/Facilitator

Watch the time


Time management is a key but often overlooked aspect of a UT session. It is impossible to
anticipate how much time individual participants require to complete each task. Watch the
time, prioritize and modify the questions and tasks based on the situation.

Data from: Government Digital Services - Singapore / Psychology Concepts / interacttion-


design

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 107
Roles you play

9.3 Note-taker

During the testing sessions, a note-taker needs to be available to capture all the user’s
insights. The note-taking sheet should be prepared in advance to facilitate the process.
This sheet would consist of the questions and participants’ answers that the note-taker will
fill as they go on.Take note on anything you see important and valuable during the session.

Examples of Effective Notes


Below are few example of note-taking style.

Mistakes
He skipped the City field on the address form.
She didn’t click Save before closing the window.

System errors and error messages


The menu didn’t drop down the first time she clicked it.
Error message: “Database error on line 55.”

Click-paths (navigation sequences) can be especially helpful


Home > New Car > Vehicle Type > Back > Model > Back (looking for “vans”)
Searched “ford truck” > Ford.com > Trucks & Vans > F-150 > Models

Strategies and tools


He said he always chooses two items because shipping costs less.
She chose About Us and said she was looking for “contact us.”
He used a calculator and Google Maps, then entered the data into the desktop app.

Data from Nielson

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 108
Roles you play

9.3 Note-taker

Examples of Effective Notes

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 109
Roles you play

9.3 Note-taker

Search terms and results


Search 1: lexis (nothing useful)
Search 2: lexus (correctly chose 3rd result)

Quotes
“This is great!”
“I expected this to work like Amazon.”
Anything that seems overlooked, misunderstood, ambiguous, or confusing

Suggestions, questions, and comments (including your own).


If there are multiple people taking notes, make sure to have a standardized approach within
the team. For example abbreviation, naming conventions, etc, which will reduce the time
taken post the session and will avoid any manual work.

Data from Nielson

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 110
Roles you play

9.4 Observer (Optional)

The role of the observer is to ensure all important questions are properly being posed in an
efficient manner. Sometimes the moderator and note-taker tend to be so confused by their
own work that they could miss important factors. Having an observer is an optional step,
however sometimes this role is played by the client who attends a few user testing sessions
by siting in an observation room.

Watch the participant

Read the moderator-participant cues


Being a third party in this situation helps eliminate any prejudice and can be helpful when
detecting issues with the protocol or questions asked themselves. The observer can then
make sure that all overarching themes are being answered.

Be on standby
Ideally, the observer would also be able to address any technical issues that may arise
during the user session itself.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 111
10.0
Elements of a test plan

Page 112
Elements of a test plan

10.1 Plan Checklist

Checklist
Below are all the document/plan you would need before your sessions.

List Documents / Assets

Defining the purpose of the test

Choosing the team for the testing Moderator, Note-taker and observer
sessions. (Optional)

Choosing the participant profiles /


Recruitment

Preparing a screener document Screener Document

Organize incentives for the participants Incentives

Preparing task and scenario document Protocol Document

Setting up the equipment

Preparing the note-taking sheet for


Note-taking sheet
recording

Print out participant list and schedule Participant list

Run a pilot Protocol & note taking sheet

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 113
Elements of a test plan

10.2 Recruitment

Recruitment
There has always been a debate on the ideal number of participants to be considered for
the sessions. Remember the law of diminishing returns - There are finite number of issues
in the UI. As we test with more and more participant, each participant will stumble on the
same issues and will stumble on fewer and fewer new issues.

According to the Nielson study, 1993, five users will cover 80% of the usability problems.
With this region we have seen that around 7-8 users per target group gives you enough
credible data to make your design decisions. If you know from previous data (google
analytics, survey, etc), that there is a difference in patterns within your target groups, make
sure you have 7-8 from each of the group. For example, english user vs Arabic users, or
male vs female, etc. If you have the liberty of implementing a sprint methodology of testing,
have multiple rounds of smaller tests with 5 people.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 114
Elements of a test plan

10.2 Recruitment

Recruitment
There has always been a debate on the ideal number of participants to be considered for
the sessions. Remember the law of diminishing returns - There are finite number of issues
in the UI. As we test with more and more participant, each participant will stumble on the
same issues and will stumble on fewer and fewer new issues.

According to the Nielson study, 1993, five users will cover 80% of the usability problems.
With this region we have seen that around 7-8 users per target group gives you enough
credible data to make your design decisions. If you know from previous data (google
analytics, survey, etc), that there is a difference in patterns within your target groups, make
sure you have 7-8 from each of the group. For example, english user vs Arabic users, or
male vs female, etc. If you have the liberty of implementing a sprint methodology of testing,
have multiple rounds of smaller tests with 5 people.

Test with Test with Test with


5 users Redesign 5 users Redesign 5 users
Find 80-85% to fix the Find 80-85% to fix the Find 80-85%
issues issue issues issue issues

This method gives better benefit than having one test with 15 users.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 115
Elements of a test plan

10.2 Recruitment

Selection of participants is based on the user profiles or persona you have developed
during data gathering and/or market research. When recruiting make sure you have a good
cross-section of your user group. Select participants based on:

• Their user groups


• Applicability to site or application being tested.
• Current user
• Potential user
• Level of expertise in domain.
• Level of expertise with computers/device.
• Other factors that may be important:
• Internet usage
• Language
• Educational level
• Market segment
• Geography
• Cultural issues

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 116
Elements of a test plan

10.3 Screener

Screener
With the different profiles and persona you need to get, given the sample size, the
document that will help you find the right profile is the screener document. This document
lists down questions the recruiter asks the potential participants to ensure if they fit the
criteria. The screener will guide the recruiter and typically cover the below structure
(Example of the screener document provided in the appendix section):
• Introduction
• Screener questions
• Make sure the users were not part of any similar research in the last 6 months.
• Do not get user who work from the same domain, you may get biased view.
• Do not get user who work in a website, design agency/company, they might give
you their expert opinion.
• Confirmation of qualified participants.

Data from HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 117
Elements of a test plan

10.4 Incentives & Schedules

Incentives
It’s going to be hard to get users to test for free, and hence always incentivize your user for
their input and time. Below is the incentive structure used for this region for a general mid-
level income users, it differs from the profiles you are recruiting:

• Locals - AED 300 - AED 350


• Expats: AED 200 - AED 250

You can either give them cash or gift vouchers (mall vouchers), although in this region
giving cash works the best.

The incentives also is dependent on the levels of the user, for example a hi-end, premium
user (high income level), it would range from AED 400 - AED 500.

Data from HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 118
Elements of a test plan

10.4 Incentives & Schedules

Scheduling the sessions


When you are scheduling time slots, make sure there is 15-30 mins gap between the users.
This helps incase if there is any delay from the user’s side, any technical issues that needs
to be fixed, etc. Make sure you have back-ups incase of no shows.

Below is a typical day’s schedule:

Time Tuesday, 2nd January

8:00 - 9:00 am Pilot testing

9:00 - 10:00 am Break for fine-tinning

10:00 - 11:00 am Participant 1

11:15 - 12:15 pm Participant 2

12:15 - 1:00 pm Lunch Break

1:00 - 2:00 pm Participant 3

2:15 - 3:15 pm Participant 4

3:30 - 4:30 pm Participant 5

4:45 - 5:45 pm Participant 6

Data from HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 119
Elements of a test plan

10.5 Protocol

Protocol
Based on the UT purpose and scope, you would need to start drafting them as questions to
see if the user’s can perform the tasks. The questions could be scenario based or task
based.

• Scenario based - Gives the user rationale and tells a story so the user understand the
context and is easier to understand the task purpose.
• Task based - These are quick to the point tasks and is useful when the user doesn't
need background information.

Usually it’s good to have a mix of both, giving the user a scenario, to make them
understand the context and also directing them to a task so it’s easier to understand the
action they would perform.

Also you would need to know what type of moderation technique you are going to use,
because your protocol questions might change based on that. Below are few common
techniques:

Concurrent Think Aloud (CTA)


is used to understand participants’ thoughts as they interact with a product by having them
think aloud while they work. The goal is to encourage participants to keep a running stream
of consciousness as they work.

In Retrospective Think Aloud (RTA)


the moderator asks participants to retrace their steps when the session is complete. In
some cases participants watch a video replay of their actions, which may or may not
contain eye-gaze patterns.

Concurrent Probing (CP)


requires that as participants work on tasks—when they say something interesting or do
something unique, the researcher asks follow-up questions.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 120
Elements of a test plan

10.5 Protocol

Concurrent Probing (CP)


requires that as participants work on tasks—when they say something interesting or do
something unique, the researcher asks follow-up questions.

Retrospective Probing (RP)


requires waiting until the session is complete and then asking questions about the
participant’s thoughts and actions. Researchers often use RP in conjunction with other
methods—as the participant makes comments or actions, the researcher takes notes and
follows up with additional questions at the end of the session.

Interview Protocol Interview Protocol


Interview Protocol
Purpose 3 - Cognitive Walkthrough (30-40 mins)
1 - Briefing (2 mins)
(Objective: to understand how users expect to find information)

The purpose of this study is to gain insights on the prototypes shared. I am going to show you ​four ​variations of a homepage. These variations are only in prototype format
Hi [Name], meaning there haven’t been finalised and are still work in progress therefore, not all items will be
The session is around 45 minutes and is divided into: functional. We would like to get your feedback on each so we can validate which designs are working and
My name is ___________, and I work for RBBi
which(Red
needBlue
to beBlur Ideas).
improved.
1. Briefing (2 Min)
2. Ice Breaker (7 mins) First Impressions
We are conducting a small study to understand user preferences in this region. The objective of
3. Cognitive Walkthrough (30-40 mins) ● What are you ​first impressions​ of this website?
4. Survey (5 mins) the study is to understand your online behaviour. Your responses and comments will help us
● What do you think this site is for?
5. Debrief (1 Min) serve you better. ● Where do you think ​you are​ on this website?
● What ​kind of information​ do you think you can find on this site?
I have scheduled this session to run for approximately
● Do you40-50
think ​aminutes.
nything’s missing​, based on what you might have expected to find on a gov site?
● Where would you go first?
● will
First I’ll be asking you a few questions, then we dodoa you
What walkthink this ​mof
through ap​ a
is few
for? homepage
variations to get your input. Lastly, we will do●a card
Do you think it’s
sorting necessary to have ​emergency contacts​ and ​need help​?
exercise.
● Would you be interested in ​personalisation​ on a government site? Changing colours etc.
I want to emphasise that you are not being tested – you are helping us to improve users
Now I would like to ask you to perform a few tasks so I can see how easily you find information.
experiences and the layout of our designs.
Version 3 and 4 will have a “Home” button in the navigation… when you are on this one please ask:
The most important thing is to ​think aloud​ while you perform
● What each
do you think step,
about thisand I’ll keepIsreminding
homepage? any information more important to you?
you about that. ● Maybe show them the services page at some point and ask them which is more important?
● Try to test the fact that the services displayed are from the listing page but when the user clicks to
All the information that you provide will be kept view more, they go to the services landing page, otherwise if they select apply for a visa they should
confidential.
go to the detail page
I want to let you know that I’m in no way associated with these concepts. I am here only to learn
Service Landing Page
about how people use the platform. Please feel● free to speak
Version openly
1​ has an and honestly
announcement at the while you
top, can wetell
ask what do you think this strip is for?
us about your experience. If you need to take●a break
Say foror
example, you are comingabout
feel uncomfortable to the government
the study atwebsite to find information on visas. Where
would you go to find this information?
any point, please do let me know.
● What do you think of the hover effect (Apply for Visa)
● Version 2​ test view all, then hover, then filter.. Ask what do you think the filter is for?
We will be taking notes, but to make sure we●getDo allyou
theunderstand
insights, we will also be audio/video
each of these labels? Is it clear to you what information you could find within
recording the session. If you are fine with that, please fill in the agreement form providing us
each one?
with your confirmation of the same.
Service Listing Page
Provide the Participant Agreement form. ● You would like to read more about applying for a visa, where would you go?
● Once they have seen the images versus no images option for this page… ask which they prefer
Do you have any questions or concerns before we get started?
Service Listing Page
● Where can you apply for a visa? Is this clear for you?
● Would you use the instant feedback on this page… smiley faces…?
● How would you go back to the previous page?

Red Blue Blur Ideas JLT (RBBi) – Trade License No. JLT-66418
Red Blue Blur Ideas JLT (RBBi) – Trade License No. JLT-66418
1406 JBC3, Cluster Y, Jumeirah Lake Towers (JLT)
1406 JBC3, Cluster Y, Jumeirah Lake Towers (JLT)
T: +971 4 448 6406 | F: +971 4 448 6405
T: +971 4 448 6406 | F: +971 4 448 6405

Red Blue Blur Ideas JLT (RBBi) – Trade License No. JLT-66418
1406 JBC3, Cluster Y, Jumeirah Lake Towers (JLT)
T: +971 4 448 6406 | F: +971 4 448 6405

Data from UXpin

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 121
Elements of a test plan

10.5 Protocol

Protocol

Technique Pro Con

Concurrent Think Aloud Understand participants’ Can interfere with


(CTA) thoughts as they occur usability metrics, such as
and as they attempt to accuracy and time on
work through issues they task
encounter

Elicit real-time feedback


and emotional responses

Retrospective Think Aloud Does not interfere with Overall session length
(RTA) usability metrics increases

Difficulty in remembering
thoughts from up to an
hour before = poor data

Concurrent Probing (CP) Understand participants’ Interferes with natural


thoughts as they attempt thought process and
to work through a task progression that
participants would make
on their own, if
uninterrupted

Retrospective Probing Does not interfere with Difficulty in remembering


(RP) usability metrics = poor data

Data from UXpin

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 122
Elements of a test plan

10.5 Protocol

Protocol
When drafting a protocol document below is the typical structure that works:

Purpose
This contains the introduction to the test and breaks down the top-line structure of the
interview.

Briefing (Typically 2 minutes)


This contains dialogue cues for the moderator to introduce the participant to the project
and tell them about the structure and get them to fill in the agreement form. (Provided in
the appendix).

Ice-breaker questions (5 minutes)


This section is important to build a relationship with the participants. Participants usually
feel nervous at first and an ice-breaker usually helps calming them down since the tone of
this session is usually conversational. For the moderator, the kind of questions you can ask
here gives you data of the user’s current pattern and usage. For example, “tell me about
your experience opening a bank account”, this gets the user to instantly talk about their
experience, making them feel comfortable and trust the moderator with the moderator
getting insights on their personal experience and frustration points.

First impression test (2 minutes)


This is optional depending on the phase of the project. If you are testing designs, this test
can give you details on the design elements that caught users attention in the brief amount
of time (8-10 seconds) when the screen was shown to them. Post this, you can have follow
up questions such as - What was the top 3 things your remember, where did you want to
click fist?, etc.

Task based scenario (35 Minutes)


This section will have the scenario and the tasks you want the user to go through on the
interface.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 123
Elements of a test plan

10.5 Protocol

Questionnaire (2 Minutes)
This contains a questionnaire that tie back to the task the user just performed. This could
be either ratings, for example from a scale of 1-5, how much would you rate the design,
navigation, etc, or the questions could revolve around recall, for example, do you remember
seeing a search, or login, etc.

Debrief (1 Minute)
End the session by thanking them for their time and insights given - Hand them their
incentive for the session.

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 124
Elements of a test plan

10.6 Notes & Equipment

Note-taking sheet
Create a note-taking sheet so you have all the insights documented in one place and this
also helps maintain consistency and structure so the person who is creating the report can
easily go through the document and get the required insights. Sample of note taking sheet
is provided in the appendix.

Equipement
There will always be technical difficulties that you may face if you don't do a thorough
check and make sure you have all that you require to run your test session smoothly. Below
are the typical equipments/recording software you would require:

• Recording device
• Video/audio, typically comes within the software you would user (Tobii or morae)

• Tobii Eye-tracking
• Make sure you have the test setup and do a test run. Also make sure you have enough
space in your machine to record these session otherwise it may hamper the
performance.

• Devices - Desktop (Laptop), mobile, tablet, etc - Testing devices

• Strong Wifi connection

Data from HFI

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 125
Elements of a test plan

10.7 Pilot Test

Run a Pilot
This is something that is always forgotten. Doing a pilot run helps you identify any tweaks
that needs to be done, or anything you missed that needs to be incorporated. Ideally have a
pilot test run a day before the sessions, so you have enough time to do any changes on the
prototype, protocol or even the equipment session. And do one before you start your
sessions.

When you do the pilot test, do everything from the beginning, including the introduction,
etc. This would help you with two things:

Timing each section, which will help cut down or add if required.
Make sure you have all the documents ready, for example agreement form, incentives, etc.

Below is the checklist again:

List Documents / Assets

Defining the purpose of the test

Choosing the team for the testing sessions. Moderator, Note-taker and observer

Choosing the participant profiles / Recruitment

Preparing a screener document Screener Document

Organize incentives for the participants Incentives

Preparing task and scenario document Protocol Document

Setting up the equipment

Preparing the note-taking sheet for recording Note-taking sheet

Print out participant list and schedule Participant list + Agreement form

Run a pilot Protocol & note taking sheet

Data from HFI


User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 126
11.0
Appendix

Page 127
Appendix

11.1 Documents

Screener Protocol Note-taking


Document Document Sheet

(Download) (Download) (Download)

Agreement Agreement
Form (English) Form (Arabic)

(Download) (Download)

User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 128

You might also like