Introduction to Interactive Computer Systems MAP-I -2014/15

Universidade de Aveiro

Departamento de Electrónica,

Telecomunicações e Informática

Beatriz Sousa Santos, 2014/2015

2

• “As popular computing has grown, the role of HCI (human-computer interaction) has increased. Most software today is interactive, and code related to the interface is more than half of all code.”

• “HCI also has a key role in application design. In a consumer market, a product’s success depends on each user’s experience with it. Unfortunately, great engineering on the back end will be undone by a poor interface, and a good UI can carry a product in spite of weaknesses inside.“

• “Innovation in the product is a nice virtue, but it’s an option in terms of marketability. Usability is not.”

Canny, J., The Future of ICH, ACM Queu, Jul.-Aug., 2006, pp. 25-32

3

• “Those of us who deal with user interfaces tend to think primarily in terms of computer programs. But user interface problems in the real world are often worse since the real world is not nearly as malleable as the computer world. An ideal solution, even if we know what it is, might not be practical to implement.”

• “The real world is just as much a nuisance to design for as the computer world, and maybe more.”

Blinn, J, “User Interface Stories from the Real World”, IEEE Computer Graphics and Applications, Jan./Feb, 2005, pp.92-93

“The interface between humans and computers is harder than ever to define, we can interact with computers just by walking through a public space.”

4

Sellen, A., Rogers, Y., Harper, R., & Rodden, T., “Human Values in the Digital Age”, Communications of the ACM, 52(3), March 2009, pp. 58–66

5

The Topic of this course:

Design, evaluation, and implementation of computing systems for human use:

• From a single user interacting with a single computer

• To spaces enhanced with ubiquitous technology to support the activities or needs of multiple users

Course Outline

• Introduction to HCI; usability principles and paradigms (> Prof. Rui José)

• Interaction styles, techniques and devices (> Prof. Paulo Dias)

• Evaluation: traditional and formal methods (> Prof. José Creissac)

• The user: relevant characteristics to the design of interactive systems

• Human Centered Design, interactive S/W life cycle

http://wiki.di.uminho.pt/twiki/bin/view/Education/MAPiICS/

• Students assignments/presentations:

- Usability evaluation of an application, system, device, ...

using “traditional” and formal methods (including report)

- Monographs (only presentation)

6

Icebraker

• Name

• Background (not only but also in HCI)

• University

• Prospective work subject

• Why ICS

• Mainling list

7

Usability Principles and Paradigms

Universidade de Aveiro Departamento de Electrónica, Telecomunicações e Informática

(Norman, 2013)

9

• Introduction

• History

• Usability and standards

• Principles

• Paradigms

10

• During the World War II the following disciplines emerged:

Ergonomy – physical aspects

Human factors – also cognitive aspects

Man-Machine Interaction Human-Computer Interaction (nighties)

11

• Interaction emerged as new independent field within Computing in the 80s, mainly due to: – Lower price of technology

– Technology migration (to be used by “non-computer expert users” )

– Need to increase users productivity

• It expanded rapidly

• It is currently an interdisciplinary field

12

Interactive systems design

• Interactive systems include a “module” which we don´t control:

The user, who:

- is very complex

- is not well known

- we cannot control

This makes design difficult

• To the user “the interface is the system”

• The user interface design involves a considerable effort

interface computer

user

Interactive System

Human factors in User Interfaces

• Limited short-term memory

• People make mistakes

• People have different capabilities

• People have different interaction preferences

We should study the user scientifically

13

The User (postponed to another session)

15

Interactive system design

• Involves knowing:

Usability principles (independent from technology)

Usability paradigms (more technology dependent) • We must know the success examples (usability paradigms)

• Understand why they work (usability principles)

• Use the adequate methods (user-centered approach)

• And evaluate, re-design, evaluate, redesign … until we attain the usability goals

+ Adequate methods + Evaluation

User-centered design main characteristics

• early and continual focus on users and their tasks

• empirical measurement of user behavior (mainly usability tests)

• iterative design

(many alternatives tested with low fidelity prototypes)

16

Low-fidelity prototypes

17

e-mail for elderly people

Shopping application

One-button paint

Shop managment application

e-Doctor

Car dashboard

Even in situations where it seems difficult to think of a paper prototype:

18

Pac-Man game controlled by gestures

User Centered Design Interactive Software Lifecycle (postponed to another session)

21

Usability

