CSE4015 HUMAN COMPUTER INTERACTION

L T P J C
3 0 0 4 4

Dr. S M SATAPATHY
Associate Professor,
School of Computer Science and Engineering,
VIT Vellore, TN, India – 632 014.
 Module – 3

INTERACTION DESIGN MODELS

 Model Human Processor (MHP)

 Keyboard Level Model (KLM)

 GOMS-CMN-GOMS Analysis

 State Transition Networks

2
GOMS

3
 GOMS
 Goal/task models can be used to explore the methods people use
to accomplish their goals
 Card et al. suggested that user interaction could be described by
defining the sequential actions a person undertakes to accomplish
a task.
 The GOMS model has four components:
 goals
 operators
 methods
 selection rules

4
 GOMS
 Goals - represents what the user wants to achieve, at a higher
cognitive level. This is a way to structure a task from cognitive point of
view
o Tasks are deconstructed as a set of goals and subgoals.
 Operators - elementary acts that change user’s mental (cognitive)
state or task environment.
o Tasks can only be carried out by undertaking specific actions.
 Methods - these are sets of goal-operator sequences to accomplish a
sub-goal. It represent ways of achieving a goal
o Comprised of operators that facilitate method completion
 Selection Rules - sometimes there can be more than one method to
accomplice a goal. Selection rules provide a mechanism to decide
among the methods in a particular context of interaction
o The method that the user chooses is determined by selection rules 5
 GOMS – (CMN) GOMS
 CMN-GOMS can predict behaviour and assess memory
requirements
 CMN-GOMS (named after Card, Moran, and Newell) -a detailed
expansion of the general GOMS model
o Includes specific analysis procedures and notation descriptions
 Can judge memory requirements
 Provides insight into user performance measures
 KLM vs. (CMN)GOMS:- In (CMN)GOMS, a hierarchical cognitive
(thought) process is assumed, as opposed to the linear thought
process of KLM
 Both assumes error-free and ‘logical’ behaviour
o A logical behaviour implies that we think logically, rather than
driven by emotions 6
 GOMS – (CMN)GOMS - Example
 Suppose we want to find out the definition of a word from an online
dictionary. How can we model this task with (CMN)GOMS?

 We shall list the goals (high level tasks) first

o Goal: Access online dictionary (first, we need to access the
dictionary)
o Goal: Lookup definition (then, we have to find out the definition)
 Next, we have to determine the methods (operator or goal-operator
sequence) to achieve each of these goals
o Goal: Access online dictionary
 Operator: Type URL sequence
 Operator: Press Enter
7
 GOMS – (CMN)GOMS - Example
 Next, we have to determine the methods (operator or goal-operator
sequence) to achieve each of these goals
o Goal: Lookup definition
 Operator: Type word in entry field
 Goal: Submit the word
 Operator: Move cursor from field to Lookup button
 Operator: Select Lookup
 Operator: Read output

8
 GOMS – (CMN)GOMS - Example
 Note the use of operator
o The operator “type URL sequence” is a high-level operator
defined by the modeler
o “Press Enter” is a keystroke level operator
o Note how both the low-level and high-level operators co-exist in
the same model

 Note the use of methods

o For the first goal, the method consisted of two operators
o For the second goal, the method consisted of two operators and
a sub-goal (which has a two-operators method for itself)

9
 GOMS – (CMN)GOMS – Example 2
 Suppose we have a window interface that can be closed in either of
the two methods: by selecting the ‘close’ option from the file menu
or by selecting the Ctrl key and the F4 key together. How we can
model the task of “closing the window” for this system?

10
 GOMS – (CMN)GOMS – Example 2
 This is unlike the previous example where we had only one method
for each goal.
 We use the “Select” construct to model such situations

 Goal: Close window

 [Select Goal: Use menu method
 Operator: Move mouse to file menu
 Operator: Pull down file menu
 Operator: Click over close option
 Goal: Use Ctrl+F4 method
 Operator: Press Ctrl and F4 keys together]

11
 GOMS - Other GOMS Models
 NGOMSL (Natural GOMS Language), developed by Kieras,
provides a structured natural-language notation for GOMS analysis
and describes the procedures for accomplishing that analysis
(Kieras, 1997)
 NGOMSL Provides:
