Human Computer

Interaction
Module 1
HCI Foundations
QR Code – E2+TE2
QR Code – E1+TE1
Outline
• Introduction, Input–output channels, Human memory
Thinking: reasoning and problem solving,
• Emotion, Individual differences, Psychology and the
design of interactive systems, Text entry devices,
Positioning, pointing and drawing,.
• Display devices, Devices for virtual reality and 3D
interaction, Physical controls, sensors and special
devices, Paper: printing and scanning.

4
What is HCI?

5
Introduction
• What is Human-computer interaction ?
• Human-computer interaction (HCI) is a
multidisciplinary field of study focusing on the
design of computer technology and, in particular,
the interaction between humans (the users) and
computers.
• While initially concerned with computers, HCI has since
expanded to cover almost all forms of information
technology design.

6
 The Meteoric Rise of HCI
• HCI surfaced in the 1980s with the advent of personal computing, just as
machines such as the Apple Macintosh, IBM PC 5150 and Commodore 64
started turning up in homes and offices in society-changing numbers.
• For the first time, sophisticated electronic systems were available to
general consumers for uses such as word processors, games units and
accounting aids.
• Consequently, as computers were no longer room-sized, expensive tools
exclusively built for experts in specialized environments, the need to create
human-computer interaction that was also easy and efficient for less
experienced users became increasingly vital.
• From its origins, HCI would expand to incorporate multiple disciplines, such
as computer science, cognitive science and human-factors engineering.
7
The Meteoric Rise of HCI

• Initially, HCI researchers focused on improving the usability of desktop

computers
• i.e., practitioners concentrated on how easy computers are to learn and use

• With the rise of technologies such as the Internet and the

smartphone, computer use would increasingly move away from the
desktop to embrace the mobile world

8
The UX Value of HCI and Its
Related Realms

9
The UX Value of HCI and Its
Related Realms
• HCI is a broad field which overlaps with areas such
as:
• User-centered design (UCD),
• User interface (UI) design and
• User experience (UX) design

• In many ways, HCI was the forerunner to UX design.

10
 HCI vs UX designers
HCI UX
• Practitioners of HCI tend to be more • UX designers are almost invariably
academically focused. industry-focused and involved in building
• Involved in scientific research and products or services—e.g., smartphone
developing empirical understandings of apps and websites.
users • UX designers have a wealth of resources
to draw from, although much research
remains suited to academic audiences.

11
HCI
• What happens when a human and a computer
system interact to perform a task?
• Task - write document, explore the web, solve mathematic problem,
search for knowledge , drive home, book movie tickets, do banking, ...
• Why is this important?
1. Computer systems affect every person
2. Safety, satisfaction, utility is critical
3. Product success depends on ease of use

12
Interfaces in the Real World
• Not just computers!
• Media player
• Wristwatch
• Phone
• Copier
• Car
• Plane cockpit
• Airline reservation
• Air traffic control

13
Introduction
• User
• By "user", we may mean an individual user, a group of users working
together. An appreciation of the way people's sensory systems (sight,
hearing, touch) relay information is vital.

14
 Introduction
• Computer
• When we talk about the computer, we're referring to any
technology ranging from desktop computers, to large scale
computer systems.
• Interaction
• By interaction we mean any communication between a user and
computer, be it direct or indirect.
• Direct interaction - involves a dialog with feedback and
control throughout performance of the task.
• Indirect interaction - involves batch processing or intelligent
sensors controlling the environment

15
Contd..,

Source: [Link] 16
Input – Output Channels

17
the human
the human
• Information i/o …
• visual, auditory, haptic, movement
• Information stored in memory
• sensory, short-term, long-term
• Information processed and applied
• reasoning, problem solving, skill, error
• Emotion influences human capabilities
• Each person is different
Vision
Two stages in vision

• physical reception of stimulus

• processing and interpretation of stimulus

The Eye - physical reception
• mechanism for receiving light and transforming it into
electrical energy
• light reflects from objects
• images are focused upside-down on retina
• retina contains rods for low light vision and cones for colour
vision
• ganglion cells (brain!) detect pattern and movement
The Eye - physical reception

22
Interpreting the signal
• Size and depth
• visual angle indicates how much of view object occupies
(relates to size and distance from eye)

• visual acuity is ability to perceive detail (limited)

• familiar objects perceived as constant size
(in spite of changes in visual angle when far away)

• cues like overlapping help perception of size and depth

Interpreting the signal (cont)
• Brightness
• subjective reaction to levels of light
• affected by luminance of object
• measured by just noticeable difference
• visual acuity increases with luminance as does flicker