• Is directly related to the system capacity to allow users attaining their goals through its usage

• Three fundamental aspects (dimensions): - easy to learn and remember (learnability, memorability) - easy to use (fast and with few errors) (efficiency, efficacy) - satisfaction

Is defined in a context of use: is a system property of allowing specific users to perform specific tasks efficiently with efficacy and satisfaction

• Main usability benefits: • Higher user performance and satisfaction

• Lower development costs

• Lower support costs

– Higher profits for everyone!

22

23

Ian Sommerville, Software Engineering, 9th ed., Addison Wesley, 2010

Usability is a non- functional requirement

http://ifs.host.cs.st-andrews.ac.uk/Books/SE9/WebChapters/PDF/Ch_29%20Interaction_design.pdf

24

Usability standards

• ISO 13407 -> ISO 9241-210 (2010) Human-centred design processes for interactive systems • And others related ISO 13.180 Ergonomics

• ISO 9241-11 (1998) Ergonomic requirements for office work with visual display terminals Part 11 : Guidance on usability

Explains how to identify the information needed to specify or evaluate usability in terms of measures of: - performance - satisfaction

http://www.userfocus.co.uk/resources/iso9241/futureparts.html

To specify or measure usability, we need :

• a description of the intended goals

• a description of the context of use, including:

– users

– tasks

– equipment and environment

This may be a description of an existing context, or a specification of intended contexts

• target or actual values of effectiveness, efficiency, and satisfaction for the

intended contexts

25

ISO 13407

• The goal is to ensure that the development and use of interactive systems take account of the needs of the user and all stakeholders

• applies to software products, hardware/software systems, websites, and services

• describes best practice in user centered design

• provides guidance on design activities throughout the life cycle ICS

• describes an iterative development cycle

26

• ISO 13407 adresses:

• … Four Principles of Human-Centered Design:

- active involvement of users

- appropriate allocation of function to system and to user - iteration of design solutions - multi-disciplinary design

• ... and Four Human-Centered Design Activities:

- understand and specify the context of use

- specify user and organizational requirements - produce more than one candidate design solution - evaluate designs against requirements

27

Other related standards

...

...

29

Some usability paradigms (along the history)

Video Display Unities (VDUs) (1950s) Time sharing (1960s) WIMP (Windows, Icons, Menus, Pointers) (1980s) Direct manipulation (1980s) WWW (1990s) Ubiquitous computing (1990s)

Sketchpad (Ivan Sutherland, 1963)

30 http://www.youtube.com/watch?feature=endscreen&NR=1&v=USyoT_Ha_bA

Alto and Macintosh

31 < Xerox PARC, 1973

^ Apple Macintosh 512KB, 1984

UbiComp Prof. Rui José

32

33

Usability principles (a possible list)

User compatibility

Task compatibility

Work-flow compatibility

Product compatibility

Feedback

Coherence

Familiarity

Simplicity

Flexibility

Control

Technology invisibility

Robustness

Error protection

Usability goals: Easy to learn and memorise Easy to use (effective and efficiente) Satisfaction

34

Examples of the principles use in Windows / Office

35

And in other devices

36

Feedback (desktop) Visibility of the system status

37 console

Digital camera

ON

Feedback Visibility of the system status

39

Simplicity (defaults hide complexity)

Much of the functionality is not directly accessible

Familiarity (profit from the user experience)

40

41

Familiarity Windows Mobile

Android

42

Familiarity Familiar Icons

Familiar Icons

43

Flexibility (let the user choose)

44

Robustness and error prevention

Not accessible (in grey)

45

Robustness and error prevention

Nintendo DS lite

Play Station Portable

Digital camera

Some Usability problems

When the battery is charging the same LED chages from read to green

To daltonics:

The h/w button does not invoke the functionality that is shown on the screen

Usability problems “at home”

I always get confused;

Wouldn´t you?

47

Back light

Front light

Middle light

Up

Down

Usability / User experience (UX)

• The ease in which people interact with a system to achieve specific goals

• The experience a person has when he/she interacts with a product (encompasses all aspects)

Usability -> function

• Positive UX has a greater impact than just usability

48

• User experience (UX) involves a person's:

– behaviors,

– attitudes,

– and emotions about using a particular product, system or service

and also perceptions of system utility, ease of use and efficiency

• may be considered subjective; it is about individual perception and thought with respect to the system

• It is dynamic as it is constantly modified over time

