HCI 2014 (2 of 10): Human Factor. Users

Master on Software Engineering :: Human-Computer Interaction
Dr. Sabin-Corneliu Buraga – www.purl.org/net/busaco
Human-Computer Interaction
the human factor

“The world is divided into people
who think that they’re right.”
Diedre McGrath

Reality
Multiple interaction idioms
Jenifer Tidwell, 2006

Reality
many familiar types/styles of user interfaces

Reality
command-line languages
instructions, keywords, abbreviations, special symbols,
I/O mechanisms

Reality
a classical UNIX console – see @climagic on Twitter

Reality
interactive forms + spreadsheets

Reality
menus

pop-up menus

Reality
direct manipulation + hypertext

Reality
natural interaction
typical examples: gestures, natural language (e.g., speech)

Reality
each has its own vocabulary of items, actions,
sensorial – e.g., visual, auditory – representations

Reality
each has its own vocabulary of items, actions,
sensorial – e.g., visual, auditory – representations
user experience (UX)

Reality
forms
text editors
graphic editors
spreadsheets
Web browsers
calendars

Reality
multimedia players
charts
immersive games
Web pages
social (virtual) environments
e-commerce/e-business applications

Reality
Heterogeneity of existing platforms
Jean Vanderdonckt, 2006

Reality
Heterogeneity of existing platforms
desktop (personal) computers
mobile devices: PDA, smartphone, tablet, automobile
output means: printer, fax, advertising screen etc.
home appliances – e.g., (smart) TV, washing machine,…
social-oriented devices: ATM, info kiosk, photo booth
entertainment platforms – e.g., Blu-ray player, Wii, XBox

Reality
Variety of performed tasks

Reality
Nokia findings in the mobile context (2007):
blogging, browsing, chatting, downloading, e-banking,
instant messaging, playing games,
searching: locations, people,…

Reality
domain-oriented tasks:
business, programming, research, studying, training etc.

Reality
Multiple contexts

Reality
Multiple contexts
at work
examples: business & office applications, IDEs, tools, etc.

Reality
Multiple contexts
at home
examples: entertainment & leisure software
multimedia players, social networks, games,…

Reality
Multiple contexts
during travelling
examples: PIMs, planners, geo-related services,
instant messaging software, recommenders,…

Reality
Multiple contexts
specific locations
concert places, hospitals, malls, restaurants,…
examples: “smart” apps/services provided by
mobile devices/appliances

In which context, tablet computers
(and related devices) could be the best choice?
case study: iPad – http://pttrns.com/ipad
discussion

Reality
User volume and diversity

Reality
User volume and diversity
traditional users
a community of interest vs. population of a country
+
special users
having certain disabilities and/or needs

How about users?

Knowing users…
Who is the user?

Knowing users…
Probably, we do not like her/him!

Knowing users…
We must discuss with her/him

Knowing users…
We need to observe her/him
RUM (real user monitoring)

Knowing users…
The user is the person who…
directly interact to the (software) product/service

Knowing users…
involve others to use the product/service

Knowing users…
obtain output from a given product/service

Knowing users…
is making decisions regarding the acquisition
of a product/service

Knowing users…
is using the product/service
provided by our competitor

Knowing users…
User types (Eason, 1987)
primary
directly involved in the use of the product
(frequent hands-on beneficiary)

Knowing users…
secondary
occasionally and/or indirectly uses the product/service

Knowing users…
tertiary
affected by a product/service presentation
or influenced by a certain product/service

Knowing users…
Identifying characteristics of the user population
demographics
age, gender, ethnicity
+
psychological profile

Knowing users…
education
elementary school vs. doctoral studies

Knowing users…
physical abilities
senses & perception – e.g., visual acuity
(short/long-term) memory
anatomic features: length of arms, height, muscles,…

Knowing users…
computer-related abilities
general knowledge regarding the use of computers
or the target platform – e.g., a specific game console

Knowing users…
computer-related abilities
aspect of interest:
technophobic persons

Knowing users…
skills
reading
using devices – keyboard, mouse, remote control,…
interpreting the output
etc.

Knowing users…
experience related to the application domain

Users without prior knowledge about
semantic Web can understand
and employ this user interface?

Knowing users…
experience regarding
the type of (software) product/service

Knowing users…
working environment
+
other social factors

Knowing users…
relations with other persons
+
the use of communication patterns (1:1, 1:n, m:n)

Web application providing online communication
services used in the context of winter Olympic games
discussion

user population
main user categories: athletes, their friends & families,
administration personnel, audience, sport reporters,…
discussion

