Lecture 4:
HUMAN CAPABILITIES IN
USER INTERFACE DESIGN
User Interface Design
Dr. Mohamed Saied Amer
Outlines
Explain the Human processor model
Describe various terms like perception, motor skills, e.tc
Explain the concepts of attention and errors
Introduction
This unit describes Human capabilities in User interface
design.
The concept of Human processor model is introduced:
Perception
motor skills
Colour
attention
errors.
HUMAN PROCESSOR MODEL
Human processor model is a cognitive modeling method used to
calculate how long it takes to perform a certain task.
The value of the human processor model is that it allows a system
designer to predict the performance with respect to time it takes a person
to complete a task without performing experiments.
Input from the eyes and ears are first stored in the short-term sensory
store. As a computer hardware analogy, this memory is like a frame
buffer, storing a single frame of perception.
HUMAN PROCESSOR MODEL
HUMAN PROCESSOR MODEL
Explanation:
The perceptual processor takes the stored sensory input and attempts to recognize symbols in
it: letters, words, phonemes, icons.
The cognitive processor takes the symbols recognized by the perceptual processor and makes
comparisons and decisions.
The motor processor receives an action from the cognitive processor and instructs the muscles
to execute it.
The visual image store is basically an image frame from the eyes. It isn’t encoded as pixels,
but as physical features of the image, such as curvature, length, edges.
The auditory image store is a buffer for physical sound.
Finally, there is a component corresponding to your attention, which might be thought of like a
thread of control in a computer system.
PERCEPTION
Perception is the process of attaining awareness or understanding of
sensory information.
Two types of consciousness are considerable regarding perception:
phenomenal and psychological.
Passive perception can be summarized as the following sequence of
events: (surrounding → input (senses) → processing (brain) →
output)
In interface design, the extent to which a user interface is appreciated
depends largely on the perception of users.
Perception and Illusions
How the Brain Can Be Tricked by What We See?
These perceptual illusions occur when our brains misinterpret sensory
information in unexpected ways.
One example of a visual illusion is the Müller-Lyer illusion, where two lines of
equal length appear to be different lengths due to the addition of
arrowhead-shaped lines at their ends.
Another example is the Ponzo illusion, where two identical objects are placed on
converging lines, creating an illusion that one object is larger than the other.
Improve Visual perception in design
Visual Clues: Conveying and directing users with obvious signals can be as straightforward as
a little symbol that assists them in fabricating and linking the signal with ordinary things.
Direction Arrow: It helps the users toward the subsequent stage they need to perform.
Spacing between words: The importance of the text spacing is significant for any site or item.
Users lack the opportunity and willpower to look into many jumbled items.
Highlight the line: Attempt to stress the pieces of the sentence that give the users additional
background information, so the user doesn't need to peruse the whole passage to comprehend.
Boundary Outline: Utilizing contrast, the plan needs to isolate the frontal area from the
foundation and perceive objects from a mind-blowing scope of spatial directions and precise
signals.
MOTOR SKILLS
A motor skill is a learned series of movements that combine to produce
a smooth, efficient action.
Gross motor skills include lifting one's head, rolling over, sitting up, balancing,
crawling, and walking.
Fine motor skills include the ability to manipulate small objects, transfer objects
from hand to hand, and various hand-eye coordination tasks.
Ambidexterity is a specialized skill in which there is no dominance between body
symmetries, so tasks requiring fine motor skills can be performed with the left or
right extremities.
The motor skills by users significantly affect the ability of users to be
able to use the system well and do their work better.
MOTOR SKILLS
Motor skills are about user's ability to physically manipulate devices such as mouse
or keyboard and interact with the Web page.
For example, how much mouse movement around the page is required to get things
done is an important concern to address in the overall design of the page.
Mouse input is good for novice users, but make sure to make it really productive to
use mouse.
Keyboard shortcuts are useful for advanced users, and would boost productivity by
several factors.
Example: given the user's motor skills to use the keyboard effectively as well as the
ability remember the shortcut key combinations.
COLOUR
Colour corresponding in humans to the categories called red, green, blue and others.
Colors can be identified by their unique RGB (Red, Green, Blue model) and HSV
(Hue, Saturation, and Value color model).
The ability of the human eye to distinguish colors is based upon the varying
sensitivity of different cells in the retina to light of different wavelengths.
RGB model HSV model
Facts about colour
Colour can be a powerful tool to improve user interfaces, but inappropriate use
can severely reduce human performance
Colour can be very helpful in gaining the attention of users
In designing user interfaces, pay attention to how to combine colours and
human perception
Consider people with colour deficiency in your colour combination.
The colour limitations such as color blindness, near/far sighted and focusing
speed should be considered.
Red objects appear closer than blue objects.
ATTENTION
Attention is the cognitive process of selectively concentrating on one
aspect of the environment while ignoring other things.
Our ability to divide our attention among multiple tasks appears to
depend on two things:
First is the structure of the tasks that are trying to share our attention.
The second key influence on multitasking performance is the difficulty of the task.
A good user interface should be able to drive the attention of users. The
colour combinations, ease of use, performance, etc are some attributes
that drive users’ full attention.
Techniques for Draw user Attention
Size: Implementing changes to the size of elements in your designs is an easy way to
provide emphasis for users by drawing their attention to larger objects.
Contrast is the creation of opposing visual elements to convey emphasis or
comparison. Contrast is a great way to draw emphasis to elements in a design that are
different or important.
Texture is the elements within an object that add depth or a pattern to an object.
Texture can make an object stand out from other objects within a design and should be
used sparingly to draw the user’s gaze.
Emphasis in the real world: Google’s mission statement uses color contrast to grab
the user’s attention and emphasize the main points of the company's mission at a
glance.
ERRORS
The word error has different meanings and usages relative to how it is
conceptually applied.
An ‘error' is a deviation from accuracy or correctness. A ‘mistake' is
an error caused by a fault: the fault being misjudgment, carelessness,
or forgetfulness.
For example, if a user unintentionally clicks a wrong button, that is a mistake.
This might take several minutes to correct.
User interfaces should be designed in order to prevent intentional and
unintentional errors from users.
CONCLUSION
The Human processor model which is a cognitive modeling method used to
calculate how long it takes to perform a certain task. The various uses of the model
were also discussed.
Perception which is the process of attaining awareness or understanding of sensory
information. Passive and visual perception were also discussed.
Motor skill which is a learned series of movements that combine to produce a
smooth and efficient action. Gross, fine and Ambidexterity motor skills were
discussed.
The colour concept which can be identified by their unique RGB and HSV values.
Various facts about colour were also discussed.
Error which is a deviation from accuracy or correctness in Human processor model.
Thanks