• Colour
• made up of hue, intensity, saturation
• cones sensitive to colour wavelengths
• blue acuity is lowest
• 8% males and 1% females colour blind
Interpreting the signal (cont)
• The visual system compensates for:
• movement
• changes in luminance.

• Context is used to resolve ambiguity

• Optical illusions sometimes occur due to over compensation

Optical Illusions
Optical Illusions

the Ponzo illusion the Muller Lyer illusion

Reading
• Several stages:
• visual pattern perceived
• decoded using internal representation of language
• interpreted using knowledge of syntax, semantics, pragmatics

• Reading involves saccades and fixations

• Perception occurs during fixations
• Word shape is important to recognition
• Negative contrast improves reading from computer screen
Reading

29
Hearing
• Provides information about environment:
distances, directions, objects etc.
• Physical apparatus:
• outer ear – protects inner and amplifies sound
• middle ear – transmits sound waves as
vibrations to inner ear
• inner ear – chemical transmitters are released
and cause impulses in auditory nerve
• Sound
• pitch – sound frequency
• loudness – amplitude
• timbre – type or quality
Hearing (cont)
• Humans can hear frequencies from 20Hz to 15kHz
• less accurate distinguishing high frequencies than low.

• Auditory system filters sounds

• can attend to sounds over background noise.
• for example, the cocktail party phenomenon.
Touch
• Provides important feedback about environment.
• May be key sense for someone who is visually impaired.
• Stimulus received via receptors in the skin:
• thermoreceptors – heat and cold
• nociceptors – pain
• mechanoreceptors – pressure (some instant, some continuous)
• Some areas more sensitive than others e.g. fingers.
• Kinethesis - awareness of body position
• affects comfort and performance.
Movement
• Time taken to respond to stimulus:
reaction time + movement time

• Movement time dependent on age, fitness etc.

• Reaction time - dependent on stimulus type:

• visual ~ 200ms
• auditory ~ 150 ms
• pain ~ 700ms

• Increasing reaction time decreases accuracy in the unskilled

operator but not in the skilled operator.
Movement (cont)
• Fitts' Law describes the time taken to hit a screen target:

Mt = a + b log2(D/S + 1)
where: a and b are empirically determined constants
Mt is movement time
D is Distance
S is Size of target

Þtargets as large as possible

Þdistances as small as possible
Memory
There are three types of memory function:

Sensory memories

Short-term memory or working memory

Long-term memory

Selection of stimuli governed by level of arousal.

sensory memory
• Buffers for stimuli received through senses
• iconic memory: visual stimuli
• echoic memory: aural stimuli
• haptic memory: tactile stimuli
• Examples
• “sparkler” trail
• stereo sound
• Continuously overwritten
Short-term memory (STM)
• Scratch-pad for temporary recall
• rapid access ~ 70ms

• rapid decay ~ 200ms

• limited capacity - 7± 2 chunks

Short-term memory (STM)

38
Examples

212348278493202

0121 414 2626

HEC ATR ANU PTH ETR EET

Long-term memory (LTM)
• Repository for all our knowledge
• slow access ~ 1/10 second
• slow decay, if any
• huge or unlimited capacity

• Two types
• episodic – serial memory of events
• semantic – structured memory of facts, concepts, skills

semantic LTM derived from episodic LTM

Long-term memory (cont.)
• Semantic memory structure
• provides access to information
• represents relationships between bits of information
• supports inference

• Model: semantic network

• inheritance – child nodes inherit properties of parent nodes
• relationships between bits of information explicit
• supports inference through inheritance
LTM - semantic network
Models of LTM - Frames
• Information organized in data structures
• Slots in structure instantiated with values for instance of
data
• Type–subtype relationships

DOG COLLIE
Fixed Fixed
legs: 4 breed of: DOG
type: sheepdog
Default
diet: carniverous Default
sound: bark size: 65 cm
Variable Variable
size: colour
colour
Models of LTM - Scripts
Model of stereotypical information required to interpret situation

Script has elements that can be instantiated with values for context

Script for a visit to the vet

Entry conditions: dog ill Roles: vet examines

vet open diagnoses
owner has money treats
owner brings dog in
Result: dog better
pays
owner poorer
takes dog out
vet richer
Scenes: arriving at reception
Props: examination table
waiting in room
medicine
examination
instruments
paying
Tracks: dog needs medicine
dog needs operation
Models of LTM - Production
rules
Representation of procedural knowledge.

Condition/action rules
if condition is matched
then use rule to determine action.

IF dog is wagging tail