interaction
types of devices: desktop PCs, mobile phones,
info kiosks, public screens,
Web-friendly devices (smart phones, tablets),…
discussion

conveying information
multiple formats
charts
rich versus limited data/interaction
search possibilities
filtering
reusing – e.g., sharing data to other apps/services
etc.
discussion

Knowing users…
techniques:
user surveys
interviews
(in)direct observations: user tracking, feedback
real user testing

Knowing users…
techniques:
user surveys
interviews
(in)direct observations: user tracking, feedback
real user testing
user research

Knowing users…
see also http://alistapart.com/topic/user-research

Knowing users…
Remark:
a software application could have
multiple audiences

Knowing users…
Remark (Rogers, 2007):
there are few cases
when users really know what they want

Knowing users…
Remark (Rogers, 2007):
“natural” tasks must be anticipated by software
on the basis of the perceived users’ behavior

Knowing users…
Remark (Raskin, 2000):
few persons could pretend that newer products
are easier to be used than old ones

Knowing users…
Laws of human-computer interaction
(Jeff Raskin, 2000)
a computer shall not harm your work or,
through inaction, allow your work
to come to harm

www.flickr.com/groups/insults/

Knowing users…
Laws of human-computer interaction
(Jeff Raskin, 2000)
a computer shall not waste your time or
require you to do more work
than is strictly necessary

Knowing users…
User InterfaceHumane Interface
(Raskin, 2000)
an interface is humane if it is responsive to
human needs and considerate of human frailties

Knowing users…
User InterfaceHumane Interface
(Raskin, 2000)
an interface is humane if it is responsive to
human needs and considerate of human frailties
existing UIs are too complex for the majority of users

Utilizatorii
thanks to our graduate Alexandru Rugină

Can we model users?

Cognition
Cognition is a knowledge acquisition process
to understand the external world
via sensation, perception, and reasoning
Wang, 2008

Cognition
Cognitive engineering is a software engineering
principle that states the cognitive complexity and
human intelligent manageability should be
addressed as the dominant problem in almost
all processes of software design, implementation,
and maintenance
Wang, 2008

Cognition
Cognitive informatics
Wang, 2002

Cognition
Important aspects:
knowledge
behaviors
experience
skills

Cognition
Important aspects:
knowledge
behaviors
experience
skills
modeling the user

Cognition
Cognitive abilities define, in an abstract manner,
the model of a user

Utilizatorii

Cognition
Card, Moran & Newell, 1983; Wickens, 1984

Cognition
Memory
short-term (working) memory
+
long-term memory

Cognition
Memory
data codification
types of stored things, associations

Cognition
Memory
capacity
number of remembered things

Cognition
Memory
duration (decay time)
how long a thing persists into memory

Cognition
Memory
visual data
codification = images
no pixels, but physical properties: edges, curves, lengths
capacity: ~17 (e.g., 7—17 symbols)
decay: ~200 ms

the need of visual representation
http://www.interaction-design.org/encyclopedia/visual_representation.html
RDFSpecies by C. Serban & D. A. Popovici (2012)

Cognition
Memory
audio data
codification = sounds
capacity: ~5
decay: ~1500 ms

Cognition
Memory
audio data is pre-intentional
“What you’re saying?...”

Cognition: perception
Bottom-up perception
uses stimuli

Top-down perception
based on context
spatial and/or temporal data
influence over long-term memory

Chunk = perceptual/cognitive unit

Chunk division – e.g., grouping – depends on
the user background knowledge and
how data is presented

Chunk division – e.g., grouping – depends on
the user background knowledge and
how data is presented
remember IA?

Common technique:
TLA (Three-Letter Acronyms)

Chunking – example:
B M W R C A A O L I B M F B I
MWR CAA OLI BMF BIB
BMW RCA AOL IBM FBI

Common technique:
the codification of unrelated digits
uses 2—4 chunks

Users memorize phone numbers by grouping:
0232201090
0232 20 10 90

Working memory:
capacity: 7 ± 2 chunks – George Miller
decay: 7 sec. (5—226 sec.)repetitions

Working memory:
capacity: 7 ± 2 chunks – George Miller
decay: 7 sec. (5—226 sec.)repetitions
influenced by interferences

anterograde amnesia – inability to store new memories
Memento (2000): http://www.imdb.com/title/tt0209144/

Long-time memory:
elaborate repetitions move chunks
from working memory to long-time memory
via connections (associations) with other chunks

Long-time memory:
elaborate repetitions move chunks
from working memory to long-time memory
via connections (associations) with other chunks
influenced by context