50

Main bibliography

• Dix, A., J. Finley, G. Abowd, B. Russell, Human Computer Interaction, 3rd ed., Prentice Hall, 2003 (or previous editions)

• Shneiderman, B., Plaisant, C., Cohen, M., and Jacobs, S., Designing the User Interface: Strategies for Effective Human-Computer Interaction , 5th ed., Addison-Wesley, 2009 (or previous editions)

• The Encyclopedia of Human-Computer Interaction, 2nd Ed, Aarhus, Denmark: The Interaction Design Foundation. Interaction Design Foundation, 2013 http://www.interaction-design.org/books/hci.html

• Ian Sommerville, Software Engineering, 9th ed., Addison Wesley, 2010 ( chapter 29- Interaction Design) http://ifs.host.cs.st-andrews.ac.uk/Books/SE9/WebChapters/PDF/Ch_29%20Interaction_design.pdf

Other interesting books:

• Norman, D., Basic Books, The Design of Everyday Things: Revised and Expanded Edition , Basic Books, 2013

• Shneiderman, B., Leonardo's Laptop: Human Needs and the New Computing Technologies, The MIT Press , 2003

51

Interaction styles

Universidade de Aveiro

Departamento de Electrónica,

Telecomunicações e Informática

53

Interaction styles

A possible classification:

• Menus • Fill-in-forms • Direct manipulation • Function keys • Question and answer • Command languages • Natural languages • 3D interfaces Often two or more styles are used simultaneously ... In desktop interfaces and beyond

54

(Sneiderman, 2009)

Menus

Universidade de Aveiro

Departamento de Electrónica,

Telecomunicações e Informática

Menus

• The concept existed long before computers

• Selection of options

• There are several types

57

58

Menus: main advantages and disadvantages

Advantages (potential)

• Auto-explanatory

• Do not load memory (recall instead of remembering)

• Prevent syntactic errors

• Visible improvements

Disadvantages

• Not efficient

• Not flexible

• Not practical for many options

59

User profile to whom menus are adequate:

Knowledge and experience: • Low system and task experience • Frequent usage of other systems • Low computational literacy

Work and task: • Low frequency of use • No training • Optional usage • Highly structured tasks

60

Menu design: relevant aspects

• Menu structure

• Option ordering

• Option selection

• Menu invocation

• Navigation

61

Menu design: guidelines

• Adequate the menu structure to the task structure

• Minimize depth increasing breadth (within reasonable limits)

• Use an adequate ordering method

• Be coherent (design, option names, etc.)

• Give selection feedback to the user

• Indicate unavailable options

• Include tooltips if names or icons are not auto-explanatory

• Etc. etc.

Menu design: guidelines

• Find the adequate structure using card sorting:

a low-cost method that helps understanding how users expect to find content or functionality

62 http://www.interaction-design.org/encyclopedia/card_sorting.html

Card sorting example: think about how to sort the fruits and vegetables sold in a supermarket

64

http://www.interaction-design.

org/encyclopedia/card_sorting.html

Direct Manipulation

Universidade de Aveiro

Departamento de Electrónica,

Telecomunicações e Informática

66

Direct manipulation (name coined by Shneiderman, 1982)

• Can be traced down to Sketchpad

• Actions are performed directly on

visual representations of the objects

• It is characterized by:

1- Continuous representation of objects

2- Physical actions instead of command languages

3- Fast, incremental actions with visible results

67

Direct manipulationI does not necessarily imply icons; however, in most

situations they are involved

Example: When a section of a text is selected and draged elsewhere icons are not used, yet an action is performed on a visual representation of an object (text section)

68

Some applications are adequate to use direct manipulation:

One of the earliest commercially available UI using Direct Manipulation (MacPaint)

69

70

• It does not exist a “pure” direct manipulation User Interface (UI)

• Direct manipulation is a quality which may be present in different degrees

• According to Hutchins, Hollan e Norman (1986) a UI has the following aspects:

semantic Distance

articulatory

conversation (command languages) Engagement

model worlds (direct manipulation)

71

Semantic and articulatory distance

• Semantic Distance – subjective distance between the user’s goal and interface semantics

• Articulatory distance – distance between the meaning of the actions and their physical form

72

Semantic Distance

If the objects and actions do not support the users’ goals, semantic distance is high

If the user wants to draw rectangles the application on the left has a smaller semantic distance

,

73

Articulatory Distance

