Human-Computer Interaction 4. Human models Dr. Sunyoung Kim School - - PowerPoint PPT Presentation

▶
human computer interaction
SMART_READER_LITE
LIVE PREVIEW

Human-Computer Interaction 4. Human models Dr. Sunyoung Kim School - - PowerPoint PPT Presentation

Jun 04, 2023 476 likes •1.26k views

Human-Computer Interaction 4. Human models Dr. Sunyoung Kim School of Communication & Information Rutgers university Last class 1. Understand tasks: Task analysis 2. Consolidation: Affinity diagram 3. Describe tasks 1. Task

slide-1
SLIDE 1
  • Dr. Sunyoung Kim

School of Communication & Information Rutgers university

Human-Computer Interaction

  • 4. Human models
slide-2
SLIDE 2

Last class

1. Understand tasks: Task analysis 2. Consolidation: Affinity diagram 3. Describe tasks

  • 1. Task characteristics
  • 2. Scenario: Storyboard
slide-3
SLIDE 3

Hawthorne effect

the alteration of behavior by the subjects of a study due to their awareness of being observed

slide-4
SLIDE 4

Recap: Task analysis

  • The process of examining the way in which people perform their tasks
  • You can discover what the system will be used for and what

functionalities the system must provide In HCI, task analysis is the recording of physical and perceptual actions of the user whilst executing the task.

slide-5
SLIDE 5

Recap: Affinity diagram

The affinity diagram brings together issues and insights across all users into a hierarchical diagram to reveal the scope of the problem.

  • Gathers large amounts of language data (ideas, opinions, issues) and
  • rganizes them into groupings based on their natural relationships
  • A single picture of the customer population a design will address
  • Shows how the work hangs together rather than breaking it up in lists

and what matters

  • Used to brainstorm and generate ideas
slide-6
SLIDE 6

Recap: Task analysis: questions

1. Who is going to use system? 2. What tasks do they now perform? 3. What tasks are desired? 4. How are the tasks learned 5. Where are the tasks performed? 6. What’s the relationship between user & data? 7. What other tools does the user have? 8. How do users communicate with each other? 9. How often are the tasks performed?

  • 10. What are the time constraints on the tasks?
  • 11. What happens when things go wrong?
slide-7
SLIDE 7

Recap: Scenarios

  • A concise descript of a persona
  • A narrative description of a task : the current use of a system
  • An informal narrative story, simple, “natural”, personal
  • Presented through storyboarding
  • Scenario should be simple and focused
  • Use personas in scenarios – how does it serve their needs?
slide-8
SLIDE 8

Recap: Storyboards

  • The point of storyboards is to convey the experience of using the

system

  • Include people experiencing the design and their reactions to it (either

good or bad)

  • Visual elements: Detail, text, people, frame, portrayal of time
slide-9
SLIDE 9

Today’s agenda

Human models

slide-10
SLIDE 10

Human models

slide-11
SLIDE 11

Freezer is too cold but fresh food is just right. How would you adjust the control?

slide-12
SLIDE 12

Gulfs of Execution & Evaluation

The gaps between the user and the interface, pointing to how to better design an interface so that the user can cope with it

  • Gulf of execution: the distance between the user's goals and the

means of achieving them through the system

  • Gulf of evaluation: the amount of effort required to determine

the system state

slide-13
SLIDE 13

. I'm fat because my metabolism is slow, hormone and gland problems and too much stress. Health professionals should help me lose weight. I am most worried about difficulties getting to work. Obesity is due to eating too much and not enough

  • exercise. The patient is to

blame, so solutions must start with the patient. The biggest concern is diabetes.

slide-14
SLIDE 14

“The models people have of themselves, others, the environment and the things with which they interact. People form mental models through experience, training and instruction”

  • An explanation of someone's thought process about how something

works in the real world

  • Enable people to reason about a system
  • Affect the way we see and interpret reality
  • When users approach an unfamiliar system, they subconsciously refer to

their mental model, User’s model “To break a mental model is harder than splitting the atom.”

  • -Albert Einstein

Mental models

slide-15
SLIDE 15

User vs. designer model

theconceptual modelofthe systemtobebuilt thewaytheuser interpretsthe SystemImage

slide-16
SLIDE 16

The Model Human Processor

  • Published by Card, Moran & Newell, 1983, in the book “The

Psychology of Human-Computer Interaction”

  • Consider humans as information processing systems
  • Core cognitive aspects
  • Attention
  • Perception and recognition
  • Memory
  • Reading, speaking, and listening
  • Problem-solving, planning, reasoning and decision-making, learning
  • Describes how a user interacts with a computer system