Recognition versus recall
representations must easily be
perceived and recognized
metaphors + idioms

from icons & symbols to visual metaphors
discussion

humans remember visual properties of things
e.g., color, shape,…

humans have difficulties in memorizing/recalling
arbitrary data
e.g., phone numbers, software serial numbers

UIs must facilitate recognition

users tend to annotate things
using external means to modify
existing (mental, internal) representations

users tend to annotate things
using external means to modify
existing (mental, internal) representations
examples:
underlining words, taking written/electronic notes,…

cognitive tracing
implies external manipulation of things
in order to (re)structure or (re)arrange them

cognitive tracing
implies external manipulation of things
in order to (re)structure or (re)arrange them
examples:
scrabble, bookmarking, tagging, etc.

discussion

UIs must offer external representations of
the concepts used by the software
decreasing the cognitive overload

Graphic
Resources
Correspondence Design Uses
Marks
Shape
Orientation
Size
Texture
Saturation
Color
Line
Literal
(visual imitation of
physical features)
Mapping
(quantity,
relative scale)
Conventional
(arbitrary)
Mark position,
identify category
(shape, texture color)
Indicate direction
(orientation, line)
Express magnitude
(saturation, size, length)
Simple symbols and
color codes
graphical representations in the context of UI design
Alan Blackwell (2011)

Graphic
Resources
Symbols
Geometric
elements
Letter forms
Logos and
icons
Picture
elements
Connective
elements
Topological (linking)
Depictive
(pictorial conventions)
Figurative
(metonym, visual puns)
Connotative
(professional and
cultural association)
Acquired
Texts and symbolic
calculi
Diagram elements
Branding
Visual rhetoric
Definition of
regions

Graphic
Resources
Regions
Alignment
grids
Borders and
frames
Area fills
White space
Gestalt
integration
Containment
Separation
Framing
(composition,
photography)
Layering
Identifying shared
membership
Segregating or
nesting multiple
surface conventions
in panels
Accommodating
labels, captions
or legends

Graphic
Resources
Surfaces
The plane
Material object
on which the
marks are
imposed
(paper, stone)
Mounting,
orientation and
display context
Display medium
Literal (map)
Euclidean
(scale and angle)
Metrical
(quantitative axes)
Juxtaposed or ordered
(regions, catalogues)
Image-schematic
Embodied/situated
Typographic
layouts
Graphs & charts
Relational diagrams
Visual interfaces
Secondary
notations
Signs and displays

http://worrydream.com/

Attention
humans can focus
– using their perceptual processor –
on a single input channel at a given moment

Attention
humans can focus
– using their perceptual processor –
on a single input channel at a given moment
spotlight metaphor

Attention
the spotlight could track
multiple input communication channels
in sequential manner only

Attention
visual attention is more important
than the aural one

Attention
within a input channel,
the stimuli are processed in parallel

Attention
within a input channel,
the stimuli are processed in parallel
interferences

book
painting
ballet
penguin
astringent
melon
Please, indicate the color of each word:

green
yellow
white
magenta
red
blue

green
yellow
white
magenta
red
blue
interferences – the Stroup effect

Cognition
Cognitive processor
the brain compares stimuli and selects a response

human-computer
interaction
human-computer
interaction
human-computer
interaction
human-computer
interaction
human-computer
interaction
human-computer
interaction
human-computer
interaction
human-computer
interaction
for details, see www.slideshare.net/andresbaravalle/im2044-week-2-lecture

Cognition
Cognitive processor
the decision making process is based on
skills, rules, and knowledge

Cognition
Cognitive processor
skill-based decision making
learning by doing: walking, talking, driving, etc.

Cognition
Cognitive processor
skill-based decision making
learning by doing: walking, talking, driving, etc.
influenced by age

Cognition
Cognitive processor
rule-based decision making
e.g., social rules of proper manners
If I’ll see an elderly person, then I’ll politely say “Hello”.

Cognition
Cognitive processor
rule-based decision making
e.g., social rules of proper manners
cultural factors
could be important

Cognition
Cognitive processor
knowledge-based decision making
uses the prior background knowledge,
even in unfamiliar/unexpected situations

experiment
Try to compute the two mathematical expressions below:
74 + 46
LXXIV + XLVI
in your head
by using a piece of paper
with a calculator

experiment
Try to compute the two mathematical expressions below:
74 + 46
LXXIV + XLVI
in your head
by using a piece of paper
with a calculator
Which is easiest and why?

Cognition
User multi-tasking
attention is a resource that could be shared
in order to perform multiple activities
in the same time