When the physical way actions are performed is more similar to their meaning, articulatory distance is smaller

Dragging an icon corresponds to smaller articulatory distance

Selecting an option corresponds to a greater articulatory distance

74

• According to Wolf e Rhyne (1987) there are two relevant aspects in any user interaction:

Object specification Action specification name generation name generation (write a name) visual correlation visual correlation (select) gesture generation (draw a symbol) analogous action coded selection (write a command)

75

• Specifying objects by visual correlation implies the presence of direct manipulation

• How actions are specified defines the degree of direct manipulation

- direct UI

Objects Actions

visual correlation + name generation

visual correlation

analogous action

+ direct UI

76

Main advantages and disadvantages of direct manipulation UIs

Advantages (potential)

• Easy to learn and remember

• Direct, WYSIWYG

• Flexible, easily reversible actions

• Immediate visual and context feedback

• Less prone to errors

Disadvantages

• Not auto-explanatory

• May be inefficient

• Difficult to draw recognizable icons (particularly for actions)

• Icons occupy more screen real estate then text

77

Knowledge and experience:

• Moderate system experience

• Moderate to high task experience

• Frequent usage of other systems

• Low computational literacy

Work and task

• Low frequency of use

• Moderate training

• Optional usage

• Low structured tasks

User profile to whom direct manipulation is adequate:

78

Direct Manipulation design: guidelines

Minimize articulatory and semantic distance

General guidelines to design a usable UI:

• Coherence

• Good conceptual model

• Feedback

• Adequate organization of functionality

• Adequate screen layout

• Adequate colour usage

• Adequate error handling

• Etc.

79

Coherent Icon scheme

better:

Visual selection feedback

80

Coherent Icon scheme

Melhor:

Adding names

(+ recognizable)

Visual selection feedback

better: same scheme Different schemes:

81

Express relation through icon similarity

Coherence in the icons production scheme

folders

Same type of file

82

Add names to icons to make them more recognizable

Allow name definition

83

Icons must be conceptually and visually distinctive

Conceptually similar icons

84

Icons should be specific/familiar not abstract/non-familiar

Familiar Icons?

85

Express objects attributes through icons

full empty

Better:

Natural language

Universidade de Aveiro

Departamento de Electrónica,

Telecomunicações e Informática

87

Natural language

• Communication between humans and computers

through natural language involves:

- recognition

- generation

• Natural languages as dialog style are not full blown natural languages, they are restricted natural languages

• Natural languages (as dialog style) differ in “habitability” (how easy and natural is it for users)

Note: It still is not possible to maintain

A conversation with a computer as in

2001 A Space Odyssey

Note:

natural language as a dialog style and voice interaction are different things!

88