slide-17
SLIDE 17

Processors:

  • Perceptual
  • Cognitive
  • Motor

Memory:

  • Working memory
  • Long-term memory
slide-18
SLIDE 18

Why model human performance?

  • To predict impact of new technology/interface
  • Apply model to predict effectiveness
  • We could build a simulator to evaluate user interface designs

Human performance modeling

slide-19
SLIDE 19
slide-20
SLIDE 20

(1) Perceptual processor

Physical store from our senses: sight, sound, touch,…

  • Code directly based on sense used
  • Visual, audio, haptic, … features

Selective

  • Spatial
  • Pre-attentive: color, direction…

Decay time for working memory: 200ms

slide-21
SLIDE 21

Pre-attentive

  • A limited set of visual properties that are detected very rapidly and

accurately by the low-level visual system

  • Typically, tasks that can be performed on large multi-element displays

in less than 200 to 250 milliseconds are considered pre-attentive.

slide-22
SLIDE 22

How many 3’s?

1281768756138976546984506985604982826762 9809858458224509856458945098450980943585 9091030209905959595772564675050678904567 8845789809821677654876364908560912949686

slide-23
SLIDE 23

How many 3’s?

1281768756138976546984506985604982826762 9809858458224509856458945098450980943585 9091030209905959595772564675050678904567 8845789809821677654876364908560912949686

slide-24
SLIDE 24

How many 3’s?

1281768756138976546984506985604982826762 9809858458224509856458945098450980943585 9091030209905959595772564675050678904567 8845789809821677654876364908560912949686

slide-25
SLIDE 25

Visual pop-out: color (hue)

Resources from : https://www.csc2.ncsu.edu/faculty/healey/PP/index.html

slide-26
SLIDE 26

Visual pop-out: shape (curvature)

Resources from : https://www.csc2.ncsu.edu/faculty/healey/PP/index.html

slide-27
SLIDE 27

Feature conjunctions

Resources from : https://www.csc2.ncsu.edu/faculty/healey/PP/index.html

slide-28
SLIDE 28

Pre-attentive features

Resources from : https://www.csc2.ncsu.edu/faculty/healey/PP/index.html

Line (blob) orientation Length, width Closure Size

slide-29
SLIDE 29

Pre-attentive features

Resources from : https://www.csc2.ncsu.edu/faculty/healey/PP/index.html

Curvature Density, contrast Number, estimation Color (hue)

slide-30
SLIDE 30

Pre-attentive features

Resources from : https://www.csc2.ncsu.edu/faculty/healey/PP/index.html

Intensity, binocular lustre Intersection Terminators 3D depth cues

slide-31
SLIDE 31
slide-32
SLIDE 32
slide-33
SLIDE 33

Change blindness

A perceptual phenomenon that occurs when a change in a visual stimulus is introduced and the observer does not notice it Our visual intelligence can only detect changes in those parts of the image to which we explicitly attend.

slide-34
SLIDE 34
slide-35
SLIDE 35

Selective attention

The act of focusing on a particular object for a period of time while simultaneously ignoring irrelevant information that is also occurring This occurs on a daily basis and can be seen in basically any of your

  • interactions. Because it is impossible to give attention to every stimulus

in our environment, we use selective attention to select what stimuli are important as events occur.

slide-36
SLIDE 36

The problem with the classic ‘7±2’

  • George Miller’s theory of how much information people can remember
  • People’s immediate memory capacity is very limited
  • The number of objects an average human can hold in working memory

(short-term) is 7 ±2

  • Example:

DECIBMGMC vs. DEC IBM GMC 6174591765 vs. 617-459-1765

slide-37
SLIDE 37

The problem with the classic ‘7±2’

  • Wrong application of ‘7 ± 2’ theory: Designers present only 7
  • ptions/menus/icons/tabs. Why?
  • People can scan lists of bullets, tabs, menu items till they see the
  • ne they want
  • They don’t have to recall them from memory having only briefly

heard or see them

  • ‘7 ± 2’ applies to serial presentation of information
slide-38
SLIDE 38

Chunking

slide-39
SLIDE 39

Chunking

slide-40
SLIDE 40

Chunking

Hierarchy

slide-41
SLIDE 41

Experiment

Start saying colors you see in list of words When slide comes up As fast as you can

slide-42
SLIDE 42

Ship Night Triangle Bus Pencil

