User Experience 3: User Experience, Usability and Accessibility

Unit 3: HCI Concepts:
UX, Usability and Accessibility
Second term, January 2019 Dr. Marc Miquel Ribé
Course in User Experience
Bachelor Degree in Video Game Design and Production
Computer Engineering for Information System Management

Goal of the Session
Explain the common traits that are shared by usable systems.

Overview of the Session
3.1 What is Usability
3.2 Design for Usability
3.3 What is Accessibility
Goal of the Session: explain the common traits that are shared by usable systems.
UX is more than usability
Let’s start with this question: why do they coin the term usability?

3.1 What is Usability
Usability is a quality attribute that assesses how easy user interfaces are to use (Nielsen 1993).
The user interface is the space where the user interacts (controls) with the machine (or game).
3.1.1 Usability is the Ease of Use

For products to be useful, they must have both utility and usability. Let’s listen to Jakob Nielsen.
[https://www.youtube.com/watch?v=VwgZtqTQzg8]

Usability has to do with how easy the interface is.
The interface comprises everything that helps the user control the videogame:
controller, controls, graphical user interface (HUD), menus, sound indications,…
Usability of a product is not an attribute of the
product alone, it is an attribute of interaction with a
product in a context of use. (Karat 1997)
Think of this ATM.
Everything we interact with should be designed so it
is easy to withdraw money or any other operation.
So, usability is part of the product, but we test it
against the user to know it.

User Experience is a consequence of a user’s internal state (predispositions, expectations, needs,
motivation, mood, etc.), the characteristics of the designed system (e.g. complexity, purpose,
usability, functionality, etc.) and the context (or the environment) within which the interaction
occurs (e.g. organisational/social setting, meaningfulness of the activity, voluntariness of use,
etc.) – Hassenzahl & Tractinsky (2006)
[http://www.slideshare.net/domain7/ux-vs-usability]
Usability matters to UX, but it is not its only factorUsability is not User Experience

• It is possible that some products are usable but for other reasons, they have a bad UX.
• It is possible that some products have a good UX but are not really as usable as others.
This graphic has something wrong!
Could anyone tell me why?

[https://www.nngroup.com/articles/aesthetic-usability-effect/]
It seems that when things are beautiful are they seem
easier to use.
Aesthetic is not Usability
The one on the right is very aesthetic and is pleasing to look, but has a terrible Usability.
But there is something called Aesthetic Usability Effect
The aesthetic-usability effect was first studied in the field of human–computer interaction in 1995.
Researchers Masaaki Kurosu and Kaori Kashimura from the Hitachi Design Center tested 26 variations of an
ATM UI, asking the 252 study participants to rate each design on ease of use, as well as aesthetic appeal.

"La majoria de professionals, a més, solen confondre els conceptes d’usabilitat i user
experience. Les definicions es poden dividir en dos grups: el primer concep la usabilitat d'una
manera més tradicional on l'objectiu és avaluar la interfície, controls i altres mètodes d'interacció
amb el joc. El segon grup entén la usabilitat com un constructe més ampli, que inclou les
mecàniques del joc juntament amb la interfície i inclou conceptes com el de 'diversió',
experiències de l'usuari i emocions que estan vinculades al concepte de jugabilitat.”
Llibre blanc dels Vídeojocs (2016)
[http://interaccio.diba.cat/sites/interaccio.diba.cat/files/llibre-blanc-videojocs-cat.pdf]
Of course, most of them did not assist to a UX course to clear up the concepts.
In addition, there exists Playability, which has been referred some times a) as usability in video
games (understanding and control, that is interface); and other times b) as the quality of the
challenges, the storytelling or the emotion when players play video games.
Let’s not use playability, as it does not bring anything new that we cannot say with the other two.
You need to live with confusion. Solution lies in citing the author.
Shhht! Video games professionals do not know about Usability and UX

Software vs. Video games
• Process vs. results
• Function vs. mood
• View of outcome vs. view of the world
• …
In the realm of productivity tools, such as word processors and banking
websites, usability has come to mean the extent to which the software is intuitive and
effective for a person trying to accomplish the tasks at hand.
If games have no “outcome”… why do we need usability in video games?
For three reasons:
1. We need to make usable interfaces so that users are able to confront the game
challenges (the interface design should not provide an extra challenge).
2. Basic mechanics should be usable.
3. Challenges with the mechanics should be all designed purposely by the game designer.
Why is usability important to video games?

3.2 Usability dimensions or pillars
Usability is the ease of use. But how do we know something is easy to use?
Science. We have a concept, we define some of its dimensions in which the concept may be
represented, then we propose some indicators and we measure them.
According to Nielsen (1993) Model, Usability is defined by 5 dimensions:
• Learnability: How easy is it for users to accomplish basic tasks the first time they encounter
the design?
• Efficiency: Once users have learned the design, how quickly can they perform tasks?
• Memorability: When users return to the design after a period of not using it, how easily can
they reestablish proficiency?
• Errors: How many errors do users make, how severe are these errors, and how easily can they
recover from the errors?
• Satisfaction: How pleasant is it to use the design?
QUESTION: Which cognitive psychology concepts can help us design a usable system?

For instance, the ATM…
• Learnability: How clear are the labels or
instructions so first-time users learn them?
• Errors: How do they prevent that you do
not forget the credit card?
• Efficiency: How many clicks or interactions
away are you from withdrawing money?
There can be conflicts. Sometimes something “very efficient” is not that easy to learn.
Think of ‘commands’ and keyboard ‘shortcuts’. The solution lies in giving different options.

According to ISO 9241-11, usability is about:
• Effectiveness - can users complete tasks, achieve goals with the product, i.e. do what they
want to do?
• Efficiency - how much effort do users require to do this? (often measured in time)
• Satisfaction – what do users think about the products ease of use?
….which are affected by:
The users - who is using the product? e.g. are they highly trained and experienced users, or
novices?
Their goals - what are the users trying to do with the product - does it support what they want to
do with it?
The usage situation (or 'context of use') - where and how is the product being used?
This model simplifies Jakob Nielsen’s dimensions of Usability. Both are interesting.
3.2.1 Usability models

According to Eitan Glinert, game usability is very related to UI and it is about:
• Learnability -- How easy is it to learn how to use the system?
• Simplicity – Are the controls as simple as possible?
• Efficiency – How quickly can tasks be accomplished?
• Aesthetic – How enjoyable is the user interface experience?
Glinert’s model tries to adapt the previous ones to video games.
Bottom line:
• If something is easy to learn, it is easy to use.
• If something allows me what I want to do, it is easy to use.
• If something is easy to remember and retake, it is easy to use.
• If something prevents me to make mistakes, it is easy to use.
• If I feel satisfied using this something, it is easy to use.
QUESTION: How do you know when any of these happen?
[http://www.gamasutra.com/view/feature/4110/upping_your_games_usability.php?print=1]

3.2 Design for Usability
How can we design for usability?

When measuring and improving the product’s usability, we do not care how much the user wants
to do ‘something’. We just care about easy to learn, easy to use, satisfying, memorable, with few
errors. For the emotional and motivational side, we are talking about UX.
• By paying attention human limits in perception, attention and memory (Isbister & Schaffer,
2008).
• By applying usability guidelines, which by the way, are mainly based on human psychology
and our understanding of the brain.
LET’S SEE TWO CONCEPTS/TOOLS IN THE FOLLOWING SLIDES:
3.2.1 Creating good affordances
3.2.2 Introducing Design Principles and Heuristics
Isbister , K. , & Schaffer , N. (2008). What is usability and why should I care? Introduction . In K. Ibister & N. Schaff
er (Eds.), Game Usability. Burlington, MA: Elsevier.

Perception.
“Researchers have suggested that there are two major functions in the visual perception system
that fulfills different purposes (Goodale and Milner 1992): a system used to identify objects
(“what”) and a system used for visually guided actions (“how”). One feature of the “how” system
allows us to identify the potential use of objects—in other words, to perceive object affordances
(Gibson 1979).”
We call affordance to any object feature that communicates us how to interact. An affordance
indicates the possibility of an action on an object/environment (or simply useful information). It
is an indicator of something available. The affordance is interface, because it gives information
so we can interact with the system.
The Human-Computer Interaction and User Experience fields use the concept affordances,
because designing them properly ensures good usability.
Hodent (2017)
[https://www.interaction-design.org/literature/book/the-encyclopedia-of-human-computer-interaction-2nd-
ed/affordances]
3.2.1 Creating Good Affordances

Who thinks this must be destroyed to find a treasure behind it?
“Perceiving an object affordance allows people to determine how an object could be used
(Norman 2013)”
An affordance is perceived, it has a signifier (what is perceivable) and a meaning (what is
comprehensible).

Why do we need this ‘affordance’ concept? Because it may be useful to work on the interface’s
usability.
The concept of affordance is useful as it allows us to question design. Improving affordances will
allow users to learn more easily, to be more efficient, etcetera.
Use affordances to limit the cognitive load: what is intuitive does not need to be learned,
therefore requires less attentional resources to process. In design, an affordance gives or
provides something that helps a user do something (cf. Gibson, 1977; Hartson, 2003).
Questioning affordances is very useful in order to gradually improve the usability of a videogame.
Most of the videogame problems are due to bad affordances.
Please, test your affordances as much as you can during the game design process!
Take a chronometer and check the time it takes to users to discover the affordances. Is it what
you wanted? If so, it’s OK, but remember you are doing the game for the player. Do not be too
sadistic.
Many people struggle to find what designers think it is ’the obvious’…
[http://www.gameinformer.com/b/features/archive/2017/11/22/why-you-get-stuck-in-games-and-what-you-
can-do-about-it.aspx]

How can I distinguish between a properly designed affordance and a bad one?
The affordance provides perceptual information.
If the user recognizes it (because it is universal or because of previous experiences), it is
a good affordance.
The only case
for good design
for the user.

False affordances –it seems it is touchable but it isn’t.
Cognitive affordances can go wrong. A false affordance is when
the perceived affordance is not the one intended given the
functionality. False cognitive affordances misinform and
mislead the players, and then it makes it much harder to teach
them the right thing, and it’s frustrating for the players on top
of it.
In this Ipad game it is not clear what is ‘touchable’ and
interactive and what is background.
Hidden affordances –it is touchable but it does not look like!
Sometimes icons are too integrated in the background, and players do not notice it is an affordance.
In this game the hanging ”golden coin” is a bad
hidden affordance, It does not cue it is clickable!
QUESTION: Are all ‘hidden affordances’ hidden by mistake?

Of course not. There is always an exception:
Some puzzle games are built on the ambiguity of what is actionable.
Games that play with hidden affordances.
In other games, finding the big boss ‘weak’ point is also part of the difficulty.

Please, tell me if something is missing in this video.
[https://www.youtube.com/watch?v=QCSXEKHL6fc]

What happens in this picture? Is there any affordance?

A hidden affordance on purpose.

One design principle to design good affordances (physical and cognitive) is ‘Form follows
function’.
Form Follows Function means that the form should
indicate the function.
Ideally, you reach affordance = What you see is how
it works. Because the less info your audience will
have to remember (about things that are not central
to the experience you want to offer) the better.
And if an icon or an item doesn’t speak by itself, then
the player first has to figure out what it means, then
remember it. Which won’t be the case if you can
reach affordance (less cognitive workload)
Good icons should be explicative of the kind of functionalities people will encounter

If the door can only be opened by pushing it, it should not have a handle. With that there’s
clearly only one opportunity for the user: to push the door. If a handle is available, then it may
be that you can push or pull the door.
If the form of the handle does not allow any conclusions about its function, then there is a bad
affordance and the handle was designed not by the Form Follows Function principle.
The topic of affordance can be well
explained, using the example of doors that
can be opened in one direction only. In this
case, PUSH.
See the Norman Door (video)!
[https://youtu.be/yY96hTb8WgI]

It’s not you. Bad doors are everywhere.
[https://youtu.be/yY96hTb8WgI]

How designers silently tell you what to do? - Affordances and Signifiers
[https://www.youtube.com/watch?v=l7_b_uVOkT8]

Steve Krug, along Nielsen and Norman, was a pioneer on web usability.
[https://tubikstudio.com/dont-make-me-think-20-thoughts-on-usability-by-steve-krug/]

Attention
Perception
Memory
Learning Cognition
Emotion
Motivation
Action
• These are the 5 dimensions of Nielsen’s usability: Learnability, Efficiency, Memorability, Errors
and Satisfaction.
• Do you remember the Psychology findings we have seen for each of these concepts? For
usability, they are all important but emotion and motivation.
The answer to the question is: ‘following design principles and heuristics’.

Whenever we design, we can use the cognitive psychology knowledge to do it more effectively.
To make more usable games.
Usability and UX researchers have come up with some design principles and heuristics which
expect to save us time. They translated ‘psychology findings’ into some guidelines that are most
of the times correct.
3.2.2 Following Design Principles and Heuristics

Don Norman Design principles (extracted from The Design of Everyday Things):
• Consistency (helping users recognize and apply patterns)
• Visibility (every available action should be visible)
• Affordances (visual attributes that give control)
• Mapping (control and effects mapping to real world)
• Feedback (confirmation that an action has been performed)
• Constraints (interfaces should prevent invalid states)
Unit 2 and Unit 3 are very related!
3.2.2.1 Don Norman Design Principles
Start your
library
[http://architectingusability.com/2012/06/28/donald-normans-design-principles-for-usability/
http://moveableonline.com/blog/2014/11/03/6-principles-design-la-donald-norman/]
Anyone can relate these principles to the psychology
takeaways (Unit 2) and the usability dimensions…?

Don Norman Design principles
• Consistency (helping users recognize and apply patterns)
• Visibility (every available action should be visible)
• Affordances (visual attributes that give control)
• Mapping (control and effects mapping to real world)
• Feedback (confirmation that an action has been performed)
• Constraints (interfaces should prevent invalid states)
Remember Lesson 2 beginning…
Let us see few of these principles:
Consistency
Since we see what we expect, we need to be consistent and
clear in our designs.

• Positioning pedestrian crossing push-button units on the right-hand side (UK) makes it more likely that
users turn to notice oncoming traffic
• Some cigarette bins are sold to authorities using the sloping top as a feature, discouraging people
leaving lifter on top.
• Some British Rail train doors require passengers to lower the window to get acecess to the handle,
mounted on the outside.
Constraints (interfaces should prevent invalid states)
Examples from designwithintent.co.uk

Blue lighting is used in some public toilets (e.g. here, in Edinburgh) to discourage drug
injection by making veins difficult to see.
Can you use ambient sensory effects
(sound, light, smell, etc) to make it harder
for users to behave in certain ways?

Heuristics are rules of thumb. They are guidelines that can help us during the design process in
order to prevent or to find some usability problems.
Heuristics let you anticipate some problems (while designing) and fix some (while playing)
the prototype!
3.2.2.1 Jakob Nielsen’s 10 usability heuristics
What is an heuristic?

An heuristic is a guideline that helps in finding usability problems or just design better. These are
the 10 Nielsen and Molich heuristics:
• Visibility of system status: real-time feedback to keep users informed.
• Match between system and the real world: concepts familiar, order and logical order.
• User control and freedom: support freedom but also undo.
• Consistency and standards: you should not be original.
• Error prevention: eliminate error-prone conditions.
• Recognition rather than recall: minimize the user’s memory load by making things visible.
• Flexibility and efficiency of use: allow users to tailor frequent actions.
• Aesthetic and minimalist design: eliminate irrelevant or rarely needed information.
• Help users recognize and recover from errors: use plain language to explain a problem &
solution.
• Help and documentation: in case of necessary documentation, it should be easy to search.
For every heuristic, we should ask:
- Is this rule being applied? How so?
- Is this rule violated? How so?
- How severe is the problem?
[http://www.designprinciplesftw.com/collections/10-usability-heuristics-for-user-interface-design
https://www.interaction-design.org/literature/article/user-interface-design-guidelines-10-rules-of-thumb]
Good examples from Photoshop!
You do not need to remember them all by heart.

[https://medium.com/@erangatl/10-usability-heuristics-explained-caa5903faba2]
[https://medium.com/@erangatl/10-usability-heuristics-explained-c7a363e671a7]
01. Visibility of system status
The system should always keep users informed about what is going on, through appropriate
feedback within reasonable time.

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

03. 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.
If you attached a large file in gmail by mistakenly, you can
cancel it before its fully uploaded.
If you do a simple mistake you can always undo and
recover from it, and if you want to go deeper medium has
revision history that you can restore to a previous state.

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

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

06. 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.
When a user returns to a eCommerce site like Amazon and Ebay, the personalized
home page includes a list of recently viewed items, suggestions by your browsing
history and recommendations through your purchase history.
When you google it gives you list
suggestions as you type in based on
your previous searches and related
most searches. It also lists your
matching bookmarks as well.

07. Flexibility and efficiency of use
Accelerators — unseen by the novice user — may often speed up the interaction for the expert
user such that the system can cater to both inexperienced and experienced users. Allow users
to tailor frequent actions.
While novice user use the default google image search, expert user always can refine the
search by size, color, type and so on.

08. 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.
Google search and account login is a good example of minimalist design, it
has only the required information to perform the primary task.

09. Help users recognize, diagnose, and recover from errors
Error messages should be expressed in plain language (no codes), precisely indicate the
problem, and constructively suggest a solution.
This funny error message keeps the audience engaged, while relevant links
keep you on your website.

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.
You can provide any extra information that would be useful to users, along
with the label. But you should do so only if it is necessary.

Many researchers have created game usability heuristics, but they are all quite similar.
You do not need to remember them all by heart.
Nobody works without documentation. (!)
• Heuristics for Video Games Evaluation: How Players Rate Their Relevance for Different Game
Genres According to Their Experience. Florentin Rodio, Jm Christian Bastien. 2013. (Academic
paper)
• Game Usability Heuristics (PLAY) For Evaluating and Designing Better Games: The Next Iteration.
Heather Desurvire. 2009. (Academic paper)
• Using heuristics to evaluate the playability of games. Heather Desurvire. 2004. (Academic paper)
Using Heuristics to Evaluate the Overall User Experience of Video Games and Advanced
Interaction Games. Christina Koeffel, Wolfgang Hochleitner, Jakob Leitner, Michael Haller, Arjan
Geven, and Manfred Tscheligi. 2010. (Book chapter)
• Ten Heuristics To Evaluate the User Experience of Serious Games. L. Fitchat and D.B. Jordaan.
2016. (Academic paper)
• Gaming Usability 101 This list of ten features should be embraced by game designers. 2007.
[https://www.bloomberg.com/news/articles/2007-10-12/gaming-usability-101businessweek-
business-news-stock-market-and-financial-advice] (Web)
3.2.3 Video game UX/Usability heuristics

Using Heuristics to Evaluate the Overall User Experience of Video Games and Advanced
Geven, and Manfred Tscheligi. 2009. (Academic Paper)
To put their heuristics into questions:
• Are clear goals provided since the beginning?
• Are players rewards meaningful?
• Does the player feel in control?
• Is the game balanced?
• Is the first playthrough and first impression good?
• Is there a good story?
• Does the game continue to progress well?
• Is the game consistent and responsive?
• Is it clear why a player failed?
• Are there variable difficulty levels?
• Is the game and the outcome fair?
• Is the game replayable?
• Is the artificial intelligence visible, consistent, yet somewhat unpredictable?
• Is the game too frustrating?
• Is the learning curve too steep or too long?
• Emotional impact?
• Not too much boring repetition?
• Can players recognise important elements on screen?
Formal
Some of the new heuristics are not that
‘psychology based’ or are too general…
and sometimes become unhelpful.

[https://www.youtube.com/watch?v=E9TzmJgZGzQ]
• Exercise: Kiwi Clapas.
The youtubers named PlaytestCloud often comment the usability of some games. In this case,
they found two aspects, one of them relates to heuristics. Which?

3.3 What is Accessibility
Accessibility is a quality attribute of the product that allows people with a diverse range of
hearing, movement, sight, and cognitive ability issues to use a software.
This is a bit informal, but, it is like an ‘extended version’ of usability.
The main difference is that without adapting the software to accessibility recommendations
some people cannot actually use/play.

According to a study done by PopCap Games, 20% of casual players are impaired.
A total of 13,296 casual game players responded to the survey, with 2,728 respondents (20.5%)
identifying themselves as "mildly" (22%), "moderately" (54%) or "severely" (24%) disabled. Of
those, 46% indicated that their primary disability was physical, 29% said it was mental, and 25%
stated they had a developmental or learning disability. Over two thirds (69%) of disabled
respondents were female, and a third (35%) of all respondents had another person -- parent,
adult offspring, spouse, guardian or caregiver -- assist them in taking the survey.
[https://www.eldiario.es/hojaderouter/tecnologia/software/heroes-obligan-gigantes-pensar-
discapacidad_0_740526370.html]
[http://www.gamasutra.com/view/feature/1408/designing_usable_and_accessible_.php?print=1]
[https://www.gamasutra.com/blogs/ZeinOkko/20171214/311682/Gaming_Without_Barriers_Why_we_need_
to_include_Accessibility_to_the_concept_phase_of_game_development.php]
Game Development Essentials. Jeanni Novak. Chapter 8
Many video game players need accessibility
3.3.1 Video games Accessibility

People have disabilities, and games not ready for them have accessibility lacks.
In games, if a player cannot understand what is said in cut scenes or cannot hear the footsteps of
someone sneaking up behind him or her, because the player suffers from an auditory disability or
if the game does not support the use of specific input devices such as one handed controllers or
sip and puff joysticks that allow severely physical disabled players to play the game.
Basically we have:
• People who cannot see well.
• People who cannot hear well.
• People who cannot perform (mobility).
• People who cannot learn at the same pace.
We should provide design options that make these games accessible to them.

Accessibility starts at the concept phase
Some games are harder to make accessible, some are easier and it's definitely harder to achieve
accessibility when the game is already half-way done.
When you use colors for example, don't hard-code them, but use a database or references
instead. This way you can easily swap a color-set for colorblind-friendly ones. Is the game voiced?
Great! Just make sure to have subtitles or dialog boxes for deaf people.
Make an accessibility options plan and deliver them in different releases. But think in advance.
Identify the mechanics, talk to the community, follow guidelines
• Talk to your GUI designers and game designers and figure out all the relevant information.
• Look for players’ with accessibility problems and playtest with them.
• Check out some of the guidelines provided by experts.
[https://www.gamasutra.com/blogs/ZeinOkko/20171214/311682/Gaming_Without_Barriers_Why_we_need_
to_include_Accessibility_to_the_concept_phase_of_game_development.php]

Accessibility guidelines for the designers. There are initiatives such as
gameaccessibilityguidelines.com.
“A collaborative effort between a group of studios, specialists and academics, to produce a
straightforward developer friendly reference for ways to avoid unnecessarily excluding players,
and ensure that games are just as fun for as wide a range of people as possible.”
I invite you to read them. They are exhaustive. They are divided in these categories: motor,
cognitive, vision, hearing, speech and general.
[http://gameaccessibilityguidelines.com]

Accessibility sites, databases and accessories for the players. Since not all games are accessible,
players need some tools in order to find games that are adapted to their disabilities.
Audiogames.net (blind community), one switch (database with accessible games, community,
shop)…
[http://switchgaming.blogspot.com.es/2009/07/game-accessibility-sites.html]
[http://www.oneswitch.org.uk/art.php?id=14]
[http://forum.audiogames.net]

In oneswitch.org.uk there are many accessories. In itch.io they have filters in order to find games
with specific accessibility features.
[http://switchgaming.blogspot.com.es/2009/07/game-accessibility-sites.html]
[http://www.oneswitch.org.uk/art.php?id=14]
[http://forum.audiogames.net]

Here is a list of 7 examples of accessibility design that developers should study (read the article).
3.5.1.1 Types of Accessibility Design Options
[https://www.gamasutra.com/view/news/299850/7_examples_of_accessibility_design_that_developers_shou
ld_study.php]
Takeaway: Good accessibility is often just good design, and great sound design — with unique
audio cues for every move, character/enemy type, and health/power/special meter — in
particular can have a huge impact on accessibility for players with vision impairments.
Re-mappable controls helped Dayton
Jones excel at Killer Instinct tournaments

World of Warcraft's overall accessibility and fantastic post-launch improvements
Takeaway: You can use post-launch
updates and patches to incorporate new
accessibility options and to improve the
ones you already have based on player
feedback.
Rocket League's mobility accessibility
Takeaway: Just because your game is fast
paced or frenetic, it doesn't mean you
can't cater to people with temporary or
permanent mobility impairments —
configurable controls, camera assists,
and non-critical mechanics for advanced
players go a long way to making a game
accessible to all.

Life is Strange's configurable subtitles
Takeaway: Just having subtitles is good,
but you can do so much more — let
players customize the color, font size,
and subtitle background, and if possible
include closed captions for important
audio cues as well.
Warlock of Firetop Mountain's reading accessibility
Takeaway: A lot of people have difficulty
reading, and you can go a long way
toward helping them by simply including
a dyslexic-friendly font alternative and
multiple font sizing options. (And if you're
a small indie developer, accessibility —
particularly in underserved areas — may
translate into better sales and more
media attention.)

Madden 17's 'couch mode’
Takeaway: Not everyone playing your
game has 20/20 vision and a monitor
three feet from their face, so include an
option to let them make the UI bigger if
they need to.
Overwatch's per-character remappable controls
Takeaway: If making a game with
multiple playable characters, each with
unique capabilities, it helps to have
separate button-mapping profiles for all
of them. And if you're going to the
trouble to improve your game's
accessibility, why not go a step further
and try to make it accessible to all.

Super Mario Odyssey ‘assist mode’
Takeaway: Not everyone playing your
game has played the super Mario (3D)
games. Or even, some people has
learning difficulties. Providing an assist
mode. Or perhaps, it is played by small
children.
[https://www.youtube.com/watch?v=QnQEM0I3SMo]

Every operating system and website should follow accessibility guidelines
in order to remove barriers for all kind of users
3.3.2 Software and web accessibility
I want to briefly introduce web accessibility.
The web is fundamentally designed to work for all people, whatever their hardware, software,
language, location, or ability. When the Web meets this goal, it is accessible to people with a
diverse range of hearing, movement, sight, and cognitive ability.
Thus the impact of disability is radically changed on the Web because the Web removes
barriers to communication and interaction that many people face in the physical world.
However, when web sites, applications, technologies, or tools are badly designed, they can
create barriers that exclude people from using the Web.
[https://www.youtube.com/watch?v=20SHvU2PKsM]

[https://www.w3.org/TR/WCAG20/#contents]

[https://seesparkbox.com/foundry/getting_comfortable_with_wcag]
The top level of WCAG 2.0 consists of principles. Each principle contains one or
more guidelines. If you drill into a single guideline, you’ll see that it contains one or
more success criteria. Let’s talk about each of those levels.

Principles
The four principles of WCAG 2.0 are perceivable, operable, understandable, and robust.
• Principle 1: Perceivable - Information and user interface components must be presentable to users
in ways they can perceive.
• Principle 2: Operable - User interface components and navigation must be operable.
• Principle 3: Understandable - Information and the operation of user interface must be
understandable.
• Principle 4: Robust - Content must be robust enough that it can be interpreted reliably by a wide
variety of user agents, including assistive technologies.
Guidelines
Some guidelines make plenty of sense without context, such as Guideline 2.1: Make all functionality
available from a keyboard or . Some don’t make sense out of context.
Success criteria
Either way, each guideline is made up of rules called success criteria that clearly describe what they
mean. For instance, for Guideline 1.4 Distinguishable: Make it easier for users to see and hear content
including separating foreground from background we have several success criteria. See:
1.4.3 Contrast (Minimum): The visual presentation of text and images of text has a contrast ratio of at
least 4.5:1, except for the following: (Level AA)
• Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
• Incidental: Text or images of text that are part of an inactive user interface component, that are pure
decoration, that are not visible to anyone, or that are part of a picture that contains significant other
visual content, have no contrast requirement.
• Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.

One important point. If you make something accessible to people who
really need it to use it, you are making it more usable to everyone else.
Accessibility and usability.
The first is binary for few (they can use it or not), the second is gradual for
the rest (they can use it with more ease).

[https://www.wuhcag.com/wcag-checklist/]
If you do not want to go to the main guidelines, you can use these checklists.
WCAG 2.0 checklists are organized by level. If you’re attacking the guidelines in order, you’ll move
from Level A (Beginner) through Level AA (Intermediate) and on to Level AAA (Advanced).

Key Questions (TakeAways)
• Usability is a quality of a product that we assess by looking at the user interact
with it. It is the ‘ease of use’, according to Nielsen, in several dimensions
(learnability, efficiency, memorability, errors and satisfaction).
• User Experience is often improved by the product’s usability. Yet, there are
products which have a good UX because of other factors, likewise, there are
products with good usability but not really special.
• We call affordances to the perceivable aspect of an object that helps us to
determine how it might be used.
• Design principles and heuristics rely on knowledge obtained in psychology in
order to help us design preventing usability and UX problems.
• Accessibility are the necessary design changes to enable everyone to use a
product. When we do accessibility, we are also doing usability.
Try to analyze software and videogames using these concepts:
they are powerful tools to improve them!

Extra Session
3.4 Usability / UX heuristic Expert Evaluation
3.4.1 Video Games Heuristics and Report
3.4.2 Website Heuristics and Report
3.5 Accessibility Guidelines Analysis
3.5.1 Video Games Guidelines
3.5.2 Website WCAG standard and Report
Goal of the Session: perform usability, accessibility and UX expert evaluations using
heuristics and guidelines.
Expert Evaluation of Games’
Usability and UX

Goal of the Session
Perform usability, accessibility and UX expert evaluations using
heuristics and guidelines.

Video game are designed iteratively. Having the best usability and creating the best user
experience are some of the most important design goals. Having some expert evaluations are a
resource available to the design team.
Experts do not provide opinion, but analysis based on previous experiences, cognitive
psychology and design principles or heuristics. They provide observations.
Experts are not always completely coincident in their analyses, but they can detect many
problems in advance. However, they cannot substitute real data from games user research –
whether it is through playtesting or other methods.
Experts evaluation analysis usually are focused on finding:
• Usability issues
• User experience aspects
3.4 Usability/UX heuristic Expert Evaluation

An heuristic is a rule that should guide us in understanding how usable or how good the user
experience of a design is.
These are the 10 Jakob Nielsen heuristics:
• Visibility of system status: real-time feedback to keep users informed.
• Match between system and the real world: concepts familiar, order and logical order.
• User control and freedom: support freedom and multiple ways to do things.
• Consistency and standards: you should not be original.
• Error prevention: eliminate error-prone conditions.
• Recognition rather than recall: minimize the user’s memory load by making things visible.
• Flexibility and efficiency of use: allow users to tailor frequent actions.
• Aesthetic and minimalist design: eliminate irrelevant or rarely needed information.
• Help users recognize and recover from errors: use plain language to explain a problem &
solution.
• Help and documentation: in case of necessary documentation, it should be easy to search.
For every heuristic, we should ask: Is this rule being applied? Is this rule violated? How severe is the
problem? How could it be improved or solved?
Nielsen heuristics are ‘general’ and could be easily applied to screen interfaces (PC software and websites).
In regards of video games, they become a more loose advice, not that direct to apply but good for reflection.

An heuristic analysis is a method to employ heuristics to find problems. Understand the value of
heuristics, but also the limitations. Heuristics are a discount usability method and will not find all
usability problems.
A game can easily have 200 usability problems, and heuristic evaluation with 5 evaluators will
typically find about 150 (75%) of them.
Purpose and problems (What)
Having an heuristic in mind, we want to find a problem that stops the player from having a better
user experience, whether it depends specifically on the interface or in the game mechanics.
Usually, most of problems are related to functioning or information.
1. Functioning (e.g. an element is not working smooth or it blocks the entrance)
2. Excess (e.g. false affordance, too many colors, etc.)
3. Information omission (e.g. something is required: tutorial, indicator, feedback, etc.)
[https://www.interaction-design.org/literature/article/heuristic-evaluation-how-to-conduct-a-heuristic-
evaluation]

Method (Who, When and How)
In a typical expert evaluation, two or three evaluators review the game. The reason why is that
different evaluators tend to find different problems.
They should be used early. Their evaluation should provide some insights, some useful
comments on each heuristic. This means: before/during the alpha phase.
Usability problems detected should be described and rated according to severity.
[https://www.interaction-design.org/literature/article/heuristic-evaluation-how-to-conduct-a-heuristic-
evaluation]

How can you perform an Heuristic Evaluation to your game?
1. Find usability experts or designate novice evaluators
2. Choose a list of Heuristics (if you have usability experts, they can help)
3. Evaluators separately play the game and analyse the game using the heuristics. Problems
found are compiled, organized, and delivered as a written and/or presented report (Excel
and report documents).
4. Game team fixes problems in their respective areas

The good thing about heuristics, in my opinion, is that even if you aren't an expert,
they can provide a list of things for you to think of when you look at your game.
Pros
• Smaller number of people needed.
• Relatively fast turn around.
• Cheaper than real data.
• It can be used with prototypes so it saves energy.
Cons
• Which heuristics to pick (besides Nielsen)?
• Sometimes not easy to interpret or too general.
• Where do you find experts?
• You are not testing representative users.
Pros / Cons

How can we choose the right heuristics?
Many researchers have created game usability heuristics, but they all resemble.
You do not need to remember them all by heart. Nobody works without documentation. (!)
• Heuristics for Video Games Evaluation: How Players Rate Their Relevance for Different Game
Genres According to Their Experience. Florentin Rodio, Jm. Christian Bastien. 2013.
• Game Usability Heuristics (PLAY) For Evaluating and Designing Better Games: The Next
Iteration. Heather Desurvire. 2009.
• Using heuristics to evaluate the playability of games. Heather Desurvire. 2004.
• Using Heuristics to Evaluate the Overall User Experience of Video Games and Advanced
Geven, and Manfred Tscheligi. 2010.
• Ten Heuristics To Evaluate the User Experience of Serious Games. L. Fitchat and D.B. Jordan.
2016.
3.4.1 Video game UX/Usability Heuristics and Report
Choose a list of Heuristics that are general, and some that are more
specific to the game genre/type you want to analyse its usability/UX.

In the late 2000s, specific video game heuristics started appearing to point out at general issues
affecting usability and UX (unlike Nielsen’s, which were aimed at improving usability).
These are some examples of heuristics:
• Controls should be customizable and default to industry standard settings (Federoff 2002).
• Feedback should be given immediately to display user control (Federoff 2002).
• Pace the game to apply pressure on, but not to frustrate, the player (Federoff 2002).
• Provide clear goals; present overarching goal early as well as short-term goals throughout play
(Desurvire et al. 2004).
• The game should give rewards that immerse the player more deeply in the game by increasing
their capabilities (power-up) and expanding their ability to customize (Desurvire et al. 2004).
• Players discover the story as part of game play (Desurvire et al. 2004).
• Avoid large blocks of text (Schaffer 2007).
• Players should feel in control; they need the time and information to respond to threats
and opportunities (Schaffer 2007).
• Don’t make it easy for players to get stuck or lost (Schaffer 2007).
• The user interface should be consistent both within the game and between the games
(Laitinen 2008).
• The terminology and language used in the game should be easy to understand (Laitinen 2008).
• The user interface should be designed so that it prevents the player from making mistakes that
are not part of the gameplay (Laitinen 2008).

How to create a report for an heuristic evaluation: 1) create an Excel file for the heuristics
and a 2) report document for the issues.
In an heuristic evaluation experts sometimes find issues without relating them to any particular
heuristic. They are no less valid. You can put them at the end of the report.
Heuristic, Occurrence, Recommendation/Problem, Severity, Score/Priority

Example of Usability Reporting: Better Games Through Usability Evaluation and Testing. Sauli
Laitinen.
[https://www.gamasutra.com/view/feature/130745/better_games_through_usability_.php?print=1]
Shadowgrounds. In this article, Frozenbyte’s Inc. (independent game studio based in Helsinki)
explains how they fixed some of their game’s usability issues by employing first an expert
(heuristic) evaluation and later a usability testing.
They found 135 and 97 problems correspondingly.

This article is especially good at teaching how to report usability problems that affect
the gameplay and the use of the on-screen interface (HUD).

Designing Usable and Accessible Games with Interaction Design Patterns. Eelke Folmer.
[http://www.gamasutra.com/view/feature/1408/designing_usable_and_accessible_.php?print=1]
Problems with heuristics
Guidelines are useful for requirements specification but if we look at their usability as a design tool
some shortcomings have been identified by Welie with regard to selection, validity and
applicability:
• Guidelines often suggest a general absolute validity but in fact they can often only be applied in
a specific context. For example Federoff specifies “The game should have an unexpected
outcome” which makes sense and works for an adventure game but does not apply to arcade
games such as pong.
• It is often unclear what the problem is the guideline actually tries to solve and why. Federoff
specifies “Players should be able to save games in different states” but it does not explain what
usability problem it addresses and why the proposed solution would work and how it can be
implemented.
• Compacting design knowledge in small concise rules has the obvious problem that you end up
with a lot of rules in order to describe everything. A large number of guidelines makes it hard
for a game designer to select the right rules and worse the lack of context makes certain
guidelines contradict with each other. For example, “The game should have an unexpected
outcome” and “there should be a clear overriding goal of the game presented early” might
possibly conflict.

Folmer sees common usability and accessibility problems:
• player has to wait,
• player makes errors,
• games does not adapt to the player,
• game does not provide help,
• game does not provide feedback.
Instead of using heuristics, Folmer develops a sort of ‘usability patterns’ to solve general
accessibility/usability problems.
Folmer criticizing to heuristics makes sense, it is correct, but their pattern proposals are no really a
solution to those particular problems. Patterns are still difficult to apply.
But patterns are a good tool to teach game designers.
It is good check out the examples from the article and get some ideas in order to analyze games.
This is going to be useful to train your observation skills and become a Usability expert.

How to create a report for an heuristic evaluation: 1) create an Excel file for the heuristics
and a 2) report document for the issues.
In an heuristic evaluation experts sometimes find issues without relating them to any particular
heuristic. They are no less valid. You can put them at the end of the report.
Heuristic, Occurrence, Recommendation/Problem, Severity, Score/Priority
3.4.2 Website Heuristics and Report

In the report, you can create a table for each issue with: Problem title, screenshot, severity,
description and recommendation or possible solution.
It is common for experts performing heuristic evaluations to do the following three key things in
their reports:
• Uniquely identify each issue and any associated recommendations. This lets you easily refer
to them in any report or discussion.
• Prioritize, or rank, each issue according to its severity, and codify the ranking in some way.
Myself and many others use this traffic-light taxonomy:
o example of a best practice (Green)
o minor problem (Yellow)
o serious problem (Orange)
o critical problem (Red)
• Relate each issue and its recommended solutions to screenshots of the user interface. This
enables people who read your report to see the problems to which you’re referring without
their needing to have access to the system you’ve evaluated.
[https://www.uxmatters.com/mt/archives/2014/06/an-overview-of-expert-heuristic-evaluations.php]

3.5 Accessibility guidelines analysis
Accessibility guidelines analysis is not much different from Usability or UX heuristic analysis.
You choose the accessibility guidelines, you create an excel and you study the game.
Video Games Excel: http://gameaccessibilityguidelines.com/GAG-checklist.xlsx
You should include three more columns:
• Reach (number of people who benefit)
• Impact (the difference made to those people)
• Value (cost to implement)

Accessibility guidelines exercise. Verify all the guidelines for some of following games. I want you
to find the one missing/one included in each category that would have a major impact.
1. Super Mario 64
2. Super Mario Bros. 3
3. Half-Life 2
4. Tetris
5. Portal
6. Resident Evil 2
7. The Secret of Monkey
8. Warcraft II
9. GoldenEye 007
10. Super Smash Bros. Melee
How many guidelines you found fulfilled/missing per game, and in total?
Alternative exercise. Browse the website and choose 3 guidelines. Explain whether they can
benefit both game’s accessibility and usability or just accessibility.
Are they difficult to implement? Do they affect a lot of people? Is it crucial to those people?
[http://www.ign.com/lists/top-100-games]
3.5.1 Video Games Accessibility Guidelines

You can go straight to the WCAG (Web Content Accessibility Guidelines) or use this checklist*.
[https://www.wuhcag.com/wcag-checklist/]
3.5.2 Website WC3 Accessibility Checklist
Accessibility guidelines analysis is not much different from Usability or UX heuristic analysis.
You should include three more columns:
• Reach (your estimation of number of people who benefit)
• Impact (the difference made to those people, whether it is a total improvement or gradual)
• Value (cost to implement)

Key Questions (TakeAways)
• We now know what are expert evaluations and when to use them: mainly
at the beginning of the alpha phase. They are not a 100% reliable solution
find usability/accessibility issues and UX aspects, but they are easy to
apply and can prevent from many further problems.
• We learnt the main steps in developing an analysis. Choose the
guidelines/heuristics. Create the Excel. Evaluate them and rate them. It is
recommended to stick to the Nielsen heuristics and find others' suitable to
the game type (mobile, multiplayer, etc.).
• Other analysis taking into account the very first hour of playing a game or
working with a tool are very useful in order to make sure the user is
engaged into learning the mechanics or functionalities in an effective way.
Remember: analysis is useful, but real experiments are required.
Experiments can benefit from previous expert analyses.

References and bibliography:
Video games references:
• Gamasutra articles:
Better Games Through Usability Evaluation and Testing. Sauli Laitinen.
Designing Usable and Accessible Games with Interaction Design Patterns. Eelke Folmer.
[http://www.gamasutra.com/view/feature/130745/better_games_through_usability_.php?print=1
http://www.gamasutra.com/view/feature/1408/designing_usable_and_accessible_.php?print=1]
• Board Game Design Day: Cardboard Interfaces: UX for Board Games (Video).
https://www.gdcvault.com/play/1024914/Board-Game-Design-Day-Cardboard
• Game User Experience Evaluation. Regin Bernhaupt. 2015. (Especially Chapter 6 and 7).
• Game Usability Heuristics :: MPX Week 1
and https://www.youtube.com/watch?v=_PmiRUIxmSc https://www.youtube.com/watch?v=fd5b8p0QaKA
• Usability Heuristics for Games - Are We having Fun Yet? John Mark Josling and Corey Chandler. South by Southwest
Interactive 2011 [http://www.slideshare.net/jmjosling/are-we-having-fun-yet-usability-
heuristicshttps://www.youtube.com/watch?v=K2w6EEvB6o4]
• Usability in Virtual Reality [http://gdcvault.com/play/1023938/VR-Usability-in]
• Usability is Not Random. Mike Acton. Insomniac Games. 2013. [http://www.gdcvault.com/play/1017953/Usability-Is-
Not]
• 10 Usability Heuristics by Jakob Nielsen with examples from the web and Mobile apps: [https://blog.prototypr.io/10-
usability-heuristics-with-examples-4a81ada920c#.2lriv4vgd]

References and bibliography:
General software references:
• Postolovski N. What Is The Most Underrated Word In Web Design? (June 24, 2014). (Affordance Article). Smashing
Magazine. https://www.smashingmagazine.com/2014/06/affordance-most-underrated-word-in-web-design/
• IDF Instructor (2015). Affordances and Design. Interaction Design Foundation. https://www.interaction-
design.org/literature/article/affordances-and-design
• Eranga Lianyage (2016, October 2). 10 Usability heuristics explained (Nielsen’s). https://medium.com/@erangatl/10-
usability-heuristics-explained-caa5903faba2 https://medium.com/@erangatl/10-usability-heuristics-explained-
c7a363e671a7
• Duggirala S. (2016, August 18). 10 Usability heuristics with Examples (Nielsen’s). https://blog.prototypr.io/10-usability-
heuristics-with-examples-4a81ada920c
• Interaction Design Foundation. How to Conduct a Heuristic Evaluation for Usability in HCI and Information
Visualization. https://www.interaction-design.org/literature/article/how-to-conduct-a-heuristic-evaluation-for-
usability-in-hci-and-information-visualization
• We love UXd. Heuristic Analysis for UX: How to Run a Usability Evaluation. http://www.weloveuxd.co.za/heuristic-
analysis-ux-run-usability-evaluation/
• Nielsen J. (1995, January 1st). How to Conduct a Heuristic Evaluation. Nielsen Norman Group.
https://www.nngroup.com/articles/how-to-conduct-a-heuristic-evaluation
• Sauro J. (2012, September 6th). How Effective are Heuristic Evaluations?. https://measuringu.com/effective-he/
• Mota A. (2014, April 16). Heuristic Evaluation of Duolingo iOS app.
https://www.behance.net/gallery/16170223/Heuristic-Evaluation-of-Duolingo-iOS-app
• Bravo W. (2017, May 24th). Heuristic Evaluation of Two Travel Websites.
https://medium.com/@WendyBravo/heuristic-evaluation-of-two-travel-websites-13f830cf0111

Whatsapp UX problems
• What is wrong with Whatsapp UX?
Please, give me some answers.
I can easily think of two things.
They are related to UX but not usability.
Hint: group management.
Hint: privacy.

• Whatsapp groups have bad UX when…
• When you turn on a smartphone it connects automatically to the Internet and
Whatsapp even before introducing the PIN. You can partly read messages.
Anyone can add you to a group and you cannot
decide whether to join or not. Instead, if you
get out, everyone realizes that you decided to
get out.
When you delete a Whatsapp account, every
group you were in gets a notification saying
you’ve left the group. They do not know you
have deleted your account.

What should electric cars sound like?
• Why is this usability?
• Why is this user experience?
[https://www.ted.com/talks/renzo_vitale_what_should_electric_cars_sound_like

Extra video: What should electric cars sound like?
• Why is this usability? Cars sound prevent accidents because pedestrians realize a
car is coming.
• Why is this user experience? Vehicles sounds are a distinctive signature
(remember Harley Davidson sound was even patented) of the car.
[https://www.theguardian.com/environment/2018/may/06/new-law-combats-silent-
menace-electric-cars]

User Experience 3: User Experience, Usability and Accessibility

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to User Experience 3: User Experience, Usability and Accessibility

Similar to User Experience 3: User Experience, Usability and Accessibility (20)

More from Marc Miquel

More from Marc Miquel (16)

Recently uploaded

Recently uploaded (20)

User Experience 3: User Experience, Usability and Accessibility