• Habitability (mismatch between the users' expectations and the capabilities of a natural language) is related to the language domains:

– Conceptual - the set of objects and actions provided by the language

– Functional – what may be directly expressed by the language

– Syntactic – syntactic forms that may be understood

– Lexical - the variety of words that may be understood

• Conceptual model limitations are not very disturbing; however, limitations in any other domain make the language less habitable

89

Example:

• Imagine an information system of a University including a data base with information about employees that may be accessed using a natural language:

- Conceptual domain: information about employees

- The question “What is the salary of the University Restaurant manager?” may be out of the functional domain and imply two questions due to functional domain limitations:

• “Who is the University Restaurant manager?” (answer: Mr. XXX)

• “What is the salary of Mr. XXX?”

- “What is the salary of Mr. XXX?” may not be recognized (due to syntactic domain limitations) even if the information is stored in the DB

- “What are the wages of Mr. XXX?” may not be recognized due to lexical domain limitations if wages does not belong to the language

92

Main advantages and disadvantages of Natural Language dialog style

Advantages (potential) • Powerful • Flexible • Efficient

Disadvantages • Assume problem domain knowledge • Imply clarification dialogs • Imply typing skills (if written) • Improvements are not visible • May create unrealistic expectations, foster irresponsible behaviours and

generate negative reactions • Difficult and expensive to implement

93

User profile to whom Natural languages are adequate

Knowledge and experience High tasks experience Low application experience Low computer literacy High typing skill (if written) Task characteristics Low frequency of use No or little training Optional use

94

Current examples

IBM's CIMA (Conversational Interaction Management Architecture) Mobile phone intelligent personal assistants - Siri for Apple’s iOS - Google Now (2012)

Interesting Links

• http://domino.research.ibm.com/odis/odis.nsf/pages/focus.05.html

(retrieved April 14/2013)

• http://www.apple.com/ios/siri/

(retrieved April 14/2013)

• http://www.ibtimes.com/how-siri-works-iphones-brain-comes-natural-language-processing-stanford-professors-teach-free-online#

(retrieved April 14/2013)

• https://play.google.com/store/apps/details?id=com.google.android.googlequicksearchbox

(retrieved April 14/2013)

95

96

A few Design guidelines

• Provide a (restrict) natural language habitable in all domains

• Define a subset of a (real) natural language using the Wizard of Oz method

• Generate valid outputs concerning the four domains (e.g. always use words that the system recognizes

Wizard of Oz prototyping

• A prototype that only works by having someone behind-the-scenes “pulling the levers and flipping the switches” (named after the classical film)

• A user interacts with an interface without knowing that the responses are

97 http://www.usabilityfirst.com/glossary/

The “wizard” was a “man behind-the-scene”

98

Examples of using the Wizard of Oz method in other situations

- Definition of a set of gestures

to use in games

(Höysniemi et al., 2005)

(Human-Computer Interaction /UA., 2013)

100

3D User Interfaces and interaction devices Prof. Paulo Dias

102

Main Bibliography for interaction styles

• B. Shneiderman, C. Plaisant, M. Cohen, S. Jacobs, Designing the User Interface- Strategies for Effective Human–Computer Interaction, 5th ed., Addison Wesley, 2010

• Mayhew, D., Principles and Guidelines in Software User Interface Design, Prentice Hall, 1992

• Soegaard, Mads, Interaction Styles, 2010 (Retrieved 9 March 2013) http://www.interactiondesign.org/encyclopedia/interaction_styles.html • Hudson, William, Card Sorting. In: Soegaard, Mads and Dam, Rikke Friis (eds.).

"The Encyclopedia of Human-Computer Interaction, 2nd Ed.". Aarhus, Denmark: The Interaction Design Foundation, 2010 (Retrieved 9 March 2013)

http://www.interaction-design.org/encyclopedia/card_sorting.html

103

Interactive system design

• Involves knowing:

Usability principles (independent from technology)

Usability paradigms (more technology dependent) • We must know the success examples (usability paradigms)

• Understand why they work (usability principles)

• Use the adequate methods (user-centered approach)

• And test, re-design, test, redesign … until we attain the usability goals

+ Adequate methods + Evaluation

Evaluation

Universidade de Aveiro Departamento de Electrónica, Telecomunicações e Informática

(Nielsen, 1993)

105

• Usability is, according to ISO 9241-11:

“the extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use”

How to measure it??

And evaluate interactive system?

108

“Traditional” Evaluation Methods

Heuristic Evaluation

• Analytical (without users) Cognitive Walkthrough inspection methods

Model based methods

Review methods

Observation usability tests

• Empirical (involving users) Query

Controlled Experiments

Formal methods Prof. José Creissac Campos

110

Assignment: product evaluation – presentation: Jan 5th, 2015

• Choose any (already deployed) application, system, device, …

• Define the potential users and context of use

• Define a list of tasks to be supported

• Prepare an evaluation protocol including:

- at least one traditional method (analytical or empirical)

- a formal method

• Submit a proposal until Dec 7th, to bss@ua.pt

111

Heuristic Evaluation (Nielsen and Molich 1990)

• A “discount usability engineering method” for quick, cheap, and easy evaluation of a UI design

• The most popular of the usability inspection methods

• It is a systematic inspection of a design for usability

• Meant to find the usability problems in the design so that they can be attended to as part of an iterative design process.

• Involves a small set of analysts judging the UI against a list of usability principles ("heuristics")

112

Usability heuristics

• It is possible to use different heuristic sets

• Nielsen proposed 10 general principles for interaction design:

Visibility of system status

Match between system and the real world

User control and freedom

Consistency and standards

Error prevention

Recognition rather than recall

Flexibility and efficiency of use

Aesthetic and minimalist design

Help users recognize, diagnose, and recover from errors

Help and documentation http://www.nngroup.com/articles/ten-usability-heuristics/

How to conduct Heuristic Evaluation

1- Each evaluator inspects the interface alone (not communicating among them)

giving for each problem found:

- a description (usability heuristic not followed)

- a severity rate

2- The results can be recorded as written reports or by having the evaluators verbalize their comments to an observer as they go through the interface

3- Findings are aggregated only after all evaluations have been completed

4- A list of problems (description/severity) is given to the development team

114

• This ensures independent and unbiased evaluations from each evaluator

• Written reports are formal records of the evaluation, but require an additional effort by the evaluators

• An observer adds to the overhead of each evaluation session, but reduces the evaluators workload and may help

• The final report should help the development team to prioritize what to fix (according to severity and cost of fix)

115

Determining the number of evaluators

• Individual evaluators can perform a heuristic evaluation on their own

• Fairly poor results are achieved when relying on single evaluators

• Averaged over six of Nielsen’s projects:

• Substantially better performance

is possible by aggregating the

evaluations from several evaluators

• More evaluators should be used when usability is critical or large payoffs can be expected

116

Example:

• Heuristic evaluation of a banking system:

– 19 evaluators

– 16 usability problems

black square - problem found

white square – not found

117

Conclusion : in general 3 to 5 evaluators seems reasonable

http://www.nngroup.com/articles/how-to-conduct-a-heuristic-evaluation/#sthash.OmTrV7Og.dpuf

HE advantages and disadvantages

• Easy and fast to use • Easy to generate fixes • Can be used is early phases

• Subjective • Requires some knowledge and experience • Does not allow a way to assess the quality of redesigns • Loosely structured; runs the risk of finding low-priority problems • Usability experts may be hard and expensive to come by • Differences between development team and evaluators may arise

118

Cognitive Walkthrough (Wharton, et al., 1992)

• Usability inspection method not involving users

• Based on the fact that users usually prefer to learn a system by using it (e.g., instead of studying a manual)

• Focused on assessing learnability (i.e., how easy it is for new users to accomplish tasks with the system)

• May produce results quickly at a low cost

• Applicable at early phases, before any coding

119

How to perform a cognitive walkthrough

1- Task analysis: sequence of steps or actions required by a user to accomplish a task, and the system responses

2- Designers and developers walkthrough as a group, asking themselves a set of questions at each step

3- Data gathering during the walkthrough: answering the questions for each subtask usability problems are detected

4- Report of potential issues

5- UI redesign to address the issues identified

120

CW Four questions:

• Will the user try to achieve the effect that the subtask has?

(Does the user understand this subtask is needed to reach the goal?)

• Will the user notice that the correct action is available?

(E.g. is the button visible?)

• Will the user understand that the wanted subtask can be achieved by the action?

(E.g. the button is visible but the user doesn’t understand the text and

will not click on it)

• Does the user get feedback?

Will the user know that they have done the right thing?

121

Common issues

• The evaluator doesn't know how to perform the task; the method involves the optimal sequence of actions

• Involves an extensive analysis and documentation and often too many potential issues are detected, resulting very time consuming

Thus:

Lighter variants of Cognitive Walkthrough were proposed to make it more applicable in S/W development companies

122

Streamlined Cognitive Walkthrough (Spencer, 2000)

- Will the user know what to do at this step?

- If the user does the right thing, will they know that they did the

right thing, and are making progress towards their goal?

123

• Only two questions:

• And a set of rules to streamlining the walkthrough and trade-off granularity for coverage

comprises the 3 first questions of CW

According to Spencer the method can be applied successfully if the usability specialist:

• takes care to prepare the team for the walkthrough,

• avoids design discussions during the walkthrough,

• explicitly neutralizes defensiveness among team members,

• streamlines the procedure by collapsing the first three questions into one question,

• and captures data selectively

124

Example: Evaluation of a desktop photocopier UI • Machine UI:

- numeric keypad,

- "Copy" button,

- push button on the back to turn on the power

The machine automatically turns itself off after 5 min inactivity

• Task: copy a single page

• User: any office worker

• Actions needed: turn on the power,

put the original on the machine,

press the "Copy" button

125

http://hcibib.org/tcuid/chap-4.html#4-1

Practice the Streamlined Cognitive Walkthrough:

• Look for a phone number at the University of Aveiro Web site

user: any student from the University

127

Look for a person’s phone number at the University of Aveiro Web site user: any student from the University

Task analysis:

- look for the icon (directório);

- input part of the person’s name and search

- get the phone number

But the defined user profile (any student from the University) includes foreign students, thus a previous action is needed:

- select the English version

For each action we need to ask the two questions and put ourselves in the shoes of the user!

128

First action: find the icon Q1 - Will the user know what to do at this step? Even reading the tooltip (directório) possibly the correct icon is not recognizable! Q2 - If the user does the right thing (selects the icon), will they know that they did the right thing, and are making progress towards their goal? Probably yes; this looks a familiar search bar and it is adequatly labeled (lista telefónica; pesquisar)

129

Second action: input part of the person’s name

Q1 - Will the user know what to do at this step? Probably yes; the tooltip lets the user know he/she should input the person’s name and select “pesquisar” Q2 - If the user does the right thing (selects the icon), will they know that they did the right thing, and are making progress towards their goal?

Probably yes; however, some users might not recogize 24117 as a phone number (it only has 5 digits, as it is internal, and not 9 as possibly expected)

130

Limitations of Analytical Methods

– Are subjective

– Involve several usability experts

– Cannot find all usability problems

Thus, empirical methods (involving users) are needed

observation

query

controlled experiments (scientific approach)

132

Usability test (engineering approach)

Ethics in applying empirical methods

Involving users implies specific cautions:

– Asking for explicit consent

– Confidentiality

– Security (avoid any risk)

– Freedom (users may give up at any time)

– Limit stress

It’s the system that is under evaluation not the user!

133

Observation

Has many variants from very simple

to very complex and expensive:

• Direct: observer takes notes

• Undirect: through audio/ vídeo – more complex and time consuming

• Think Aloud: users are asked to explain what they are doing

• Logging: users activity is logged by the system

• Combinations of the previous, etc

134

Query

• Two main variants:

– Questionnaire (reach more people; less flexible)

– Interview

• Should be carefully prepared and tested

• Collected data should be carefully analyzed

135

Controlled experiments

• The work horse of science ...

• Have a complex logistics

• Should involve a statistics consultant

• Important issues to consider:

– Hypothesis

– Variables (input or independent; output or dependent)

– Secondary variables

– Experimental design (within groups; between groups)

– Participants (number, profile)

– Statistics 136

Usability tests

• Involve observation and query

• Main aspects:

– Participants

– Tasks

– Test facilities and systems

– Experimental design

– Usability measures

– Data analysis

• Have a complex logistics

• Standard: Common Industry Format (CIF) for usability test reports

137

Participants

138

• The total number of participants to be tested

(a valid statistical analysis implies a sufficient number of subjects)

• Segmentation of user groups tested, if more than one

• Key characteristics and capabilities of user group

(user profile: age, gender, computing experience, product experience, etc.)

• How to select participants

• Differences between the participant sample and the user population

(e.g. actual users might have training whereas test subjects were untrained)

Tasks

139

• The task scenarios for testing

• Why these tasks were selected

(e.g. the most frequent tasks, the most troublesome tasks)

• The source of these tasks

(e.g. observation of users using similar products, product specifications)

• Any task data given to the participants

• Completion or performance criteria established for each task

(e.g. n. of clicks < N, time limit)

Test Facilities and equipment

• The setting and type of space in which the evaluation will be done (e.g. usability lab, cubicle office, meeting room, home office, home family room, manufacturing floor, etc.)

• Any relevant features or circumstances that can affect the results (e.g. video and audio recording equipment, one-way mirrors, or automatic data collection equipment)

• Participant’s Computing Environment (e.g. computer configuration, including model, OS version, required libraries or settings, browser name and version; relevant plug-in, etc. )

• Display and input devices characteristics

• Any questionnaires to be used

140

Experimental design

• Procedure: the logical design of the test

• Participant general instructions and task instructions

• The independent variables and control variables

• The usability measures to be used: – a) for effectiveness (completeness rate, errors, assists)

– b) for efficiency (times)