slide-43
SLIDE 43

Blue Green Red Orange Yellow

slide-44
SLIDE 44

Stroop effect

When the color spelled out by a word is incongruent with the color used to show that word, naming the word color is slower and more error prone. Explanation: Relationship between meaning and physical form of stimulus are in conflict.

slide-45
SLIDE 45

Processors:

  • Perceptual
  • Cognitive
  • Motor

Memory:

  • Working memory
  • Long-term memory
slide-46
SLIDE 46

Working memory

Working memory is small

  • Temporary storage
  • Decay
  • Displacement
slide-47
SLIDE 47

Recognition over recall

  • Recall – information reproduced from memory
  • Recognition

– Presentation of information provides cues that information has been encountered before – Easier because of cues (context) for retrieval

slide-48
SLIDE 48

Recognition over recall

  • Command line interface (recall) vs. GUI (recognition) interface
slide-49
SLIDE 49
slide-50
SLIDE 50

Cognitive processor

Typical matching time

  • Digits: 33ms
  • Colors: 38ms
  • Geometry: 50ms…

Fundamentally serial

  • One locus of attention at a time
  • Eastern 401, December 1972
slide-51
SLIDE 51
slide-52
SLIDE 52

Motor processor

Receive input from the cognitive processor Execute motor programs

  • Pianist: up to 16 finger movements per second
slide-53
SLIDE 53

Hit Space when character appears

A A A Tp Tc Tm

slide-54
SLIDE 54

Hit Space when character appears

A A A Tp Tc Tm

slide-55
SLIDE 55

Fitts’s law

slide-56
SLIDE 56

Fitts’s law

  • Fitts’s law predict the amount of time taken to move to and select a

target

  • It is faster to hit larger targets close to you than smaller targets

further from you

T = = a + + bl blog (D (D / S +1)

  • a, b = constants (empirically derived)
  • D = distance
  • S = size
  • T increases as the distance to the target increases
  • T decreases as the size of the target increases
slide-57
SLIDE 57

Applying Fitts’s law to UI design

  • Bring items closer to the cursor
  • Increase the target size
  • Exploit the edges
slide-58
SLIDE 58

Applying Fitts’s law to UI design

slide-59
SLIDE 59

Applying Fitts’s law to UI design

slide-60
SLIDE 60

Applying Fitts’s law to UI design

slide-61
SLIDE 61

Applying Fitts’s law to UI design

slide-62
SLIDE 62

Does Fitts’s law apply to mobile devices?

  • Yes! Original experiment by Fitts was on human arm movement,

not mouse pointing!

  • Extension to target acquisition with mouse was a big result of Card

et al. and not obvious.

  • Tablet setting is closer to original experimental setting.
  • No more benefit on device edges
  • How device is held is important
slide-63
SLIDE 63
slide-64
SLIDE 64
slide-65
SLIDE 65

Reading responses

slide-66
SLIDE 66

A lot of product or apps won't be favorites for me due to how my mind processes the layouts and design of it. Sometimes it might be okay to leave certain things up to interpretation for the user and have him figure out how to work the application. But this must done in a way that will still leave the user willing to use the

  • application. Unfortunately, it is very easy to fail using this method as the

user can just get frustrated and delete the application because they were not getting the instant gratification that they had sought. Things such as user objective, demographic, age and proficiency with technology are just the tip of the iceberg. The designer should also seek to incorporate innate actions into their design, which can make the learning curve much easier. Co Cognit nitiv ive e Sc Scienc ience

slide-67
SLIDE 67

While it is important to understand how people process information, we need to remember that there are others factors that contribute to human

  • analysis. For instance, if a user is in a room with inadequate lighting their

reaction to certain tasks might be slower than usual. The human mind is a bit more complex than a machine like a computer. I think there are other factors that play into the decision making that goes

  • n in the mind that weren't focused on in the article, something like

emotions or cultural factors. The flaw in this perspective does not, however, take in the variable of human emotion, something that distinctly sets humans and computer apart. I think it is far easier to understand what is going on with this model since this is broken up into multiple parts. “… comparing a human mind to a processing computer system” Mo Model Human Processor

slide-68
SLIDE 68

Group project

slide-69
SLIDE 69

Pr Project #2 Identify Users & Tasks - Us User/Task analysis

1.

  • 1. Part 1

1 (by 2/ 2/8) 8): Co Comment ents are e out ut # Common mistakes

  • 1. You need to do both interviews and surveys
  • 2. Your interview questions need to be structured
  • 3. Interview questions and survey questions shouldn’t be the same
  • 4. Each questions (both interview and survey) should have a concrete reason

