1 interactive systems design msc in communications, computing and human-centred systems dr. chris...
TRANSCRIPT
![Page 1: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/1.jpg)
1
Interactive Systems Design
MSc in Communications, Computing and Human-Centred Systems
Dr. Chris Baber
![Page 3: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/3.jpg)
3
Aims
Introduce some basic concepts from Cognitive Psychology
Demonstrate relationships between these concepts and interactive systems design
![Page 4: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/4.jpg)
4
Objectives
After completing this module, students will be able to:
Critique user interfaces through the application of appropriate concepts from cognitive psychology
Offer guidelines on how to improve a design
![Page 5: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/5.jpg)
5
Assignment1. Select ANY mobile telephone user interface
2. Critically evaluate the user interface in terms of:1. layout 2. use of colour3. Gestalt 4. consistency 5. support for navigation
3. Explain how and why the user interface might present problems to users
4. Consider the (non-computer) metaphor(s) that can be related to the design
5. Explain what assumptions you believe that the designers have made in terms of the way that users interpret the user interface
6. Produce a redesign of the user interface that you believe is superior to the current version and explain why your redesign is better
![Page 6: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/6.jpg)
6
Marking Scheme
1. Presentation of system image and screen-shots (images and description) - up to 10 marks
2. Definition of a ‘good’ user interface - up to 10 marks3. Discussion of key topics from cognitive psychology -
up to 30 marks4. Critique of selected user interface, in terms of 2 and
3 - up to 25 marks5. Redesign (images and description) - up to 10 marks6. Why is your redesign superior to the current design?
- up to 10 marksUp to 5 additional marks for presentation of report
![Page 7: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/7.jpg)
7
Useful References
Ji, Y.G. et al., 2006, A usability checklist for the usability evaluation of mobile phone user interface, International Journal of Human-Computer Interaction, 20 (3), pp. 207-231
Bocker, M. and Suwita, A., 1999, The evaluation of the Siemens C10 mobile phone – usability testing beyond ‘quick and dirty’, Proceedings of the 43rd Annual Meeting of the Human Factors and Ergonomics Society, Santa Monica, CA: HFES, pp.379-383
Ziefle, M., 2002, Usability of menu structures and navigation keys in mobile phones: a comparison of the ease of use in three different brands, Proceedings of the 6th International Scientific Conference on Work with Display Units, Berlin, pp.359-361
Jokela, T. et al., 2006, Methods for Quantitative Usability requirements: a case study on the development of the user interface of a mobile phone, Personal and Ubiquitous Computing, 10 (6), 345-355
![Page 8: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/8.jpg)
8
TimetableMonday 29th Tuesday 30th Wednesday 31st
10 - 11 1. Introduction to Module
6. Navigation in user interfaces
10. Paper prototyping
11 - 12 2. Fundamentals of graphical user interface
design
7. Interaction Devices: entering
data
11. Distributed Cognition
12 - 1 3. Link and Layout Analysis
8. Interaction Devices:
Selecting objects
12. Collaborative Work
2 - 3 4. Use of Colour and Highlighting
9. Multimodal HCI 13. Future HCI
4 - 5 5. Commands and Menus
10. Mobile HCI 14. Future HCI
![Page 9: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/9.jpg)
9
1. Introduction
![Page 10: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/10.jpg)
10
Design Principles1. Know your user2. Build on systems that are familiar to your user3. Display available functions4. Ensure Coherence and Consistency5. Visualise states and transitions6. Design shortcuts7. Design Help8. Tolerate user error9. Provide Context10. Manage Focus11. Display Grammar
![Page 11: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/11.jpg)
11
Varieties of TechnologyTechnology mediates human action
on the world in ways that…
Augment
Correct
Extend
Modify
& Disrupt
…human performance and ability
![Page 12: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/12.jpg)
12
Augment / Correct / Extend
Technologies ‘augment’ human abilities SUBSTITUTION: calculators
REPRESENTATION: shopping lists
Technologies ‘extend’ human abilities CORRECTION: spectacles, hearing aids
increasing RANGE: telescope, telephone
![Page 13: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/13.jpg)
13
Modify
Technology changes: Task sequence Required actions Information content
Example: Calculate 9 hours of work at £3.50 per hour.
What if you add another hour?
![Page 14: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/14.jpg)
14
Disrupt
Changes ways of working Requires new ways of thinking or acting
Interferes with activities MicroSoft PaperClip PDA in meetings Mobile phones in lectures
![Page 15: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/15.jpg)
15
How different ‘models of the user’ lead to different assumptions on how to Minimise Human Error
Explain error Reduce error
Idiot Design fault Make as simple as possible
Designer Error free No need
Computer Follow instruction Clarify instruction
Information Processor Breakdown Modes; forcing functions
Active Interpreter Not Compatible Design for mental model
![Page 16: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/16.jpg)
16
‘Instant Experts’
You get a new mobile telephone for Xmas, do you:
1. Read the manual from cover to cover and then switch on the phone?
2. Switch on the phone and try to use it?
3. Switch on the phone and read the manual when you have problems?
![Page 17: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/17.jpg)
17
Using tools
Physical appearance
Knowledge of use
Sequence of activity
![Page 18: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/18.jpg)
18
Affordance
See handle Reach out hand Grasp handle Turn handle Pull door
![Page 19: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/19.jpg)
19
The Cooker Problem #1
Which control acts on which ring?
![Page 20: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/20.jpg)
20
The Cooker Problem #2
Which control acts on which ring?
![Page 21: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/21.jpg)
21
Paul Fitts: Spatial Compatibility
![Page 22: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/22.jpg)
22
Direction of motion Stereotypes
a d
b
c
? ?
Clockwise = increaseClockwise = rightClockwise = away from controlClockwise = increase on scale
1 2 3 4 5 67
1 2 3 4 5 67
![Page 23: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/23.jpg)
23
Clockwise to Increase?
1234567
![Page 24: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/24.jpg)
24
Conclusions…
We have learned ‘routines’ for how to use many sorts of technology
We apply these routines ‘automatically’ When the routines succeed, they are
reinforced When the routines fail, we think about what
we’re doing
![Page 25: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/25.jpg)
25
Expectations and Affordances
People “know” how technology works…
‘Out of box’ experience
Reading instructions
Prior knowledge and expectations
![Page 26: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/26.jpg)
26
Automaticity
Norman and Shallice (1980) Fully automatic processing controlled by SCHEMATA
Partially automatic processing controlled by either Contention Scheduling
Supervisory Attentional System (SAS)
![Page 27: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/27.jpg)
27
Supervisory Attentional System Model
Perceptual System
SupervisoryAttentional
System
Effector System
Contentionscheduling
Triggerdatabase
Control schema
![Page 28: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/28.jpg)
28
Contention Scheduling
Gear changing when driving involves many routine activities but is performed ‘automatically’ – without conscious awareness
When routines clash, relative importance is used to determine which to perform – Contention Scheduling
e.g., right foot on brake or clutch
![Page 29: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/29.jpg)
29
SAS activation
Driving on roundabouts in France Inhibit ‘look right’; Activate ‘look left’ SAS to over-ride habitual actions
SAS active when: Danger, Choice of response, Novelty etc.
![Page 30: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/30.jpg)
30
Know your user…
When designing any form of user interface, you should ask:
What am I trying to help the reader (or user) of this display do?
How does the information I am presenting to them help with their thinking or their activity?
![Page 31: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/31.jpg)
31
Seven Stage Action Model[Norman, 1990]
Form intentionDevelop plan
Perform action
Object in world
Evaluate against goalInterpret object
Perceive state of object
GOAL OF PERSON
![Page 32: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/32.jpg)
32
Routes from Intention to Action
Route 1:Automaticity Apply known routine Compatibility Affordance
Route 2: Formulate plan Problem solving Situated actions
![Page 33: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/33.jpg)
33
Problem Solving
A problem is something that doesn’t solve easily
A problem doesn’t solve easily because: you don’t have the necessary knowledge or, you have misrepresented part of the problem
If at first you don’t succeed, try something else
Tackle one part of the problem and other parts may fall into place
![Page 34: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/34.jpg)
34
Problem Solving
Representation affects strategy
More than one possible solution
Solution limited by boundary conditions
Active involvement and testing
![Page 35: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/35.jpg)
35
Problem
SEND
+ MORE
MONEY
![Page 36: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/36.jpg)
36
Functional Fixedness
Strategy developed in one version of the problem
Strategy might be inefficient
XIV ÷ X vs. XXXX ÷ X
Convert numerals or just ‘see’ 4
![Page 37: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/37.jpg)
37
Interacting with Products as Problem Solving User has a ‘goal’ to achieve using the product
The product offers functions to the user
The user must select the ‘best’ function to progress towards the goal
The interaction can be thought of as movement through a space of possible actions towards a goal
Selection of the ‘best’ action will be influenced by available functions and their interpretation
![Page 38: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/38.jpg)
38
Situated Actions
‘Plans’ imply a specified sequence of actions… plans are representations of action
…but some actions are ‘opportunistic’, i.e., supported by the current context-of-use
Suchman (1992) terms these ‘situated actions’ plans are resources for action
![Page 39: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/39.jpg)
39
2. Fundamental of graphical user interface design
![Page 40: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/40.jpg)
40
Information Design can Influence Thinking
John Snow, 1854m Mapping death from cholera, in London, showed clusters around water pump (and not near brewery)
![Page 41: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/41.jpg)
41
Attributes affecting utility
ReadabilityWordsSyntax
LegibilityFont design
ContrastIlluminationLuminance
ConspicuityGraphic designSpatial coding
Temporal codingShape codingColour coding
Display
Psychological processExtraction of meaning
Comprehension
Mediating Userattributes
![Page 42: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/42.jpg)
42
Gestalt Principles
![Page 43: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/43.jpg)
43
Density and Clutter
Density is related to available screen space E.g 80 x 24 line display = 1920 character spaces
The proportion of filled spaces = Density Density averages 25% but rarely exceeds
50%
![Page 44: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/44.jpg)
44
Levels of Density
70% density 50% density 30% density
Shneiderman, 1992
![Page 45: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/45.jpg)
45
Reducing Density
Grouping / tabulating; Reduce number of words; Reduce number of characters
![Page 46: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/46.jpg)
46
Conclusions
Understanding basic Gestalt principles helps manage focus
Some objects on a display are more conspicuous than others Use highlighting sparingly
Some objects form ‘perceptual groups’ Use this to help design screen layout and to
minimise risk of confusion
![Page 47: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/47.jpg)
47
3. Link and Layout Analysis
Link Analysis Sequence in which objects are used, or attended
to, during a task Data recorded from eye-movement or from
observation of product use Layout Analysis
Define relationship between objects in terms of functional grouping and sequence of use
![Page 48: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/48.jpg)
48
3. Link and Layout Analysis
![Page 49: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/49.jpg)
49
Eye-Movement ‘Heat Maps’
![Page 50: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/50.jpg)
50
Reading
Saccades and Fixations
Anticipation and Inferences
Interpretation
![Page 51: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/51.jpg)
51
Saccades and Fixations
![Page 52: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/52.jpg)
52
Reading from Computer Screens
Reading Speed Computer 20% - 30% slower than paper
BUT only when Refresh rate < 60Hz Resolution < 640x480 pixels
Differences essentially related to character discrimination data-driven perception (see slide 27)
![Page 53: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/53.jpg)
53
Link Analysis Worked Example:scan of initial layout
Cassette door
Radio displayBANDASPMME-SCAN
ST
DX/LOA
SCAN
SEEK
CD
1 2 3
4 5 6B
![Page 54: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/54.jpg)
54
Link Analysis Worked Example:revised layout
Cassette door
Radio display
BANDASPMME-SCAN
ST
DX/LO
A
SCAN
SEEK
CD 1 2 3
4 5 6
B
![Page 55: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/55.jpg)
55
Layout Analysis Worked Example:initial layout
Cassette door
Radio displayBANDASPMME-SCAN
ST
DX/LOA
SCAN
SEEK
CD
1 2 3
4 5 6B
![Page 56: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/56.jpg)
56
Layout Analysis Worked Example:functional grouping
Cassette door
Radio displayBANDASPMME-SCAN
ST
DX/LOA
SCAN
SEEK
CD
1 2 3
4 5 6B RADIO
RADIO
CASSETTE
![Page 57: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/57.jpg)
57
Layout Analysis Worked Example:redesign within functional groupings
Radio display
BANDASPMME-SCAN
ST
DX/LOA
SCAN
SEEK
CDCassette door
1 2 3
4 5 6
B
![Page 58: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/58.jpg)
58
Context
When presented with ambiguous stimuli our prior knowledge of the world helps us to make sense of it
![Page 59: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/59.jpg)
59
Context
![Page 60: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/60.jpg)
60
InterpretationKnowledge of what you are “looking at” can aid in interpretation
JA CKAN DJI
LLW ENTU PTH
EHI LLTOFE
TCH APAILO
FWA TER
Organisation of information is also useful
A B C
1 20 15 10
2 32 16 12
3 27 17 11
Gestalt also influences interpretation
![Page 61: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/61.jpg)
61
Concepts
How do you know a chair is a chair?
A chair has four legs…does it? A chair has a seat…does it?
![Page 62: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/62.jpg)
62
Mental models
Craik Internal representation of external reality Every good monitor needs a model of the world it
is monitoring Johnson-Laird
Strategies of knowledge assimilation
![Page 63: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/63.jpg)
63
Mental Models
Van Dijk and Kintsch (1983) Text processed to extract propositions, which are
held in working memory; When sufficient propositions in WM, then linking
performed; Relevance of propositions to linking proportional
to recall; Linking reveals ‘gist’
![Page 64: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/64.jpg)
64
Inferences
Comprehension typically requires our active involvement in order to supply information which is not explicit in the text
1. Mary heard the ice-cream van coming
2. She remembered her pocket money
3. She rushed into the house.
![Page 65: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/65.jpg)
65
Inference and Recall
Thorndyke (1976): recall of sentences from ‘Mary’ story 85% correct sentence 58% correct inference –
sentence not presented 6% incorrect inference
![Page 66: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/66.jpg)
66
Scripts, Schema and Frames Schema = chunks of knowledge
Slots for information: fixed, default, optional
Scripts = action sequences Generalised event schema (Nelson, 1986)
Frames = knowledge about the properties of things
DESIGN CAN HELP CALL APPROPRIATE CONCEPTS TO MIND, e.g., through the use of metaphor
![Page 67: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/67.jpg)
67
VisiCalc Xerox Star
![Page 68: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/68.jpg)
68
WIMP
Windows Icons Menus Pointing devices
![Page 69: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/69.jpg)
69
Metaphor - Pros
WOZNY (1989) Metaphors allow users to compare knowledge of the world
with what is happening in the system, and use analogy in initial reasoning with the system
MARCUS (1998) “A familiar concept in an unfamiliar environment can add
appeal and when users are new to a topic or application domain, seeing familiar references can reduce tension, stress, boredom, confusion, anxiety, and alienation, while increasing their self-assurance, calm, interest, engagement and dependence upon the user interface.”
![Page 70: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/70.jpg)
70
Designing with Metaphors
MARCUS, 1994 MADSEN,1994 CARROL ET AL. 1988
ORGANISE: provide simple, clear, consistent
metaphors
Listen to how users understand their computer
Identify candidate metaphors
ECONOMISE: maximise effectiveness of minimal
set of metaphors
Build on existing metaphors
Detail metaphor / software matches with respect to
user scenarios
COMMUNICATE: match metaphors to user
capabilities
Use predecessor artefacts as metaphors
Identify likely mismatches and their implications
MANAGE MISMATCHES Note metaphors already implicit in problem
description
Identify design strategies to help minimise
mismatches
![Page 71: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/71.jpg)
71
Smilowitz, “Do metaphors make web browsers easier to use?”
http://www.baddesigns.com/mswebcnf.htm
![Page 72: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/72.jpg)
72
Integral metaphor (library) ‘Standard browser’ interface (no metaphor)
![Page 73: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/73.jpg)
73
Integral metaphor (travel) Composite metaphor (library + travel)
![Page 74: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/74.jpg)
74
Metaphor - Cons
“Those who think that one should use metaphors in design are destined to produce crappy designs.” (DON NORMAN)
PIRHONEN (2003) A metaphor cannot cover the whole domain of the referent
And so limits functionality of the design (HARRISON ET AL. 1998) Once a person has learned the application, the metaphor becomes redundant
HUDSON (2002) Metaphor can lead to inappropriate assumptions on error recovery
COOPER (1995) Searching for the ‘magic metaphor’ can be one of the biggest mistakes an interface
designer can make A Metaphor could offer a tiny boost to learnability at first but eventually limits
functionality There are not enough metaphors to go around Metaphors do not scale well
![Page 75: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/75.jpg)
75
4. Use of Colour and Highlighting
![Page 76: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/76.jpg)
76
Contrast Effects
This text is quite easy to read because the contrast between figure and ground is high
This text is more difficult to read because the contrast between figure and ground is lower
This text is very hard to read because the contrast between figure and ground is minimal
![Page 77: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/77.jpg)
77
Galitz, W.O., 1996, The Essential Guide to User Interface Design Potential problems:
screen backgrounds being more attention grabbing than screen data
overuse of colour as a code (the colour itself meaning something to the screen viewer), which forces the user to interpret a colour’s meaning before the message it is communicating can be reacted to.
![Page 78: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/78.jpg)
78
Galitz, W.O., 1996, The Essential Guide to User Interface Design
Use colour to assist in formatting a screen:
relate or tie elements into groupings break apart separate groupings of information associate information that is widely separated on the
screen highlight or call attention to important information by
setting it off from other information
![Page 79: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/79.jpg)
79
Tufte, E., 1989, Visual Design of the User Interface1. The border of an active window should be light in
value (to avoid clutter with other windows), yet deeply saturated (to provide a conspicuous signal)
2. Yellow is the only colour jointly satisfying both these conditions, and therefore proves valuable for bordering windows
3. A good way to avoid colorjunk is to use colours found in nature, particularly towards the lighter side, such as blues, greys, yellows
4. Nature’s colour are familiar and have a widely accepted harmony
![Page 80: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/80.jpg)
80
Apple Computer Inc., 1992, Macintosh Human Interface Guidelines Use of Colour in Windows:
Distinguishes the active window from other windows and enhances the appearance of user controls on the window frame.
Scroll bars and title bars are gray User controls are coloured to make them more apparent Inactive window borders are gray to make them recede into background and active windows black
border stands out. User can change colours from colour control panel User chosen highlight colours will be used in windows and dialog boxes.
Limit the number of Colours To maintain consistency with operating system, use as few colours as possible. Fewer colours results in less visual clutter on the screen
Colours on Gray Colours look best against a background of neutral gray Colours will stand out more if the background and surrounding areas are gray black, or white
Beware of Blue Light Blue is the colour most difficult to distinguish. Avoided for text, thin lines, and small shapes. If you want things to be unobtrusive, thought, light blue is the perfect colour.
![Page 81: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/81.jpg)
81
Factors that Affect Contrast and VisibilityVariable Effect Example
Contrast Visibility Black print on grey
Illumination Contrast Sensitivity (CS)
Reading map in poor light
Polarity Black on white better than white on black
Designing slides
Spatial frequency Optimum CS at 3 C/D Ideal size of text font given viewing distance
Visual accommodation CS Map reading during night driving
Motion CS Reading a road sign while moving
Wickens et al., 1998, An Introduction to Human Factors Engineering
![Page 82: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/82.jpg)
82
Data-driven perception
Activation of neural structures of sensory system by pattern of stimulation from environment
![Page 83: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/83.jpg)
83
Theory-driven perception
Perception driven by memories and expectations about incoming information.
![Page 84: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/84.jpg)
84
Exercise
x
i. X on outside front cornerii. X on insideback corner
![Page 85: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/85.jpg)
85
Visual Illusions
Old Woman or Young girl?
Rabbit or duck?
http://www.genesishci.com/illusions2.htm
![Page 86: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/86.jpg)
86
KEYPOINT
Perception limits are set by sensory / neural mechanisms; but beyond these limits, perception can be cognitively controlled;
Sensory experiences interpreted in a CONTEXT and derive from a variety of sources
![Page 87: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/87.jpg)
87
Conclusions
Humans constantly seek patterns in the world around them…
…and use these patterns to impose meaning on what they see or hear.
Good design encourages this search for pattern…
…bad design makes people see patterns when none are intended.
![Page 88: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/88.jpg)
88
5. Commands and Menus
![Page 89: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/89.jpg)
89
Commands and Icons
GREP –V ^$filea>fileb
A B
![Page 90: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/90.jpg)
90
Command Languages
Advantages
Fast
Efficient
Precise
Concise
Flexible
User initiated
Disadvantages
Training
Regular use
High memory load
Poor error handling
![Page 91: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/91.jpg)
91
Commands Languages
Command languages rely on recall Draper (1985)
UNIX users poor recall on written test, but excellent recall when using computer
Black and Moran (1982) Learn 8 commands. Performance best for ‘infrequent,
discriminating’ words, e.g., insert, delete. Random words also good.
![Page 92: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/92.jpg)
92
Knowledge in the HeadKnowledge in the World“Menus relieve users of the need to remember
command names, but not of the need to know what functions can be performed by some commands…”
[Mayes et al., 1988]
Knowledge held by users and recalled‘Knowledge’ prompted by objects in world
![Page 93: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/93.jpg)
93
Command Languages Guidelines
Kidd (1982): Choose memorable, nonconfusable command word Use consistent command formats Keep command strings short Provide help Use natural syntax Place optional / least used commands at end of list Ensure useful defaults If errors frequent, then revert to computer initiated
![Page 94: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/94.jpg)
94
Menus
Advantages
Minimal typing
Low memory load
Defined structure
Disadvantages
Speed
Screen space
Poor for data entry
Computer initiated
![Page 95: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/95.jpg)
95
Menus
Single menu Binary options
Do you want instructions? Y / N
Linear sequence Series of interdependent menus
Sequence of forms for printing
Tree structure Semantic network
8 items per menu x 2 levels for time and error
![Page 96: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/96.jpg)
96
Tree structure
Menu Trees reduce error rate when compared with random Search faster over trees than alphabetic or
random Semantic networks
![Page 97: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/97.jpg)
97
Menu Guidelines
Task semantics Meaningful groupings Short cuts Items brief Consistent terminology Headings relevant Limit to 8 items
![Page 98: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/98.jpg)
98
Icons
Concrete vs. Abstract
Reference and interpretation
Verbal labels can speed response
![Page 99: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/99.jpg)
99
Icon design
Marcus (1992) Lexical: pixel shape, colour, blinking Synatatics: lines, pattern, size, shape Semantics: concrete, abstract, part Pragmatics: legibility, utility, identification,
recognition Dynamics: highlighting, selection
![Page 100: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/100.jpg)
100
Icon Guidelines
Represent object in familiar manner Limit number of different icons Make icon conspicuous Ensure selection made clear Ensure icons belong to ‘families’
![Page 101: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/101.jpg)
101
Working Memory Experiments
![Page 102: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/102.jpg)
102
Central executive
Articulatory control process
Auditory word presentation
Visual word presentation
Phonological store
Visual Cache
Inner scribe
Baddeley’s (1986) Model of Working Memory
![Page 103: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/103.jpg)
103
Slave Systems
Articulatory loop Memory Activation Rehearsal capacity
Word length effect and Rehearsal speed Visual cache
Visual patterns Complexity of pattern, number of elements etc
Inner scribe Sequences of movement Complexity of movement
![Page 104: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/104.jpg)
104
Recognition vs Recall
Recall Retrieve from memory
Remembering print command
Recognise To bring back into awareness through prompt
Recognising print icon Recognising print item in menu
![Page 105: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/105.jpg)
105
Recognition vs Recall
“The boxer chewed the meat” Recall: who chewed the meat? Recognition: did the boxer chew the meat?
Recognition easier than recall More information retrieved under recognition
than recall
![Page 106: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/106.jpg)
106
Long Term Memory as a Semantic Network
ANIMAL
Has SkinCan moveEatsBreathes
BIRDCan fly
Has WingsHas feathers
FISHHas finsCan swimHas gillsCANARY
Is YellowCan sing
![Page 107: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/107.jpg)
107
Levels and Reaction time
A canary is a canary
A canary is a bird
A canary is an animal
A canary is a fish
A canary can sing
A canary can fly
A canary has skin
A canary has gills
Collins & Quillian, 1969
0.9
1
1.1
1.2
1.3
1.4
1.5
0 1 2 False
Levels of Sentences
Mean
Reacti
on
Tim
e (
s)
Property
Category
![Page 108: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/108.jpg)
108
Canaries
Different times to verify the statements: A canary is a bird A canary can fly A canary can sing
Time proportional to movement through network
![Page 109: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/109.jpg)
109
Spreading Activation
When searching semantic network, activate paths for search
The active a node, the more easily information can be obtained from it
Semantic Priming Effects
![Page 110: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/110.jpg)
110
Forgetting
Encoding failure Failure of consolidation
Storage failure Disruption by new or existing information Associative interference
Two responses associated with same stimulus
Retrieval failure
![Page 111: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/111.jpg)
111
6. Navigation in User Interfaces
![Page 112: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/112.jpg)
112
Navigating Menus
![Page 113: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/113.jpg)
113
Hypertext
Bush (1945) Nelson (1963) Hyperlinks between objects in
document Navigation
Following links through the document
![Page 114: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/114.jpg)
114
Navigation Aids
![Page 115: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/115.jpg)
115
Searching the World Wide WebScanning modes Information need Information seeking Information use
Undirected Viewing General areas of interest; specific need to be revealed
Sweeping
Scan broadly a diversity of sources, taking advantage of what's easily accessible"
Browsing
Serendipitous discover
Conditioned Viewing Able to recognize topics of interest
"Discriminating"Browse in pre-selected sources on pre-specified topics of interest
"Learning"Increase knowledge about topics of interest
Informal Search Able to formulate simple queries
"Satisfying"Search is focused on area or topic, but a good-enough search is satisfactory
"Selecting"Increase knowledge on area within narrow boundaries
Formal Search Able to specify targets in detail
"Optimizing"Systematic gathering of information about an entity, following some method or procedure
"Retrieving"Formal use of information for decision-, policy-making
http://www.firstmonday.org/issues/issue5_2/choo/#fig1
![Page 116: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/116.jpg)
116
Choice of Aid x Search Style
Hammond and Allinson (1989)
![Page 117: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/117.jpg)
117
Information Foraging
Priolli, P. ,2007, Information Foraging Theory ‘information scent’ left on path of search by users More users on path means more ‘scent’ Users attempt to predict what information will
obtained from following a given path
![Page 118: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/118.jpg)
118
6. Interaction Devices: Entering Data
![Page 119: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/119.jpg)
119
Generic Forms of Interaction
Select Object Drag Object Change Orientation of Object Enter Data
![Page 120: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/120.jpg)
120
ConversationKevin: Want to see that film?
Brian: the uh (500 ms)… with the bloke from that other um that prison thing, [Shaw…]
Kevin: [The Shawshank Redemption] Tim something – [married that bird with the eyes]
Brian: [Robbins](laughs) Yeah…. 'The Green… whatsit?
Kevin: OK. There’s one at uh ... (looks at watch - 1.2 s) ... 20 to?
![Page 121: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/121.jpg)
121
Human Communication
Units of analysis Proposition Lack of ‘proper’ grammar
Adjacency Pairs Question-answer
Turn-taking Over-lapping
Extralinguistic and Paralinguistic cues Back channels Gestures
![Page 122: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/122.jpg)
122
Turn Taking
When it is your ‘turn’? Subtle cues from partner
When they are finishing When they want to speak
Unsubtle cues from machine Speak after beep Respond from list
![Page 123: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/123.jpg)
123
Asymmetrical Conversations
Telephone Short phrases Task oriented Problem of silence
Expert / naïve 90% of doctors ‘turns’ are questions Negotiation of knowledge level
![Page 124: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/124.jpg)
124
Is speaking to machines natural?
Turn taking Input / Feedback Turn taking cues
Asymmetrical partners Domain / World Knowledge Goals Language abilities Interpretation of ‘tokens’
![Page 125: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/125.jpg)
125
Is speaking to machines natural?
Politeness You don’t say ‘please’ to a machine
Social Norms What happens when machine violates norms? Should synthesised speech sound human? What are the ‘norms’?
![Page 126: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/126.jpg)
126
Back channelling from machines
MicroSoft Office Assistant
Process Control training simulation
Nodding ATM / TVM
![Page 127: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/127.jpg)
127
Breakdown and Repair
Redundancy Shared knowledge / anticipation Focus signals
Given/new Deixis
Comprehension signals Communication signals
![Page 128: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/128.jpg)
128
Eye contact and gaze
to convey interest signal comprehension and communication provide sense of engagement establish social presence
![Page 129: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/129.jpg)
129
Video tunnel
monitor
camera
mirror
half-silvered mirror
![Page 130: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/130.jpg)
130
7. Interaction Devices: Selecting Objects
![Page 131: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/131.jpg)
131
Deixis
Pointing to things using
words and gestures:
“Please can I have that.”
“Please can I have that tart.”
“Please can I have that fruit tart.”
“Please can I have that strawberry tart.”
![Page 132: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/132.jpg)
132
Deixis in HCI
Point Move cursor onto object Indicate object (highlighting)
Select Click button
Manipulate Click button
![Page 133: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/133.jpg)
133
Select Object Step One: Indicate Object
Enter Objects Name or I.D. Type Write Speak
Position Selector on Object Direct: touchscreen, stylus, pen Indirect: cursor (using mouse, trackball, joystick)
Step Two: Confirm Selection Press key to confirm Press button to confirm Tap object to confirm
![Page 134: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/134.jpg)
134
Device Models
Buxton’s 3-state device model
State0
State1
State2
![Page 135: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/135.jpg)
135
Application
State0
State1
State2
Out of range
Pen on
Pen off Button up
Button down
select drag
![Page 136: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/136.jpg)
136
Different pointing devices
Device State0 State1 State2
Touchscreen X
Pen X X X
Joystick X X
Mouse X X
![Page 137: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/137.jpg)
137
8. Multimodal Human Computer Interaction
![Page 138: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/138.jpg)
138
Divided Attention
Dual tasks require people to divide attention
Limited attentional resource that is shared between tasks
Depends on tasks, e.g., talk and drive, sight read music and shadow speech
![Page 139: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/139.jpg)
139
Allport et al. (1972)
Participants presented with essay, either visual and auditory
Recognition test far worse with auditory 0
10
20
30
40
50
Pictures Visual
Words
Auditory
Words
Control
Experiment
Err
ors
in R
eco
gnit
ion (
%)
![Page 140: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/140.jpg)
140
Task Similarity Interference when use same stimulus modality – visual or
auditory
Interference when use same stage of processing – input: central: output
Interference when use same memory codes – verbal or visual
Interference when use same response codes – spoken or manual
![Page 141: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/141.jpg)
141
Practice and Expertise
Highly practised dual-task performance, e.g., 6 weeks read + take dictation
Expert pianists can sight-read + shadow; expert typists can touch-type + shadow
Performance strategies Reduced demand Reduced resource load
![Page 142: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/142.jpg)
142
Contrasting Definitions
Technological Computers can present information using different
display modes and can receive information from different devices
Human Humans can receive information via different
senses and perform actions using different effectors
![Page 143: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/143.jpg)
143
Modalities
Modality Refers to human sensory modalities
Sight Hearing Touch Smell , Taste
and response modalities Speech Manual
Multimodal system Supports HCI using more than one sensory and
response modality
![Page 144: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/144.jpg)
144
Types of Multimodal System
Task
Goal
Dependent Independent
Independent Exclusive Concurrent
Dependent Alternate Synergistic
![Page 145: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/145.jpg)
145
Exclusive
Separate tasks, each with their own goals Performance on tasks interact Example:
Surveillance system with camera control Enter data + control camera Data entry delayed by camera control
![Page 146: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/146.jpg)
146
Alternate
Separate tasks with shared goals Performance on tasks interact Example:
Surveillance and target identification Control camera and zoom-in on targets Identify and report targets
![Page 147: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/147.jpg)
147
Concurrent
Separate tasks, each with their own goals Tasks do not affect each other Example:
Target identification with vehicle control Identify targets + manoeuvre vehicle
![Page 148: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/148.jpg)
148
Synergistic
Separate tasks with shared goal Tasks do not affect each other Example:
Mark distance on map ‘How far from here to here?’ Pen + speech
![Page 149: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/149.jpg)
149
Put That There
Spoken commands
Manual gestures
Bolt (1980)
Put that red
triangle…
…there
![Page 150: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/150.jpg)
150
IBM OpenSpace
![Page 151: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/151.jpg)
151
QuickSet
![Page 152: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/152.jpg)
152
Pointing and Speaking
People do not interact multimodally with multimodal interfaces
Speech and pointing is not dominant Around 20% of
conversation, and 14% of multimodal HCI
![Page 153: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/153.jpg)
153
Sequencing and Timing
Not all actions are simultaneous
99% of pen + speech has pen actions first
![Page 154: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/154.jpg)
154
Languages of Multimodal HCI
Speech: ‘place a boat dock on the east, no, the west end of Reward Lake’
Pen: [draws rectangle] ‘add dock’
![Page 155: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/155.jpg)
155
Future Multimodal HCI
Development of future multimodal systems “…depends on knowledge of the natural integration patterns that typify people’s use of combined input modes.”
“The design of multimodal systems that blend modes synergistically depends on…”
properties of different modes the information they conveyhow multimodal input is synchronized
![Page 156: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/156.jpg)
156
9. Future Human Computer Interaction
![Page 157: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/157.jpg)
157
Weiser’s Scales of Interaction
Inch, foot, yard Tab, pad, board
![Page 158: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/158.jpg)
158
Inch = Pad
ParcTAB PDA Individual many networkable
![Page 159: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/159.jpg)
159
Foot = pad
Notebooks Tablet E-paper Individual several
![Page 160: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/160.jpg)
160
Yard = board
Smartboards Plasma displays Control mimics Public sharable
![Page 161: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/161.jpg)
161
Forms of interaction
Implicit interaction devices Sensors Awareness Recognition technologies Natural
Explicit interaction devices Keyboard, pointing
![Page 162: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/162.jpg)
162
WIMP considered ‘fatal’?
Brad Rhodes The user has screen real-estate to burn
too much information on screen
The user has Fine motor control Eye-hand coordination
Digital information is a primary task
http://www.hitl.washington.edu/people/grof/VRAIS98/Rhodes.html
![Page 163: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/163.jpg)
163
Wearable WIMP
Clear mapping between user action and goal Windows
Multiple views for multiple functions Icons
Presentation of graphical signs and symbols for prompts and commands
Menus Presentation of restricted option set
Pointing devices Object selection and manipulation
![Page 164: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/164.jpg)
164
Windows on Wearables
Unclutter world Minimal information views Design display to augment world
Emergent features Design display to support pattern recognition
Integrate display Design display to interact with world
![Page 165: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/165.jpg)
165
WIMP considered ‘fatal’?
Brad Rhodes The user has screen real-estate to burn
too much information on screen
The user has Fine motor control Eye-hand coordination
Digital information is a primary task
http://www.hitl.washington.edu/people/grof/VRAIS98/Rhodes.html
![Page 166: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/166.jpg)
166
Wearable WIMP
Clear mapping between user action and goal Windows
Multiple views for multiple functions Icons
Presentation of graphical signs and symbols for prompts and commands
Menus Presentation of restricted option set
Pointing devices Object selection and manipulation
![Page 167: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/167.jpg)
167
Windows on Wearables
Unclutter world Minimal information views Design display to augment world
Emergent features Design display to support pattern recognition
Integrate display Design display to interact with world
![Page 168: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/168.jpg)
168
Icons on Wearables
Reduce text
Reduce information load
![Page 169: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/169.jpg)
169
Text vs. Graphics
Baber et al., 1999, Mobile Networks and Applications 4
Mean Reaction Times
Graphical TextualHMD 1.45s 1.85sVDU 1.0s 1.5s
![Page 170: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/170.jpg)
170
Menus on Wearables
Clarify options
Restrict activity
Access and enable through world activity
![Page 171: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/171.jpg)
171
Emergent Properties
Baber et al., 1999, Interact’99
![Page 172: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/172.jpg)
172
Limited Options
Bristow, WECAPC
![Page 173: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/173.jpg)
173
Integrate with world
Baber et al., 2000, Interact’00
![Page 174: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/174.jpg)
174
Pointing on Wearables
Selection on display
Selection in the world
![Page 175: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/175.jpg)
175
Selection in the World
Baber et al., 2000, Interact’00
![Page 176: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/176.jpg)
176
Selection from Display
Carnegie-Mellon Rotary dial selector
Accelerometer for simple gestures
Speech recognition
Bass et al., 1997, CHI’97
![Page 177: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/177.jpg)
177
Augmenting the World
![Page 178: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/178.jpg)
178
Digital Desk
Real paper on desk is scanned by a camera,
computer images are projected onto the paper
![Page 179: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/179.jpg)
179
Graspable Objects
BUILD-IT Move blocks on
table
Change layout of room on displays
Fjeld 1999
![Page 180: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/180.jpg)
180
GeoSPACE
Hiroshi Ishii – MIT
Physical objects to manipulate map display
![Page 181: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/181.jpg)
181
Rekimoto’s InfoBoard
Pick and place objects using pen
Move objects between laptops or virtual storage
![Page 182: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/182.jpg)
182
Data Storage
Data containers from Philips
![Page 183: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/183.jpg)
183
Data tiles
Magnetic tiles linked to ‘data’
Projection labels tiles
![Page 184: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/184.jpg)
184
Rekimoto’s Data Tiles
![Page 185: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/185.jpg)
185
Haptic VR
Provide touch to virtual objects using force-feedback devices
![Page 186: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/186.jpg)
186
Haptic Augmentation
Use real objects to control virtual representations
![Page 187: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/187.jpg)
187
Handheld AR
PDA used to provide ‘views’ on world
Views change with PDA movement
![Page 188: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/188.jpg)
188
Information Appliances
![Page 189: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/189.jpg)
189
Domestic Appliances
Microprocessors in cars, dishwashers, washing machines, televisions etc.
Domestic appliances as ‘embedded systems’
![Page 190: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/190.jpg)
190
Norman (1999)
Information Appliance:
“An appliance specializing in information: knowledge, facts, graphics, images, video, or sound. An information appliance is designed to perform a specific activity, such as music, photography, or writing. A distinguishing feature of information appliances is the ability to share information among themselves.”
D.A. Norman, 1999, The Invisible Computer, MIT Press, p. 53
![Page 191: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/191.jpg)
191
Pervasive / Ubiquitous
Invisible Computer
Embedded Systems
Networks
![Page 192: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/192.jpg)
192
Information Appliances
Digital camera: Capture image Immediate (shared) viewing of image Download image onto computer
Edit image Email image
![Page 193: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/193.jpg)
193
Three Axioms
Design Axiom 1: Simplicity The complexity of the appliance is that of the task not
the tool. The technology is invisible.
Design Axiom 2: Versatility Appliances are designed to allow and encourage novel,
creative interaction
Design Axiom 3: Pleasurability (fun) Products should be pleasurable, fun, enjoyable. A joy to
use, a joy to own.
D.A. Norman, 1999, The Invisible Computer, MIT Press, p. 67
![Page 194: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/194.jpg)
194
Current Trends
Device marriages digital camera + telephone PDA + telephone + MP3 + digital camera
Problems Visibility
Which device is currently ‘on’ Accessibility
How to switch devices / modes? Functionality
What functions are actually used?
![Page 195: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/195.jpg)
195
11. Distributed Cognition
![Page 196: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/196.jpg)
196
Using an Abacus for Addition
6 + 2 = 8
Heaven beads = 5 each
Earth beads = 1 each
8 + 2 = 10
![Page 197: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/197.jpg)
197
Shopping Lists
Construct list Using the process of writing the list to support
decision making Remember to consult list
Check the list during shopping Use the list to help navigate the store
Reading and interpret list Make sure everything is bought
![Page 198: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/198.jpg)
198
Shopping Lists
Memory aid Do we only buy what’s on the list? Do we buy items not on the list?
Additional tasks Does writing the list create a new task?
Modified task Does using the list change the way we shop?
![Page 199: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/199.jpg)
199
‘Things that make us smart’
Cognitive Artefacts used to assist everyday activity Shopping List Knotted handkerchief Calculator Diary
![Page 200: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/200.jpg)
200
Using Lists
Construct list Pre-computation [Hutchins]
Remember to consult list Checklists in inspection
Reading and interpret list Following checklists accurately
![Page 201: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/201.jpg)
201
Cognitive Artefacts
Distribute actions across time Pre-computation
Distribute actions across actors Distributed cognition
Change actions required
![Page 202: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/202.jpg)
202
Artefacts & Representation
Surface representation Display and maintenance of symbols on a
visible surface
Internal representation Storage and organisation of symbols
External representation
![Page 203: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/203.jpg)
203
Mapping
Naturalness Related to directness of mapping Related to expertise / familiarity
Appropriateness Information should be appropriate to the task
(neither more nor less)
![Page 204: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/204.jpg)
204
Distributed Cognition
Share knowledge and information across people, things, actions
Shopping lists
Ed Hutchins on calculating ships speed
E. Hutchins, 1990, The technology of team navigation, In Galegher et al. Intellectual Teamwork, LEA
![Page 205: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/205.jpg)
205
Calculating Ships Speed
1. D=RT, (R=D/T) using pencil and paper
2. D=RT, using calculator
3. 3-minute rule: 3-minutes = 1/20 of an hour, and 100yds in 1/20 of a nautical mile
1500 yds in 3 minutes = 15nmph
![Page 206: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/206.jpg)
206
Calculating Ships Speed
4. Nautical Slide Rule
![Page 207: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/207.jpg)
207
Calculating Ships Speed
Knowledge-in-the-head [1] 2000 yds nautical mile 60 minutes in hour D=RT Transposition of equations
Knowledge-in-the-head [2] 3-minute rule: schema for shortcut
![Page 208: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/208.jpg)
208
Calculating Ships Speed
Knowledge-in-the-World Nautical slide rule
Replace calculation with manipulation Colleagues
Draw upon experience of others Teamwork
Plotter Bearing taker Bearing timer-recorder
![Page 209: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/209.jpg)
209
12. Collaborative Working
![Page 210: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/210.jpg)
210
Traditional HCI
One User One Computer One Location One Task?
![Page 211: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/211.jpg)
211
Limitations of this view…
Task focus on computer AND on other artefacts, e.g., paper, telephone, filing cabinet etc.
Other artefacts imply more than one location Office work often collaborative SO: computer only part of the work domain and is
not designed to fit with other parts
![Page 212: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/212.jpg)
212
Personal Computers in the Office
1970s: development of the ‘desktop metaphor’ Objects on screen analogous to objects in world,
e.g., folders, files etc. Manipulation of objects on screen analogous to
manipulation of objects in world, e.g., open folders, put files into folders
BUT: no link between virtual and real objects
![Page 213: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/213.jpg)
213
Changing HCI
Many Users Communication and Collaboration Multiple Access (WWW)
Many Computing Devices Embedded Systems PDAs, cell-phones and beyond
Many Locations Physical location (mobility) Virtual locations (WWW)
Many Tasks
![Page 214: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/214.jpg)
214
Computer Mediated Communication (CMC)
Same place Different place
Same time
(synchronous)
Face-to-face Telephone
Different time
(asynchronous)
Post-in notes Letter
![Page 215: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/215.jpg)
215
CMC
Synchronous Speech: telephone, videophone, videoconference Text: SMS, chatrooms, instant messaging
Asynchronous Speech: voicemail, answerphone Text: bulletin boards, newsgroups, computer conferencing
Mixed with other tasks Electronic Meeting Room
![Page 216: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/216.jpg)
216
Shared Representations
Shared Calendars Access appointments diary to view or edit
(depending on privileges)
Shared Awareness
Shared Activities
![Page 217: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/217.jpg)
217
Shared Awareness
Portholes: Xerox 1992
Low resolution images of people in their offices
Overhearing / overseeing
![Page 218: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/218.jpg)
218
Shared Activities
Work on same text Add comments Restructure
Work on same drawing Modify Suggest alternatives
![Page 219: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/219.jpg)
219
Collaborative Virtual Environments (CVEs)
Distributed VR systems
Individuals collaborate in virtual landscapes to share information and work together
![Page 220: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/220.jpg)
220
CVEs
Meeting places Multiple representations Shared context
Shared knowledge, environment, tasks, objects Awareness of others Communication
![Page 221: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/221.jpg)
221
Reading Virtual Control Room
Avatars
VirtualDisplayBoards
Augmented Displays
VirtualMonitors
ToVirtualPlant
![Page 222: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/222.jpg)
222
Interaction in Virtual Space
With other actors
With virtual objects
With real objects?MagicBook project
![Page 223: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/223.jpg)
223
Collaborating in real space
Technology to bring the virtual world to the real world
Shared representations on familiar surfaces
Surfaces to support interaction
![Page 224: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/224.jpg)
224
RoomWareG
MD
-IPSI, W
iege, Wilkhahn
Source: Carroll, p. 569
ConnecTable
CommChair
InteracTable
DynaWall
![Page 225: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/225.jpg)
225
Shared Awareness
Portholes: Xerox 1992
Low resolution images of people in their offices
Overhearing / overseeing
![Page 226: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/226.jpg)
226
Exercise #.1
1. Apple 2. North 3. Charlie 4. Nickel 5. Red 6. Banana 7. South 8. Fred 9. Cent 10. Green 11. Pear 12. East 13. George 14. Dime 15. Yellow 16. Grape 17. Wayne 18. Dave 19. Penny 20. Blue
Make a note of the word numbers and enter into table
How many people wrote: West or Orange? What pattern do you notice in the words?
![Page 227: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/227.jpg)
227
Exercise #.2
1. Latch 2. Bream 3. Hot 4. Mayor 5. Jab6. Busk 7. Else 8. Wage 9. Clog 10. Jowl 11. Chap 12. Big 13. Smug 14. Duck 15. Trout 16. Blot 17. Reek 18. Tape 19. List 20. Skirt
Make a note of the word numbers and enter into table
What pattern do you notice in the words? Did you do as well as with the first list?
![Page 228: 1 Interactive Systems Design MSc in Communications, Computing and Human-Centred Systems Dr. Chris Baber](https://reader035.vdocument.in/reader035/viewer/2022062421/56649c925503460f9494d947/html5/thumbnails/228.jpg)
228
Exercise #.3
1. Time 2. House 3. Mit 4. Stab 5. Solve6. Draft 7. Say 8. Off 9. Boil 10. Court 11. Greet 12. Slot 13. Hand 14. Dirt 15. Clot 16. Stale 17. Out 18. Dumped 19. Stone 20. Dice
• Make a note of the word numbers and enter into table
• Did you do as well as with the other lists?