THEN pat dog

IF dog is growling
THEN run away
LTM - Storage of information
• rehearsal
• information moves from STM to LTM

• total time hypothesis

• amount retained proportional to rehearsal time

• distribution of practice effect

• optimized by spreading learning over time

• structure, meaning and familiarity

• information easier to remember
LTM - Forgetting
decay
• information is lost gradually but very slowly

interference
• new information replaces old: retroactive interference
• old may interfere with new: proactive inhibition

so may not forget at all memory is selective …

… affected by emotion – can subconsciously `choose' to forget

LTM - retrieval
recall
• information reproduced from memory can be assisted by cues, e.g.
categories, imagery

recognition
• information gives knowledge that it has been seen before
• less complex than recall - information is cue
 Thinking

Reasoning
deduction, induction, abduction
Problem solving
Thinking
• Thinking is basically the way how information is
processed and manipulated.
• It is complex and separates human from other
information- processing systems, both natural and
artificial. E.g., animals and AI systems.
• It requires different amount of knowledge. E.g.,
performing a subtraction calculation, understanding a
newspaper headlines
Reasoning
• It is the process by which we use the knowledge we
have to draw conclusions or infer something new
about the domain of interest.
• Different types of reasoning are:
[Link] Reasoning.
[Link] Reasoning.
[Link] Reasoning
Deductive Reasoning
• Deduction:
• derive logically necessary conclusion from given premises.
e.g. If it is Friday then she will go to work
It is Friday
Therefore she will go to work.

• Logical conclusion not necessarily true:

e.g. If it is raining then the ground is dry
It is raining
Therefore the ground is dry
Deduction (cont.)
• When truth and logical validity clash …
e.g. Some people are babies
Some babies cry
Inference - Some people cry
Correct?

• People bring world knowledge to bear

Inductive Reasoning
• Induction:
• generalize from cases seen to cases unseen
e.g. all elephants we have seen have trunks
therefore all elephants have trunks.

• Unreliable:
• can only prove false not true

… but useful!

• Humans not good at using negative evidence

e.g. Wason's cards.
Wason's cards

7 E 4 K
If a card has a vowel on one side it has an even number on the other

Is this true?

How many cards do you need to turn over to find out?

…. and which cards?

Abductive reasoning
• reasoning from event to cause
e.g. Sam drives fast when drunk.
If I see Sam driving fast, assume drunk.

• Unreliable:
• can lead to false explanations
Problem solving
• Process of finding solution to unfamiliar task using knowledge.

• Several theories.

• Gestalt theory – insight and knowledge

• problem solving both productive and reproductive
• productive draws on insight and restructuring of problem
• attractive but not enough evidence to explain `insight' etc.
• move away from behaviourism and led towards information processing theories
Problem solving (cont.)
• Analogy
• analogical mapping:
• novel problems in new domain?
• use knowledge of similar problem from similar domain
• analogical mapping difficult if domains are semantically different

• Skill acquisition
• skilled activity characterized by chunking
• lot of information is chunked to optimize STM
• conceptual rather than superficial grouping of problems
• information is structured more effectively
Errors and mental models
Types of error

• slips
• right intention, but failed to do it right
• causes: poor physical skill,inattention etc.
• change to aspect of skilled behaviour can cause slip

• mistakes
• wrong intention
• cause: incorrect understanding
humans create mental models to explain behaviour.
if wrong (different from actual system) errors can occur
Emotions
• The biological response to physical stimuli is called affect

• Positive emotions - enable us to think more creatively, to solve

complex problems

• Negative emotions - pushes us into narrow, focussed thinking

• Emotion clearly involves both cognitive and physical responses to stimuli

Emotion - Theories

• James–Lange theory: emotion was the interpretation of a

physiological response
• Cannon: emotion is a psychological response to a stimuli
• Schacter-Singer: emotion is the result of our evaluation of
our physiological responses, in the light of the whole
situation we are in
Emotion - Interface Design

• Implications for interface design

• stress will increase the difficulty of problem solving
• relaxed users will be more forgiving of shortcomings in
design
• aesthetically pleasing and rewarding interfaces will increase
positive affect
Individual differences
• long term
– gender, physical and intellectual abilities
• short term
– effect of stress or fatigue
• changing
– age
Ask yourself:
will design decision exclude section of user population?
Psychology and the Design of
Interactive System
• The intersection of psychology and the design of
interactive systems is a crucial aspect of creating
user-friendly and effective interfaces.
• This interdisciplinary field, often referred to as
human-computer interaction (HCI) or user
experience (UX) design
• focuses on understanding how users interact with
technology
• how to design systems that meet their needs,
• preferences, and
• cognitive abilities.
 Psychology and the Design of