to have answers for

  • 5. Interview questions should open up spaces for follow-up questions
  • 6. Stick to the format: 1 pdf, proposal on top
slide-70
SLIDE 70

Pr Project #2 Identify Users & Tasks - Us User/Task analysis

2.

  • 2. By 2/

2/15: 15: Collect interview data from 3-5 potential users (other than yourself or team members!) and collect questionnaire data from 10+ potential users. From the data collected;

(1) Create an affinity diagram based on your User/task analysis

# Turn-in: a PDF with

  • Interview/survey results
  • A screenshot of an affinity diagram (should be readable, 30+ sticky notes)
  • Add a description of your project proposal on top
  • Link to your project homepage
  • Should be accessible
  • Should have four pages with full contents:

1. Team intro 2. Project Proposal 3. Interview/survey plans and results 4. Affinity diagram (30+ sticky notes)

  • Include: Who contributed to the original writing of each section and who helped

improve and/or review

slide-71
SLIDE 71

Pr Project #2 Identify Us Users & Tasks - Us User/Task an anal alysi sis s

3.

  • 3. By 2/

2/22: 22: Create personas and scenarios (1) Create at least two types of representative users (Personas). (2) Using the personas, create at two scenarios (both narratives and storyboards) that encompass the range of functionality required in the system. Note that these scenarios will be used in later assignments to determine if the design/re- design actually supports these scenarios # Turn-in: a PDF with

  • Two personas
  • Two scenarios (storyboards)
  • Add a description of your project proposal on top
  • Link to your project homepage
  • Should be accessible
  • Should have personas and scenarios
  • Include: Who contributed to the original writing of each section and who helped

improve and/or review

  • Include: Who contributed to the original writing of each section and who helped

improve and/or review

slide-72
SLIDE 72

Pr Project #2 Identify Us Users & Tasks - Us User/Task an anal alysi sis s

Gr Grading (1) 25% – Clarity, appropriateness, organization of interview/survey questions (2) 25% – The quality of your affinity diagram (3) 25% – The quality of your Personas / Scenarios (4) 25% – Overall organization, clarity (e.g. language, style) etc.

slide-73
SLIDE 73

Individual assignment

slide-74
SLIDE 74

As Assignment #2 Identify Us Users & Tasks - Us User/Task analysis

1.

  • 1. By 2/

2/15: 15: Design a semi-structured interview script/survey questions that you will use to collect data from potential users. How many questions to ask? You decide! You need to make sure that you have enough questions to know about the users, their context, and the task. # Turn-in: a PDF of interview scripts & survey questions (Add a description of your project proposal on top) 2.

  • 2. By 2/

2/22: 22: Collect interview data from 3-5 potential users (other than yourself or team members!) and collect questionnaires data from 10+ potential users. From the data collected;

(1) Create an affinity diagram based on your User/task analysis

# Turn-in: a PDF with

  • Interview/survey results
  • A screenshot of an affinity diagram (should be readable!)
  • Link to your project homepage
  • Should be accessible
  • Should have three pages with full contents:

1. Project Proposal 2. Interview/survey plans and results 3. Affinity diagram

  • Add a description of your project proposal on top
slide-75
SLIDE 75

As Assignment #2 Identify Us Users & Tasks - Us User/Task analysis

  • 3. By

By 3/ 3/1: 1: Create personas and scenarios (1) Create one persona. (2) Using the persona, create one scenario (storyboard) that encompass the range

  • f functionality required in the system. Note that this scenario will be used in

later assignments to determine if the design/re-design actually supports this scenario. # Turn-in: a PDF with

  • Interview/survey results
  • A screenshot of an affinity diagram (should be readable!)
  • One persona
  • One scenario (storyboard)
  • Link to your project homepage
  • Should be accessible
  • Should have a persona/scenario
  • Add a description of your project proposal on top

Gr Grading (1) 25% – Clarity, appropriateness, organization of interview/survey questions (2) 25% – The quality of your affinity diagram (3) 25% – The quality of your Personas / Scenarios (4) 25% – Overall organization, clarity (e.g. language, style) etc.

slide-76
SLIDE 76

By next class

Reading

No readings: Watch two video clips

q Submit a PDF of P2 part 2 by 2/15, 11:55PM q Submit a PDF of interview scripts and survey questions of an individual project by 2/15, 11:55PM