– c) for satisfaction

141

Common Industry Format (CIF) for usability test reports ISO/IEC 25062:2006

• Specifies the format for reporting the results of a summative evaluation

• The most common type of usability evaluation is formative, (i.e. designed to identify problems that can be fixed)

• A summative evaluation produces usability metrics that describe how usable a product is when used in a particular context of use

• The CIF report format and metrics are consistent with the ISO 9241-11 http://www.usabilitynet.org/prue/cif.htm

http://zing.ncsl.nist.gov/iusr/

• Top ten things to know about the CIF (a list of do and don’t) http://zing.ncsl.nist.gov/iusr/top_ten.html

142

Heuristic Evaluation

• Perform the heuristic evaluation using the 10 Nielsen’s heuristics or any other set you deem more specific to your case

• Prepare a report including:

– Brief description of the product and its target users

– the usability problems description (preferably illustrated)

– their severity rates

• Ask a colleague to perform the evaluation

• Observe, take notes and prepare a report merging results of both analysis

143

Usability test

• Choose a set of usability measures (times, errors, complete rates…)

• Prepare all the documentation:

- list of tasks and perceived difficulty

- final questionnaire

- list of tasks for the observer to take notes

• Run a pilot test

144

To the user

To the observer

Controlled experiment

• Define an hypothesis