Interactive System
• Some direct applications e.g. blue acuity is poor
 blue should not be used for important detail
• However, correct application generally requires understanding of context in
psychology, and an understanding of particular experimental conditions
• A lot of knowledge has been distilled in
• guidelines - general design principles and guidelines can be and have
been derived from the theories
• cognitive models - specific model of human problem solving, others of
physical activity, and attempt a more comprehensive view of cognition.
• experimental and analytic evaluation techniques
Psychology and the Design of
Interactive System
[Link]-Centered Design (UCD): UCD is a fundamental approach that
involves designing products and systems with the end user in mind. It
emphasizes involving users in the design process through activities
such as user research, persona development, and usability testing.
2. Cognitive Psychology Principles:
• Memory: Consider limitations in short-term and long-term memory. Use
strategies like chunking, repetition, and clear information architecture to
enhance memory retention.
• Attention: Understand how attention works and design interfaces that guide
users' attention effectively. Minimize distractions and prioritize important
information.
Psychology and the Design of
Interactive System
3. Perception and Sensation:
• Visual Hierarchy: Utilize visual elements to guide users' focus on important
information. Use color, contrast, and size to create a clear visual hierarchy.
• Feedback: Provide immediate and informative feedback to users when they
interact with the system. This helps users understand the consequences of
their actions.
4. Human Error and Error Recovery:
• Prevent Errors: Design systems that minimize the likelihood of errors through
clear instructions, intuitive interfaces, and affordances.
• Error Messages: If errors occur, provide user-friendly error messages that
guide users on how to recover from mistakes.
Psychology and the Design of
Interactive System
5. User Feedback and Usability Testing:
• Usability Testing: Regularly test prototypes and final products with real users to identify
usability issues and gather feedback for improvements.
• Iterative Design: Use an iterative design process, incorporating user feedback to refine
and enhance the user experience over time.

6. Emotional Design:
• Aesthetics: Consider the emotional impact of the design. Visual appeal, aesthetics, and
emotional engagement can significantly impact user satisfaction and overall experience.
Psychology and the Design of
Interactive System
7. Accessibility and Inclusivity:
• Universal Design: Design interfaces that are accessible to a diverse range of
users, including those with disabilities. Consider factors such as color
contrast, font size, and alternative navigation methods.
8. Social Psychology:
• Collaboration and Communication: Understand how users interact socially
and design systems that facilitate collaboration and effective communication.
9. Adaptability and Flexibility:
• User Preferences: Allow users to customize and personalize their experience
whenever possible. Consider different user preferences and adapt the
interface accordingly.
the computer
The Computer
a computer system is made up of various elements each of these
elements affects the interaction

• input devices – text entry and pointing

• output devices – screen (small & large), digital paper
• virtual reality – special interaction and display devices
• physical interaction – e.g. sound, haptic, bio-sensing
• paper – as output (print) and input (scan)
• memory – RAM & permanent media, capacity & access
• processing – speed of processing, networks
Interacting with computers
to understand human–computer interaction
… need to understand computers!

what goes in and out

devices, paper,
sensors, etc.

what can it do?

memory, processing,
networks
A ‘typical’ computer system
?
• screen, or monitor, on which there are windows
• keyboard
• mouse/trackpad

• variations
• desktop
• laptop
• PDA
the devices dictate the styles of interaction that the system supports
If we use different devices, then the interface will support a different style of
interaction
How many …
• computers in your house?
• hands up, …
… none, 1, 2 , 3, more!!

• computers in your pockets?

are you thinking …

… PC, laptop, PDA ??
How many computers …
in
inyour
yourhouse?
pockets?
• •PCPDA
• •TV,phone,
VCR, DVD,
camera
HiFi, cable/satellite TV
• •microwave,
smart card,cooker,
card with
washing
magnetic
machine
strip?
• •central
electronic
heating
car key
• •security
USB memory
system

can
tryyou
your
think
pockets
of more?
and bags
Interactivity?
Long ago in a galaxy far away … batch processing
• punched card stacks or large data files prepared
• long wait ….
• line printer output
… and if it is not right …

Now most computing is interactive

• rapid feedback
• the user in control (most of the time)
• doing rather than thinking …

Is faster always better?

Richer interaction
Text Entry Devices
keyboards (QWERTY et al.)
chord keyboards, phone pads
handwriting, speech
Keyboards

• Most common text input device

• Allows rapid entry of text by experienced users

• Keypress closes connection, causing a character code to be sent