Cognition
User multi-tasking
depends on the activity structure:
multi-modality
e.g., visual + auditory + tactile interaction

Cognition
User multi-tasking
codification
e.g., spatial data versus spoken data

Cognition
User multi-tasking
involved components
using perceptual/cognitive processor
versus
motor processor

Cognition
User multi-tasking
involved components
example:
playing chess versus pinball

Cognition
User multi-tasking
depends on the difficulty:
well-practiced tasks are more easily performed

Cognition
User multi-tasking
depends on the difficulty:
well-practiced tasks are more easily performed
example: it’s easier to ride the bike on an empty street

Cognition
Motor processor
open-loop control
autonomic
sending the same directives to the muscles
no feedback from perceptual processor
cycle time: ~70 ms

Cognition
Motor processor
close-loop control
muscles movements – or their effects – are perceived
and compared to the desired result
cycle time: ~240 ms

Cognition
cognitive conscious
versus
cognitive unconscious

Property Conscious Unconscious
Engaged by
Novelty
Emergencies
Danger
Repetition
Expected Events
Safety
Used in New circumstances Routine situations
Can handle Decisions
Nonbranching
tasks
Accepts Logical propositions
Logic or
inconsistencies
Operates Sequentially Simultaneously
Controls Volition Habits
Capacity Tiny Huge
Persists for Tenths of seconds Decades (lifelong)
Jef Raskin, The Humane Interface, Addison Wesley, 2000

Cognition
Distributed cognition
(Edwin Hutchins, 1995)
cognitive resources are shared socially in order
to extend individual cognitive resources or
to accomplish something that an individual agent
could not achieve alone

Cognition
http://hci.ucsd.edu/hutchins/dcogAviation.html

Guidelines (William Gribbons, ‘08)
Reading:
place information and instruction in context
employ lists
chunk information
present content in sequence

Reading:
maintain consistency in language and procedures
highlight critical/new information, information structure
use familiar terms, and avoid acronyms and jargon

Leet (1337) speak
like other languages, 1337 is dynamic
symbols as shapes and not as their meanings
common phonetic replacements + inconsistencies
many acronyms and random capitalization
discussion
M. Perea, J. Duñabeitia, M. Carreiras, “R34D1NG
W0RD5 W1TH NUMB3R5”, Journal of Experimental
Psychology: Human Perception and Performance, 2007

Reading:
use illustrations to complement text
avoid the gratuitous use of animations & other movement
use familiar typefaces

Reading:
allow user control to repeat output
avoid background noise with auditory output
maintain higher contrast

Memory:
leverage existing knowledge, behaviors, and tasks
avoid splitting attention between two tasks
focus on the user goals
limit information and features to what is really needed

discussion
Worst Websites of 2013
www.webpagesthatsuck.com/worst-websites-of-2013.html

Memory:
partition tasks in reasonably sized groups
support mental calculations, decisions, and comparisons
limit choices

Memory:
complete information automatically in forms & fields
use mnemonics
minimize screen clutter

Memory:
provide extra time for tasks
eliminate the anxiety of timeouts
provide reminders

Empirical laws
Fitts’ Law (1954)
predicts the pointing (movement) average time as
a function of the distance to and
width of the given target

Empirical laws
Fitts’ Law (1954)
how fast we can move the mouse to point to
a given UI component having a specific size

Empirical laws
Fitts’ Law (1954)
T = a + b * log2 (2*D / S)
T = time, D = distance, S = size

Empirical laws
Fitts’ Law (1954)
consequence:
Mac OS X menu is more ergonomic
than the main menu of each window in Windows

Empirical laws
Fitts’ Law (1954)
consequence:
pie menus are more easily to be used
than pop-up linear ones

Empirical laws
Hick’s Law (1952)
predicts the decision time for a set of choices
(e.g., in a menu)

Empirical laws
Hick’s Law
T = b*log2 (n + 1)
T = average reaction time (entropy of the decision),
n = number of equally probably alternatives,
b = a constant to be empirically determined

discussion
Hick’s law in the context of wizard (anti)pattern
http://designinginterfaces.com/patterns/wizard/

Empirical laws
Hick’s Law
example – measuring the user’s reaction time:
if a Web page has ~70 links, then the time used to make
a choice (i.e., visiting a link) will be ~105 seconds (70*1.5)

the more choices are eliminated,
the more enjoyable the experience will be

discussion
reducing the
number of choices
Twitter’s frontpage
(2010 vs. 2013)

Empirical laws
Steering Law
predicting the time of moving the hand through
a “tunnel” having the length D and width S
S
D

