Professional Documents
Culture Documents
Website Documents الدليل الارشادي لتجربة المستخدم
Website Documents الدليل الارشادي لتجربة المستخدم
USER
EXPERIENCE
GUIDELINES
REPORT BY
UX Lab
Telecommunication Regulatory Authority TRA
01 April 2020
Table of Contents
Chapter 1
User Experience Design Guidelines 7
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 2
Contents
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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 4
Contents
Chapter 2
User Experience Research Guidelines 84
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 5
Contents
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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 9
About This Document
1.2 Audience
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
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
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 13
The User Centric Philosophy
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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 15
The User Centric Philosophy
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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 17
The User Centric Philosophy
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
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.
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.
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 21
Design Heuristics
3.1 10 Principles
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.
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 24
Accessibility
4.1 Principles
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 25
Accessibility
1. Audio
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
Size
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
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. 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
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
7. Mobility
Interaction areas, especially for mobile, should be at least 48x48 dp
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
• 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
In order to ensure that your website is accessible, you need to ensure that all points below
are compliant.
Non
No Criterion Compliant
Compliant
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 32
5.0
UX Guidelines
Page 33
5.0 UX Guidelines
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
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
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
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:
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 37
5.0 UX Guidelines
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
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
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
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
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 42
5.0 UX Guidelines
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
• 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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 88
Defining Usability Test
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
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
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.
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 92
Defining Usability Test
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
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.
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
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).
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 97
Planning a test
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
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/
1 2 3 4 5 6
50 % Negative 50 % Positive
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 99
9.0
Roles you play
Page 100
Roles you play
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
Observer
room
room
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.
Participants often:
• Feel nervous
• Are conscious of how they are perceived
• Are aware that they are being tested and observed
Remember, a relaxed participant will give you more accurate results and the UT session will
be more pleasant.
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:
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.
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.
• 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.
• Halo effect
• The impression given to alter or influence one’s opinion and sometimes even nudging
participants to focus on another area of interest.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 105
Roles you play
9.2 Moderator/Facilitator
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.
• 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.
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
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.
Mistakes
He skipped the City field on the address form.
She didn’t click Save before closing the window.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 108
Roles you play
9.3 Note-taker
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 109
Roles you play
9.3 Note-taker
Quotes
“This is great!”
“I expected this to work like Amazon.”
Anything that seems overlooked, misunderstood, ambiguous, or confusing
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 110
Roles you play
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.
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
Checklist
Below are all the document/plan you would need before your sessions.
Choosing the team for the testing Moderator, Note-taker and observer
sessions. (Optional)
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.
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:
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 117
Elements of a test plan
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:
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.
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 118
Elements of a test plan
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:
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 120
Elements of a test plan
10.5 Protocol
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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 121
Elements of a test plan
10.5 Protocol
Protocol
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
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.
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
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
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 125
Elements of a test plan
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.
Choosing the team for the testing sessions. Moderator, Note-taker and observer
Print out participant list and schedule Participant list + Agreement form
Page 127
Appendix
11.1 Documents
Agreement Agreement
Form (English) Form (Arabic)
(Download) (Download)
User Experience Guidelines - Design & Research © TRA UXLab – 2020 Page 128