• Usually connected by cable, but can be wireless

layout – QWERTY
• Standardised layout
but …
• non-alphanumeric keys are placed differently
• accented symbols needed for different scripts
• minor differences between UK and USA keyboards

• QWERTY arrangement not optimal for typing

– layout to prevent typewriters jamming!
• Alternative designs allow faster typing but large social base of QWERTY typists produces
reluctance to change
alternative keyboard layouts
Alphabetic
• keys arranged in alphabetic order
• not faster for trained typists
• not faster for beginners either!

Dvorak
• common letters under dominant fingers
• biased towards right hand
• common combinations of letters alternate between hands
• 10-15% improvement in speed and reduction in fatigue
• But - large social base of QWERTY typists produce market pressures not to change
special keyboards
• designs to reduce fatigue for RSI
• for one handed use
e.g. the Maltron left-handed keyboard
Chord keyboards
only a few keys - four or 5
letters typed as combination of keypresses
compact size
– ideal for portable applications
short learning time
– keypresses reflect letter shape
fast
– once you have trained

BUT - social resistance, plus fatigue after extended use

NEW – niche market for some wearables
phone pad and T9 entry
• use numeric keys with
multiple presses
2–abc 6-mno
3-def 7-pqrs
4-ghi 8-tuv
5-jkl 9-wxyz
hello = 4433555[pause]555666
surprisingly fast!

• T9 predictive entry
• type as if single key for each letter
• use dictionary to ‘guess’ the right word
• hello = 43556 …
• but 26 -> menu ‘am’ or ‘an’
Handwriting recognition
• Text can be input into the computer, using a pen and a digesting tablet
• natural interaction

• Technical problems:
• capturing all useful information - stroke path, pressure, etc. in a natural manner
• segmenting joined up writing into individual letters
• interpreting individual letters
• coping with different styles of handwriting

• Used in PDAs, and tablet computers …

… leave the keyboard on the desk!
Speech recognition
• Improving rapidly

• Most successful when:

• single user – initial training and learns peculiarities
• limited vocabulary systems

• Problems with
• external noise interfering
• imprecision of pronunciation
• large vocabularies
• different speakers
Numeric keypads
• for entering numbers quickly:
• calculator, PC keyboard
• for telephones
1 2 3 7 8 9

not the same!! 4 5 6 4 5 6

7 8 9 1 2 3

ATM like phone 0 # 0 . =

*
telephone calculator
Positioning, Pointing And
Drawing

mouse, touchpad
trackballs, joysticks etc.
touch screens, tablets
eyegaze, cursors
the Mouse
• Handheld pointing device
• very common
• easy to use

• Two characteristics
• planar movement
• buttons
(usually from 1 to 3 buttons on top, used for making a selection, indicating an option, or to
initiate drawing etc.)
the mouse (ctd)
Mouse located on desktop
• requires physical space
• no arm fatigue

Relative movement only is detectable.

Movement of mouse moves screen cursor
Screen cursor oriented in (x, y) plane,
mouse movement in (x, z) plane …

… an indirect manipulation device.

• device itself doesn’t obscure screen, is accurate and fast.
• hand-eye coordination problems for novice users
How does it work?
Two methods for detecting motion

• Mechanical
• Ball on underside of mouse turns as mouse is moved
• Rotates orthogonal potentiometers
• Can be used on almost any flat surface

• Optical
• light emitting diode on underside of mouse
• may use special grid-like pad or just on desk
• less susceptible to dust and dirt
• detects fluctuating alterations in reflected light intensity to calculate relative motion in (x, z) plane
Even by foot …
• some experiments with the footmouse
• controlling mouse movement with feet …
• not very common :-)

• but foot controls are common elsewhere:

• car pedals
• sewing machine speed control
• organ and piano pedals
Touchpad
• small touch sensitive tablets
• ‘stroke’ to move mouse pointer
• used mainly in laptop computers

• good ‘acceleration’ settings important

• fast stroke
• lots of pixels per inch moved
• initial movement to the target
• slow stroke
• less pixels per inch
• for accurate positioning
Trackball and thumbwheels
Trackball
• ball is rotated inside static housing
• like an upsdie down mouse!
• relative motion moves cursor
• indirect device, fairly accurate
• separate buttons for picking
• very fast for gaming
• used in some portable and notebook computers.

Thumbwheels …
• for accurate CAD – two dials for X-Y cursor position
• for fast scrolling – single dial on mouse
Joystick and keyboard nipple
Joystick
• indirect
pressure of stick = velocity of movement
• buttons for selection
on top or on front like a trigger
• often used for computer games
aircraft controls and 3D navigation