• Define the input, output and secondary variables

• Define experimental design

• Prepare all the documentation:

- list of tasks and perceived difficulty

- final questionnaire

- list of tasks for the observer to take notes

• Run a pilot test

145

To the user

To the observer

Example: comparing two selection techniques for a Virtual Environment

- Head Selection - Laser poiter

• Null Hypothesis: both are equally usable In the used conditions

• Input variable: selection technique • Output variables: performance and satisfaction

• Participants: 16 volunteers

• Experimental design: within groups

Danilo Souza, Paulo Dias, Beatriz Sousa Santos. “Choosing a Selection Technique for a Virtual Environment”. Virtual, Augmented and Mixed Reality. Designing and Developing Virtual and Augmented Environments, Lecture Notes in Computer Science, Volume 8525, 2014, pp 215-225, http://link.springer.com/chapter/10.1007%2F978-3-319-07458-0_21

• Protocol:

– Brief explanation

– Training cycle was performed right before each selection cycle

– Selections at different distances ( 5 to 70 meters)

– 56 selections; half for each method

– Test activation by the participants at every step

– Errors and times

• Main results

HS was better a

147

148

0

2

4

6

8

10

12

14

16

5 10 15 20 25 30 35 40 45 50 55 60 65 70

Erro

rs

Distance (m)