o A method for measuring the time it will take to learn specific
method of operation
o A way to determine the consistency of a design’s methods of
operation
 CPM-GOMS represents
o Cognitive
o Perceptual
o Motor operators 12
 GOMS - Other GOMS Models
 CPM-GOMS uses Program Evaluation Review Technique (PERT)
charts
o Maps task durations using the critical path method (CPM).
 CPM-GOMS is based directly on the Model Human Processor
o Assumes that perceptual, cognitive, and motor processors
function in parallel
 Program Evaluation Review Technique (PERT) chart Resource
Flows

13
 Modeling Structure
 Structural models can help us to see the relationship between the
conceptual components of a design and the physical components
of the system, allowing us to judge the design’s relative
effectiveness.

Hick - Hyman Law

 Hick’s law can be used to create menu structures.
 Hick’s law states that the time it takes to choose one item from n
alternatives is proportional to the logarithm (base 2) of the number
of choices, plus 1.
 This equation is predicated on all items having an equal probability
of being chosen
14
 Modeling Structure – Hicks Law
T = a + b log2(n +1)

 The coefficients are empirically determined from experimental

design
 Raskin (2000) suggests that a = 50 and b = 150 are sufficient
place holders for “back-of-the envelope” approximations.
 Menu listing order must be logical and relevant
 Menus are lists grouped according to some predetermined system
 If the rules are not understood or if they are not relevant to a
particular task, their arrangement may seem arbitrary and random,
requiring users to search in a linear, sequential manner.

15
Hicks Law – Choice Reaction Time

16
 Hicks Law – Choice Reaction Time
Exercise:
 A telephone call operator has 10 buttons. When the light behind
one of the buttons comes on, the operator must push the button
and answer the call. When a light comes on, how long does it take
the operator to decide which button to press?

Answer:

T = 70 ms log2(10+1)
T = a + b log2(10 + 1)
(Assume a = 0, b =0.2)

17
 Modeling Dynamics
 Understanding the temporal aspects of interaction design is
essential to the design of usable and useful systems
 Interaction designs involve dynamic feedback loops between the
user and the system
o User actions alter the state of the system, which in turn
influences the user’s subsequent actions
 Interaction designers need tools to explore how a system
undergoes transitions from one state to the next

18
 Modeling Dynamics – State Transition Networks
 State Transition Networks can be used to explore:
o Menus
o Icons
o Tools
 State Transition Networks can show the operation of peripheral
devices.
 STNs are appropriate for showing sequential operations that may
involve choice on the part of the user, as well as for expressing
iteration.

19
 Modeling Dynamics – State Transition Networks
Exercise:
 In an online shopping website the customer browses the catalog and
selects items he wants to buy. Customer goes to check out. Customer
fills in shipping information. The system presents full pricing
information. Customer fills in credit card information. The system
authorizes purchase. Then system confirms sale immediately. Finally
system sends confirming email to customer.

20
Example 1

