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 Interactionthe human factor



“The world is divided into peoplewho think that they’re right.”

Diedre McGrath



Reality

Multiple interaction idiomsJenifer Tidwell, 2006



Reality

Multiple interaction idioms

many familiar types/styles of user interfaces



Reality



command-line languagesinstructions, 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


formstext editors

graphic editorsspreadsheets

Web browserscalendars



Reality


multimedia playerscharts

immersive gamesWeb pages

social (virtual) environmentse-commerce/e-business applications



Reality

Heterogeneity of existing platformsJean Vanderdonckt, 2006



Reality

Heterogeneity of existing platforms

desktop (personal) computersmobile 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 tasksJean Vanderdonckt, 2006



Reality

Variety of performed tasks

Nokia findings in the mobile context (2007):blogging, browsing, chatting, downloading, e-banking,

instant messaging, playing games,searching: locations, people,…



Reality

Variety of performed tasks

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



Reality

Multiple contextsJean Vanderdonckt, 2006



Reality

Multiple contexts

at work

examples: business & office applications, IDEs, tools, etc.



Reality

Multiple contexts

at home

examples: entertainment & leisure softwaremultimedia players, social networks, games,…



Reality

Multiple contexts

during travelling

examples: PIMs, planners, geo-related services,instant messaging software, recommenders,…



Reality

Multiple contexts

specific locationsconcert places, hospitals, malls, restaurants,…

examples: “smart” apps/services provided bymobile 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 diversityJean Vanderdonckt, 2006



Reality

User volume and diversity

traditional usersa 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 acquisitionof a product/service



Knowing users…


is using the product/serviceprovided 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 presentationor 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 computersor the target platform – e.g., a specific game console



Knowing users…


computer-related abilities

aspect of interest:technophobic persons



Knowing users…


skills

readingusing devices – keyboard, mouse, remote control,…

interpreting the outputetc.



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 regardingthe 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 communicationservices 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 formatscharts

rich versus limited data/interactionsearch possibilities

filteringreusing – e.g., sharing data to other apps/services

etc.

discussion



Knowing users…


techniques:user surveysinterviews

(in)direct observations: user tracking, feedbackreal user testing



Knowing users…


techniques:user surveysinterviews

(in)direct observations: user tracking, feedbackreal user testing

user research



Knowing users…

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



Knowing users…

Remark:

a software application could havemultiple audiences



Knowing users…

Remark (Rogers, 2007):

there are few caseswhen users really know what they want



Knowing users…

Remark (Rogers, 2007):

“natural” tasks must be anticipated by softwareon the basis of the perceived users’ behavior



Knowing users…

Remark (Raskin, 2000):

few persons could pretend that newer productsare 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


Dr. Sabin-Corneliu Buraga – www.purl.org/net/busacowww.flickr.com/groups/insults/



Knowing users…

Laws of human-computer interaction(Jeff Raskin, 2000)

a computer shall not waste your time orrequire you to do more work

than is strictly necessary



Knowing users…

User InterfaceHumane Interface(Raskin, 2000)

an interface is humane if it is responsive tohuman needs and considerate of human frailties



Knowing users…

User InterfaceHumane Interface(Raskin, 2000)

an interface is humane if it is responsive tohuman 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 processto 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 beaddressed as the dominant problem in almost

all processes of software design, implementation,and maintenance

Wang, 2008



Cognition

Cognitive informatics

Wang, 2002



Cognition

Important aspects:

knowledgebehaviorsexperience

skills



Cognition

Important aspects:

knowledgebehaviorsexperience

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 = imagesno 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 = soundscapacity: ~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 contextspatial and/or temporal data

influence over long-term memory




Chunk = perceptual/cognitive unit




Chunk division – e.g., grouping – depends onthe user background knowledge and

how data is presented




Chunk division – e.g., grouping – depends onthe 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 digitsuses 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 memoriesMemento (2000): http://www.imdb.com/title/tt0209144/




Long-time memory:

elaborate repetitions move chunksfrom working memory to long-time memory

via connections (associations) with other chunks




Long-time memory:

elaborate repetitions move chunksfrom working memory to long-time memory

via connections (associations) with other chunks

influenced by context




Recognition versus recall

representations must easily beperceived 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 modifyexisting (mental, internal) representations





users tend to annotate things

using external means to modifyexisting (mental, internal) representations

examples:underlining words, taking written/electronic notes,…





cognitive tracing

implies external manipulation of thingsin order to (re)structure or (re)arrange them





cognitive tracing

implies external manipulation of thingsin order to (re)structure or (re)arrange them

examples:scrabble, bookmarking, tagging, etc.




discussion





UIs must offer external representations ofthe 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 designAlan 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 trackmultiple input communication channels

in sequential manner only




Attention

visual attention is more importantthan 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



bookpainting

balletpenguin

astringentmelon

Please, indicate the color of each word:



greenyellowwhite

magentared

blue




greenyellowwhite

magentared

blue


interferences – the Stroup effect



Cognition

Cognitive processor

the brain compares stimuli and selects a response



human-computerinteraction






human-computer

interaction


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



Cognition

Cognitive processor

the decision making process is based onskills, 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 + 46LXXIV + XLVI

in your headby using a piece of paper

with a calculator



experiment

Try to compute the two mathematical expressions below:

74 + 46LXXIV + XLVI

in your headby using a piece of paper

with a calculator

Which is easiest and why?



Cognition

User multi-tasking

attention is a resource that could be sharedin 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 processorversus

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

autonomicsending 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 perceivedand compared to the desired result

cycle time: ~240 ms



Cognition

cognitive conscious

versus

cognitive unconscious



Property Conscious Unconscious

Engaged byNovelty

EmergenciesDanger

RepetitionExpected Events

Safety

Used in New circumstances Routine situations

Can handle DecisionsNonbranching

tasks

Accepts Logical propositionsLogic 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 dynamicsymbols as shapes and not as their meanings

common phonetic replacements + inconsistenciesmany 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 2013www.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 toa 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 makea 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 througha “tunnel” having the length D and width S

S

D



Empirical laws

Steering Law

T = a + b * D/S

the difficulty varies linearly, not logarithmicguiding 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, 1999www.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 regardingthe necessities and goals of each user category



Persona

Important aspects:age, abilities, ethnicity, social context, etc.

user profile


Dr. Sabin-Corneliu Buraga – www.purl.org/net/busacoA. 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 templatehttp://profs.info.uaic.ro/~stefan.negru/personas/



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



Persona

Remarks (Donald Norman, 2004)

the purpose of the persona is to add empathetic focusto the design

the personas must reflect the target groupfor 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. userStressed 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

Design

humancomputer interaction

sabincorneliu buraga

software engineering

human factor

reality variety

tasks jean vanderdonckt

tasks domainoriented

socialoriented devices