Keyboard nipple
• for laptop computers
• miniature joystick in the middle of the keyboard
Touch-sensitive screen
• Detect the presence of finger or stylus on the screen.
• works by interrupting matrix of light beams, capacitance changes or ultrasonic reflections
• direct pointing device

• Advantages:
• fast, and requires no specialised pointer
• good for menu selection
• suitable for use in hostile environment: clean and safe from damage.

• Disadvantages:
• finger can mark screen
• imprecise (finger is a fairly blunt instrument!)
• difficult to select small regions or perform accurate drawing
• lifting arm can be tiring
Stylus and light pen
Stylus
• small pen-like pointer to draw directly on screen
• may use touch sensitive surface or magnetic detection
• used in PDA, tablets PCs and drawing tables

Light Pen
• now rarely used
• uses light from screen to detect location

BOTH …
• very direct and obvious to use
• but can obscure screen
• A light pen interacts with the light emitted from a computer screen, primarily used in graphic design. A
stylus, however, uses principles of induction to interact with touch screens, like tablets and smartphones
Digitizing tablet
• Mouse like-device with cross hairs

• used on special surface

- rather like stylus

• very accurate
- used for digitizing maps
Eyegaze
• control interface by eye gaze direction
• e.g. look at a menu item to select it
• uses laser beam reflected off retina
• … a very low power laser!
• mainly used for evaluation (ch x)
• potential for hands-free control
• high accuracy requires headset
• cheaper and lower accuracy devices available
sit under the screen like a small webcam
Cursor keys
• Four keys (up, down, left, right) on keyboard.
• Very, very cheap, but slow.
• Useful for not much more than basic motion for text-editing tasks.
• No standardised layout, but inverted “T”, most common
Discrete positioning controls
• in phones, TV controls etc.
• cursor pads or mini-joysticks
• discrete left-right, up-down
• mainly for menu selection
display devices

bitmap screens (CRT & LCD)

large & situated displays
digital paper
bitmap displays
• screen is vast number of coloured dots
resolution and colour depth
• Resolution … used (inconsistently) for
• number of pixels on screen (width x height)
• e.g. SVGA 1024 x 768, PDA perhaps 240x400
• density of pixels (in pixels or dots per inch - dpi)
• typically between 72 and 96 dpi
• Aspect ratio
• ration between width and height
• 4:3 for most screens, 16:9 for wide-screen TV
• Colour depth:
• how many different colours for each pixel?
• black/white or greys only
• 256 from a pallete
• 8 bits each for red/green/blue = millions of colours
Cathode ray tube
• Stream of electrons emitted from electron gun, focused and directed by magnetic fields, hit
phosphor-coated screen which glows
• used in TVs and computer monitors
Health hazards of CRT !
• X-rays: largely absorbed by screen (but not at rear!)
• UV- and IR-radiation from phosphors: insignificant levels
• Radio frequency emissions, plus ultrasound (~16kHz)
• Electrostatic field - leaks out through tube to user. Intensity dependant on distance and humidity.
Can cause rashes.
• Electromagnetic fields (50Hz-0.5MHz). Create induction currents in conductive materials,
including the human body. Two types of effects attributed to this: visual system - high incidence
of cataracts in VDU operators, and concern over reproductive disorders (miscarriages and birth
defects).
Health hints …
• do not sit too close to the screen
• do not use very small fonts
• do not look at the screen for long periods without a break
• do not place the screen directly in front of a bright window
• work in well-lit surroundings

Take extra care if pregnant.

but also posture, ergonomics, stress
Liquid crystal displays
• Smaller, lighter, and … no radiation problems.

• Found on PDAs, portables and notebooks,

… and increasingly on desktop and even for home TV

• also used in dedicted displays:

digital watches, mobile phones, HiFi controls

• How it works …
• Top plate transparent and polarised, bottom plate reflecting.
• Light passes through top plate and crystal, and reflects back to eye.
• Voltage applied to crystal changes polarisation and hence colour
• N.B. light reflected not emitted => less eye strain
special displays
Random Scan (Directed-beam refresh, vector display)
• draw the lines to be displayed directly
• no jaggies
• lines need to be constantly redrawn
• rarely used except in special instruments

Direct view storage tube (DVST)