Empirical laws
Steering Law
T = a + b * D/S
the difficulty varies linearly, not logarithmic
guiding the mouse is harder than pointing it

Empirical laws
Steering Law
consequence: cascading menus are hard to be used

Persona
By using laws and abstract models of the humans,
we can specify classes of users

personas

Persona
A precise description of the user of a system,
and of what (s)he wishes to accomplish
user archetype
Cooper, 1999
www.cooper.com/journal/personas/

Persona
Although personas are not real people,
they represent them throughout the design stage
(Blomkvist, 2002)

Persona
Although personas are not real people,
they represent them throughout the design stage
(Blomkvist, 2002)

creates a concrete profile of the typical user

Persona
Danger of the average users

Persona
The design must be performed regarding
the necessities and goals of each user category

Persona
Important aspects:
age, abilities, ethnicity, social context, etc.

user profile

A. Stanciu, I. Schiopu, A. Grigoriu, I. Lazar (2011) – aisquared.wordpress.com
Student Tourist Single (wo)man
Name Andreea G. Paul R. Ioana P.
Age 19 32 27
Location Iasi, Romania Paris, France Bucharest, Romania
Social Life
For her, going to university
was a challenge because she
had to leave home,
separate from her parents
and beginning the process
of finding her identity, as an
adult, and her place in the
world.
Because his earnings are
above average and because
he works at least 50 hours
per week, when he has
some free time he likes to
make the most of it.
She doesn’t have time for
dating wrong persons.
Work Life
She is a student in
her freshman year at
Computer Science.
He works as a software
developer, but now he
is on vacation.
She is a hard working
woman.
Goals
A new city meant new
people & new friends.
That is why she was glad to
take part of a Social Speed
event. From her point of
view, it’s a fun way to
He believes that the person
blesses the place. That is
way when he travels he
thinks it is very important
to know and understand
the residents. Because of
From her point of view, this
application is the perfect
combination between
online dating and real life
dating. She knew from the
start that this was not a

Student Tourist Single (wo)man
Name Andreea G. Paul R. Ioana P.
Age 19 32 27
Location Iasi, Romania Paris, France Bucharest, Romania
Social Life
For her, going to university
was a challenge because she
had to leave home,
separate from her parents
and beginning the process
of finding her identity, as an
adult, and her place in the
world.
Because his earnings are
above average and because
he works at least 50 hours
per week, when he has
some free time he likes to
make the most of it.
She doesn’t have time for
dating wrong persons.
Work Life
She is a student in
her freshman year at
Computer Science.
He works as a software
developer, but now he
is on vacation.
She is a hard working
woman.
Goals
A new city meant new
people & new friends.
That is why she was glad to
take part of a Social Speed
event. From her point of
view, it’s a fun way to
He believes that the person
blesses the place. That is
way when he travels he
thinks it is very important
to know and understand
the residents. Because of
From her point of view, this
application is the perfect
combination between
online dating and real life
dating. She knew from the
start that this was not a
a persona includes a name &
a photo, plus some demographics
A. Stanciu, I. Schiopu, A. Grigoriu, I. Lazar (2011) – aisquared.wordpress.com

microdata HTML5 template
http://profs.info.uaic.ro/~stefan.negru/personas/

personas for PaMI (Patient Monitoring Interface) project
A. Berila, A. Bulai, C. Chiric & M. Plesca, 2012

Persona
Remarks (Donald Norman, 2004)
the purpose of the persona is to add empathetic focus
to the design
the personas must reflect the target group
for the design team

discussion
It’s not important how smart users are;
it’s important to be effective
Stephen Turbek, 2011
www.boxesandarrows.com/view/are-your-users-s-t-u

discussion
S.T.U.P.I.D. user
Stressed Tired Untrained Passive Independent Distracted

S.M.A.R.T. design
Simply Memorable Accept autopilot
Recovery Test in realistic situations
www.boxesandarrows.com/view/are-your-users-s-t-u

human capacities, cognition,
modeling users, empirical laws, personas
“Conclusion”

next lecture: design models & methodologies

HCI 2014 (2 of 10): Human Factor. Users

Recomendados

Recomendados

Mais conteúdo relacionado

Mais procurados

Mais procurados (19)

Destaque

Destaque (9)

Semelhante a HCI 2014 (2 of 10): Human Factor. Users

Semelhante a HCI 2014 (2 of 10): Human Factor. Users (13)

Mais de Sabin Buraga

Mais de Sabin Buraga (20)

Último

Último (20)

HCI 2014 (2 of 10): Human Factor. Users