Process
3 Button Timer
- Min • Pressing the min or sec increments the
- Sec appropriate section of the display
- Stop/Start • Pressing the min and sec together resets the timer
• Pressing the stop/start
• When the display is 00:00 starts a count up
(display updates each second)
• When the display is not 00:00 starts a count
down (updates each second)
• When stop/start pressed, count-down
suspended
• When the time == 0 alarm sounds
• When stop/start pressed
• Alarm stops
• Time reset to starting value
• If min or sec is pressed, starting value is
incremented
Example 2- Login of student email
• Link: https://iam.auckland.ac.nz/Authn/UserPassword
• If the credentials are valid, the user will be able to access the
account
• But if the user forgets the password he/she can click “I forgot
the password” which will lead to the following chain of
events( Ignore other options on the page like ‘Sign up for the
account’ and ‘I cannot log in’
• User is asked to enter upi or id number or email
address.(Ignore ‘Contact Support’) On clicking next,
• User is asked to enter barcode on his/her id card.
• On clicking next, a text message will be send to user,
which contains the password reset code. User has to
enter the password reset code received, new password
and confirm new password by re-entering it.
• On clicking next, it goes to login page for new login.
Example 3- Heart Disease Risk
Calculator • Online tool to calculate
heart disease risk

http://www.mayoclinic.org/he
art-disease-risk/itt-20084942

• Risk of cardiovascular
disease is calculated
based on the details
provided by the user. Try
out all possible options to
create a state transition
network diagram.
 Modeling Dynamics – Three State Models
 The Three-State Model (TSM) is capable of describing three
different types of pointer movements

 Tracked: A mouse device is tracked by the system and represented

by the cursor position

 Dragged: A mouse also can be used to manipulate screen elements

using drag-and-drop operations

 Disengaged movement: Some pointing devices can be moved

without being tracked by the system, such as light pens or fingers
on a touchscreen, and then reengage the system at random screen
locations 24
Modeling Dynamics – Three State Models

25
 Modeling Dynamics – Glimpse Model
 Forlines et al. (2005):
o Because the pen and finger give clear feedback about their
location when they touch the screen and enter state 2, it is
redundant for the cursor to track this movement
o Pressure-sensitive devices can take advantage of the s1
redundancy and map pressure to other features
o Undo commands coupled with a preview function (Glimpse) can
be mapped to a pressure-sensitive direct input device

26
Modeling Dynamics – Glimpse Model

27
 Physical Models – Fitt’s Law
 Physical models can predict efficiency based on the physical
aspects of a design
 They calculate the time it takes to perform actions such as targeting
a screen object and clicking on it
 Models human motor performance
o Aimed at arm-hand movement
o Original model developed in 1954
 Enables prediction of movement time (MT)
o Movement assumed to be rapid, error-free, and targeted
 Fitts’ law states that the time it takes to hit a target is a function of
the size of the target and the distance to that target
 Fitts’ law can be used to determine the size and location of a
screen object 28
 Physical Models – Fitt’s Law
 There are essentially three parts to Fitts’ law:
o Index of Difficulty (ID) - Quantifies the difficulty of a task based
on width and distance
o Movement Time (MT) - Quantifies the time it takes to complete a
task based on the difficulty of the task (ID) and two empirically
derived coefficients that are sensitive to the specific
experimental conditions
o Index of Performance (IP) [also called throughput (TP)] - Based
on the relationship between the time it takes to perform a task
and the relative difficulty of the task

29
 Physical Models – Fitt’s Law
 Fitts described “reciprocal tapping”
o Subjects were asked to tap back and forth on two 6- inch-tall
plates with width W of 2, 1, 0.5, and 0.25 inches

o Fitts proposed that ID, the difficulty of the movement task, could be
quantified by the equation
ID = log2(2A/W)
Where:
o A is the amplitude (distance to the target)
o W is the width of the target 30
 Physical Models – Fitt’s Law
 This equation was later refined by MacKenzie to align more closely
with Shannon’s law:

ID = log2(A/W + 1)

 The average time for the completion of any given movement task
can be calculated by the following equation:

MT = a + b log2(A/W + 1)
MT = a + b * ID
Where:
o MT is the movement time
o Constants a and b are arrived at by linear regression 31
 Physical Models – Fitt’s Law
MT = a + b * ID
Where:
o MT is the movement time
o a: y-intercept
o b: slope (msec/bit)
o 1/b: Index of Performance (bits/msec)
o Originally: ID = -log2 (W / 2A) = log2 (2A / W)
o Today:
o ID = log2 (A / W + 1)
o ID = log2 (A / W + 0.5) when ID < 3 bits

32
 Physical Models – Fitt’s Law
Interpretation of log2 (A/W + 1)
 Arm-hand movement require more time when
o Distance to target (A) increases
o Error tolerance (W) decreases
o Target is further away and of smaller size

 Arm-hand movement requires less time when

o Distance to target (A) decreases
o Error tolerance (W) increases
o Target is closer and of larger size

33
 Physical Models – Fitt’s Law
 a and b found with regression line
o Done lots of times in the past with close but not exact agreement
MT ~= 590 + 230 * Id
Index of Performance (Ip) = 1 / b ~= 1/230 = 4.35 bits / msec

34
 Physical Models – Fitt’s Law
Exercise:
 Predict time for user to move the cursor from current location to a
button
o Button is 400 pixels to the right of the cursor
o Button is 50 pixels wide

MT ~= 590 + 230 * Log2 (A / W + 1)

Answer
MT ~= 590 + 230 * Log2 (400 / 50 + 1)
590 + 230*log29 = 1319 milisecond

35
 Physical Models – Fitt’s Law
Exercise - 2D:
 Predict time for user to move the cursor from current location to a
pull down menu
o Menu is 400 pixels up and to the right of the cursor
o Menu is 40 pixels wide by 20 pixels high

MT ~= 590 + 230 * Log2 (A / W + 1)

Answer = ??

36
 Physical Models – Fitt’s Law
Adopting Model to 2D task
 What happens for:
o vertical or diagonal movements to targets?
o Targets that are not rectangular?
o Fitts Law does not fit these environments well

 Possible solutions
o Use area of target
o Use perimeter of target
o Use smaller of width and height
o Measure width along approach angle

37
 Physical Models – Fitt’s Law
 By calculating the MT and ID, we have the ability to construct a
model that can determine the information capacity of the human
motor system for a given task.
o Fitts referred to this as the index of performance (throughput)

 Throughput is the rate of human information processing

TP = ID / MT

38
 Physical Models – Fitt’s Law
Example:
 suppose we want to measure the performance of a mouse. We
employ 10 participants in an experiment and gave them 6 different
target acquisition tasks (where the task difficulties varied). From the
data collected, we can measure the mouse performance by taking
the mean throughput over all participants and tasks

39
Physical Models – Fitt’s Law

40
 Physical Models – Fitt’s Law
Exercise: UI design
 Microsoft Toolbars allow you to either keep or remove the
labels under Toolbar buttons According to Fitts’ Law, which
is more efficient?

41
 Physical Models – Fitt’s Law
Exercise: UI design
 Here are two answers.
o The label becomes part of the target. The target is therefore
bigger. Bigger targets, all else being equal, can always be
accessed faster. Fitts' Law.
o When labels are not used, the tool icons crowd together.
 At first glance, it might appear advantageous to crowd the icons
together, since it results in less distance among targets.
 However, the task here is not to hop from target to target. Instead,
the point of origin when a user decides to access the toolbar will
usually be somewhere in the content region, away from all the
targets.
42
 Physical Models – Fitt’s Law
Exercise: UI design
 When the icons are spread apart, users have a "buffer zone"
between icons, where an incorrect acquisition will result in no
action.
 When the targets are crowded together, however, the user has
more chance to initiate an unwanted action.
 To avoid this possibility, non-label users learn to slow way down.
(Don't bother to ask them whether they've slowed down. They'll tell
you it sped them up. Only the stopwatch knows for sure.)
 Another way to make the targets bigger, of course, is to always
choose large icons, rather than small.

43
 Physical Models – Fitt’s Law
Implications of Fitts’ Law
 Large targets and small distances between targets are
advantageous
 Screen elements should occupy as much of the available screen
space as possible
 The largest Fitts-based pixel is the one under the cursor
 Screen elements should take advantage of the screen edge
whenever possible
 Large menus like pie menus are easier to uses than other types of
menus.

44
 Physical Models – Fitt’s Law
Limitations of Fitts’ Law
 There is no consistent way to deal with errors
 It only models continuous movements
 It is not suitable for all input devices, for example, isometric
joysticks
 It does not address two-handed operation
 It does not address the difference between flexor and extensor
movements
 It does not address cognitive functions such as the mental
operators in the KLM model

45
 Physical Models – Fitt’s Law
 W is computed on the same axis as A

 Bivariate data
o Smaller-Of : The smaller of the width and height measurements:
IDmin(W, H ) = log2 [D/min (W, H ) + 1]

46
 Physical Models – Fitt’s Law
 W: The “apparent width” calculated along the approach vector
IDW = log2 (D/W + 1)

47
 Physical Models – Fitt’s Law
 Amplitude Pointing: One-dimensional tasks
o Only the target width (whether horizontal or vertical) is
considered
o The constraint is based on W, and target height (H) is infinite or
equal to W
o AP errors are controlled at “the final landing”

 Directional Pointing: If W is set at infinity then H becomes

significant
o The constraint is based on H
o DP errors are corrected incrementally during the pointing
movement
48
Physical Models – Fitt’s Law

49
Thank You for Your Attention !

50