• Similar to random scan but persistent => no flicker
• Can be incrementally updated but not selectively erased
• Used in analogue storage oscilloscopes
large displays
• used for meetings, lectures, etc.
• technology
plasma – usually wide screen
video walls – lots of small screens together
projected – RGB lights or LCD projector
– hand/body obscures screen
– may be solved by 2 projectors + clever software
back-projected
– frosted glass + projector behind
situated displays
• displays in ‘public’ places
• large or small
• very public or for small group
• display only
• for information relevant to location
• or interactive
• use stylus, touch sensitive screem
• in all cases … the location matters
• meaning of information or interaction is related to the location
Hermes a situated display
• small displays beside office doors
• handwritten notes left using stylus
small displays
• office owner reads notes using web interface
beside
office doors

handwritten
office owner
notes left
reads notes
using stylus
using web interface
Digital paper
appearance
• what?
• thin flexible sheets
• updated electronically
cross
• but retain display section

• how?
• small spheres turned
• or channels with coloured liquid
and contrasting spheres
• rapidly developing area
physical controls, sensors etc.

special displays and gauges

sound, touch, feel, smell
physical controls
environmental and bio-sensing
dedicated displays
• analogue representations:
• dials, gauges, lights, etc.

• digital displays:
• small LCD screens, LED lights, etc.

• head-up displays
• found in aircraft cockpits
• show most important controls
… depending on context
Sounds
• beeps, bongs, clonks, whistles and whirrs

• used for error indications

• confirmation of actions e.g. keyclick

also see chapter 10

Touch, feel, smell
• touch and feeling important
• in games … vibration, force feedback
• in simulation … feel of surgical instruments
• called haptic devices

• texture, smell, taste

• current technology very limited
BMW iDrive
• for controlling menus
• feel small ‘bumps’ for each item
• makes it easier to select options by feel
• uses haptic technology from Immersion Corp.
physical controls
• specialist controls needed …
• industrial controls, consumer products, etc.

easy-clean
smooth buttons

multi-function
control
large buttons
clear dials

tiny buttons
Environment and bio-sensing
• sensors all around us
• car courtesy light – small switch on door
• ultrasound detectors – security, washbasins
• RFID security tags in shops
• temperature, weight, location

• … and even our own bodies …

• iris scanners, body temperature, heart rate, galvanic skin response, blink rate
paper: printing and scanning