SOC

LP

0

0,5

1

1,5

2

2,5

3

3,5

4

4,5

5 10 15 20 25 30 35 40 45 50 55 60 65 70

Ave

rage

Tim

e E

lap

sed

(s)

Distance (m)

SHO

LP

Bibliography – Books and links

- Alan Dix, Janet Finlay, Gregory Abowd, Russell Beale, Human-Computer Interaction, 3rd

edition, Prentice Hall, 2004

- Ben Shneiderman, C. Plaisant, M. Cohen, and S. Jacobs, Designing the User Interface:

Strategies for Effective Human-Computer Interaction , 5th ed., Addison-Wesley, 2009

- Jenny Preece, Yvonne Rogers, Helen Sharp, D. Benyon, S. Holland, T. Carey, Human-

Computer Interaction, Addison Wesley, 1994

- The Encyclopedia of Human-Computer Interaction, 2nd Ed,, Aarhus, Denmark: The

Interaction Design Foundation. Interaction Design Foundation, 2013 http://www.interaction-

design.org/books/hci.html

- Jackob Nielsen, Usability Engineering, Morgan Kaufmann, 1993

- Peter Mitchell, A Step-by-step Guide to Usability Testing, iUniverse, 2007

- Ian Sommerville, Software Engineering, 9th ed., Addison Wesley, 2010 (chp. 29)

http://ifs.host.cs.st-

andrews.ac.uk/Books/SE9/WebChapters/PDF/Ch_29%20Interaction_design.pdf

Bibliography – links

- Gilbert Cockton, Usability Evaluation. In: Soegaard, Mads and Dam, Rikke Friis (eds.), The

Encyclopedia of Human-Computer Interaction, 2nd Ed, 2013, Aarhus, Denmark: The

Interaction Design Foundation. (retrieved March, 10, 2013)

http://www.interaction-design.org/encyclopedia/usability_evaluation.html

- Norman/ Nielsen Group - http://www.nngroup.com/articles/

- User Focus - http://www.userfocus.co.uk/resources/iso9241/futureparts.html

- Standard ISO 9241-11 - Ergonomic requirements for office work with visual display

terminals Part 11 : Guidance on usability

- Standard ISO/IEC 25062:2006 – CIF - Common Industry format for Usability Tests Report

- What is CIF? - http://www.usabilitynet.org/prue/cif.htm

- UXPA Code of Professional Conduct

http://www.usabilityprofessionals.org/about_upa/leadership/code_of_conduct.html

152