print technology
fonts, page description, WYSIWYG
scanning, OCR
Printing
• image made from small dots
• allows any character set or graphic to be printed,
• critical features:
• resolution
• size and spacing of the dots
• measured in dots per inch (dpi)
• speed
• usually measured in pages per minute
• cost!!
Types of dot-based printers
• dot-matrix printers
• use inked ribbon (like a typewriter
• line of pins that can strike the ribbon, dotting the paper.
• typical resolution 80-120 dpi
• ink-jet and bubble-jet printers
• tiny blobs of ink sent from print head to paper
• typically 300 dpi or better .
• laser printer
• like photocopier: dots of electrostatic charge deposited on drum, which picks up toner (black powder
form of ink) rolled onto paper which is then fixed with heat
• typically 600 dpi or better.
Printing in the workplace
• shop tills
• dot matrix
• same print head used for several paper rolls
• may also print cheques

• thermal printers
• special heat-sensitive paper
• paper heated by pins makes a dot
• poor quality, but simple & low maintenance
• used in some fax machines
Fonts
• Font – the particular style of text

Courier font
Helvetica font
Palatino font
Times Roman font
• §´µº¿Â Ä¿~ (special symbol)

• Size of a font measured in points (1 pt about 1/72”)

(vaguely) related to its height
This is ten point Helvetica
This is twelve point
This is fourteen point
This is eighteen point
and this is twenty-four point
Fonts (ctd)
Pitch
• fixed-pitch – every character has the same width
e.g. Courier
• variable-pitched – some characters wider
e.g. Times Roman – compare the ‘i’ and the “m”
Serif or Sans-serif
• sans-serif – square-ended strokes
e.g. Helvetica
• serif – with splayed ends (such as)
e.g. Times Roman or Palatino
Readability of text
• lowercase
• easy to read shape of words
• UPPERCASE
• better for individual letters and non-words
e.g. flight numbers: BA793 vs. ba793

• serif fonts
• helps your eye on long lines of printed text
• but sans serif often better on screen
Page Description Languages
• Pages very complex
• different fonts, bitmaps, lines, digitised photos, etc.

• Can convert it all into a bitmap and send to the printer

… but often huge !

• Alternatively Use a page description language

• sends a description of the page can be sent,
• instructions for curves, lines, text in different styles, etc.
• like a programming language for printing!

• PostScript is the most common

Screen and page
• WYSIWYG
• what you see is what you get
• aim of word processing, etc.
• but …
• screen: 72 dpi, landscape image
• print: 600+ dpi, portrait
• can try to make them similar
but never quite the same
• so … need different designs, graphics etc, for screen and print
Scanners
• Take paper and convert it into a bitmap

• Two sorts of scanner

• flat-bed: paper placed on a glass plate, whole page converted into bitmap
• hand-held: scanner passed over paper, digitising strip typically 3-4” wide

• Shines light at paper and note intensity of reflection

• colour or greyscale

• Typical resolutions from 600–2400 dpi

Scanners (ctd)
Used in
• desktop publishing for incorporating photographs and other images

• document storage and retrieval systems, doing away with paper storage

+ special scanners for slides and photographic negatives

Optical character recognition
• OCR converts bitmap back into text
• different fonts
• create problems for simple “template matching” algorithms
• more complex systems segment text, decompose it into lines and arcs, and
decipher characters that way
• page format
• columns, pictures, headers and footers
Paper-based interaction
• paper usually regarded as output only

• can be input too – OCR, scanning, etc.

• Xerox PaperWorks
• glyphs – small patterns of /\\//\\\
• used to identify forms etc.
• used with scanner and fax to control applications

• more recently
• papers micro printed - like wattermarks
• identify which sheet and where you are
• special ‘pen’ can read locations
• know where they are writing
virtual reality and 3D interaction

positioning in 3D space
moving and grasping
seeing 3D (helmets and caves)
positioning in 3D space
• cockpit and virtual controls
• steering wheels, knobs and dials … just like real!
• the 3D mouse
• six-degrees of movement: x, y, z + roll, pitch, yaw
• data glove
• fibre optics used to detect finger position
• VR helmets
• detect head motion and possibly eye gaze
• whole body tracking
• accelerometers strapped to limbs or reflective dots and video processing
pitch, yaw and roll

yaw

roll
pitch
Devices for virtual reality and 3d
interaction
• VR Headsets:
• Oculus Rift S: A PC-based VR
headset developed by Oculus
(a subsidiary of Meta, formerly
Facebook).
• HTC Vive: A VR system
developed by HTC and Valve
Corporation, known for its
room-scale tracking
capabilities.
• PlayStation VR: Designed for
use with the PlayStation 4 and
Devices for virtual reality and 3d
interaction
• Motion Controllers:
• Oculus Touch: Handheld controllers
designed for use with Oculus Rift and
Rift S, providing hand presence in VR.
• HTC Vive Controllers: Handheld
controllers with positional tracking for
precise 3D interaction in virtual
environments.
• PlayStation Move Controllers:
Motion controllers used with
PlayStation VR for tracking hand
movements.
Devices for virtual reality and 3d
interaction
• VR Gloves:
• Valve Index Controllers: Also
known as "Knuckles," these
controllers are designed to
provide natural hand presence
and finger tracking in VR.
• Manus VR Gloves: Gloves that
offer finger tracking and haptic
feedback for a more immersive
hand interaction in virtual
spaces.
Devices for virtual reality and 3d
interaction
• VR Cameras:
• 360-Degree Cameras:
Devices like the Insta360
and GoPro MAX capture
immersive 360-degree
video for VR experiences.
Devices for virtual reality and 3d
interaction
• Haptic Feedback
Devices:
• Haptic Gloves: Devices
like HaptX Gloves provide
tactile feedback, allowing
users to feel objects in
virtual environments.
• Haptic Vests: Devices
such as the bHaptics
Tactsuit provide haptic
feedback across the user's
body for a more
immersive experience.
Devices for virtual reality and 3d
interaction
• Eye-Tracking
Technology:
• Tobii Eye Trackers:
Integrated into some
VR headsets, these
devices track users'
eye movements,
enabling foveated
rendering and more
realistic interactions.
Devices for virtual reality and 3d
interaction
• VR Treadmills and
Locomotion Devices:
• Virtuix Omni: A treadmill
that allows users to walk,
run, and jump in virtual
environments.
• 3D Rudder: A foot-based
motion controller for
seated VR experiences,
offering a hands-free way
to navigate.
Devices for virtual reality and 3d
interaction
• Augmented Reality (AR)
Devices:
• Microsoft HoloLens: An
AR headset that overlays
digital content on the real
world, enabling mixed
reality experiences.
• Magic Leap One:
Another AR headset
designed to blend digital
content with the user's
physical surroundings.
Devices for virtual reality and 3d
interaction
• 3D Scanners:
• Structure Sensor: A
3D sensor that
attaches to mobile
devices (such as
iPads) for scanning
real-world objects
and environments.