Chapter
3
The Interaction
Overview
●
●
●
●
Understand what is going on in the interaction between user and system.
Ergonomics looks at the physical characteristics of the interaction
The dialog between user and system
The interaction takes place within a social and organizational
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.1 Introduction
● how the human user uses the computer as a tool to perform, simplify or
support a task.
● Direct manipulation
● Virtual reality
● Communication between user and system: the interaction
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2 Models of Interaction
● Interaction involves at least two participants: the user and the system
● Help us to understand exactly what is going on in the interaction and identify
the likely root of difficulties
● Norman’s execution–evaluation cycle;
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.1 The terms of Interaction
● Domain
○
○
an area of expertise and knowledge in some real-world activity.
consists of concepts that highlight its important aspects.
● Tasks
○
are operations to manipulate the concepts of a domain.
● Goal
○
the desired output from a performed task
● Intention
○
specific action required to meet the goal.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.1 The terms of Interaction
● Task analysis
○
involves the identification of the problem space in terms of the domain, goals, intentions and
tasks.
● The System and the User
○
○
The concepts used in the design of the system and the description of the user are separate,
and so we can refer to them as distinct components
are each described by means of a language that can express concepts relevant in the domain
of the application.
● The System’s language
○
○
refer to as the core language
describes computational attributes of the domain relevant to the System state
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.1 The terms of Interaction
● the User’s language
○
○
refer to as the task language.
describes psychological attributes of the domain relevant to the User state.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.2 The Execution - evaluation cycle
● perhaps the most influential in Human–Computer Interaction
● The stages in Norman’s model of interaction:
○
○
○
○
○
○
○
Establishing the goal.
Forming the intention
Specifying the action sequence
Executing the action
Perceiving the system state.
Interpreting the system state
Evaluating the system state with respect to the goals and intentions
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.2 The Execution - evaluation cycle
● the gulfs of execution
○
difference between the user’s formulation of the actions to reach the goal and the actions
allowed by the system.
● the gulfs of evaluation
○
distance between the physical presentation of the system state and the expectation of the
user.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.3 The interaction framework
● attempts a more realistic description of
interaction
● including the system explicitly, and breaks
it into four main components,
● Input and Output together form the
Interface.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.2.3 The interaction framework
● Four steps in the interactive cycle
○
○
○
○
User to Input - Articulation
Input to system - Performance
System to output - Presentation
Output to use - Observation
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.3 Frameworks and HCI
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4 Ergonomics
● Or human factors
● traditionally the study of the physical characteristics of the interaction:
○
○
○
how the controls are designed
the physical environment in which the interaction takes place
the layout and physical qualities of the screen
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4.1 Arrangement of controls and displays
● Functional
○
controls and displays are organized so that those that are functionally related are placed
together;
● Sequential
○
controls and displays are organized to reflect the order of their use in a typical interaction
● Frequency
○
controls and displays are organized according to how frequently they are used, with the most
commonly used controls being the most easily accessible.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4.2 The physical environment of the interaction
● may influence how well it is accepted and even the health and safety of its
users.
● It should therefore be considered in all design.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4.3 Health issues
● Physical position
○
○
users should be able to reach all controls comfortably and see all displays.
Users should not be expected to stand for long periods and, if sitting, should be provided with
back support.
● Temperature
○
extremes of hot or cold will affect performance and, in excessive cases, health.
● Lighting
○
adequate lighting should be provided to allow users to see the computer screen without
discomfort or eyestrain.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4.3 Health issues
● Noise
○
○
Excessive noise can be harmful to health, causing the user pain, and in acute cases, loss of
hearing.
Noise levels should be maintained at a comfortable level in the work environment. This
● Time
○
○
The time users spend using the system should also be controlled
excessive use of CRT displays can be harmful to users, particularly pregnant women.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4.4 The use of color
● used in the display should be as distinct as possible and the distinction should
not be affected by changes in contrast.
● used should also correspond to common conventions and user expectations.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.4.5 Ergonomics and HCI
● Ergonomics is a huge area, which is distinct from HCI but sits alongside it.
● Ergonomic factors are in general well established and understood and are
therefore used as the basis for standardizing hardware designs.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5 Interaction Styles
● There are a number of common interface styles
○
○
○
○
○
○
○
○
command line interface
Menus
natural language
question/answer and query dialog
form-fills and spreadsheets
WIMP - the most common and complex
point and click
three-dimensional interfaces
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.1 Command Line Interface
● the first interactive dialog style to be commonly used and, in spite of the
availability of menu-driven interfaces, it is still widely used.
● provides a means of expressing instructions to the computer directly, using
function keys, single characters, abbreviations or whole-word commands.
● powerful in that they offer direct access to system functionality
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.2 Menus
● the set of options available to the user is displayed on the screen, and
selected using the mouse, or numeric or alphabetic keys
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.3 Natural Language
● the most attractive means of communicating with computers, at least at first
glance, is by natural language.
● Example
○
The boy hit the dog with the stick
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.4 Question/answer and query dialog
● a simple mechanism for providing input to an application in a specific domain.
● The user is asked a series of questions (mainly with yes/no responses,
multiple choice, or codes) and so is led through the interaction step by step.
An example of this would be web questionnaires.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.5 Form-fills and spreadsheets
● used primarily for data entry but can
also be useful in data retrieval
applications.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.6 The WIMP interface
● stands for windows, icons, menus and pointers (sometimes windows, icons,
mice and pull-down menus)
● the default interface style for the majority of interactive computer systems in
use today, especially in the PC and desktop workstation arena
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.7 Point-and-click interfaces
● obviously closely related to the WIMP style.
● the point-and-click style is not tied to mouse-based interfaces, and is also
extensively used in touchscreen information systems.
● has been popularized by world wide web pages, which incorporate all the
above types of point-and-click navigation: highlighted words, maps and iconic
buttons.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.5.8 Three-dimensional interfaces
● Example: Virtual reality
● A more complex technique uses interfaces with 3D workspaces
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6 Elements of the WIMP Interface
● windows, icons, pointers and menus
● widgets
○
○
elements of the WIMP interfaces
they comprise the toolkit for interaction between user and system.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.1 Windows
●
●
●
areas of the screen that behave as if
they were independent terminals in their
own right.
usually contain text or graphics, and can
be moved or resized.
Scrollbars are one such attachment,
allowing the user to move the contents of
the window up and down, or from side to
side.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.2 Icons
●
●
A small picture is used to represent a closed window, and this representation
Iconifying
○ Shrinking a window to its icon
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.3 Pointers
●
●
presented with a cursor on the screen that is
controlled by the input device
like icons, being small bitmap images, but in addition
all cursors have a hot-spot, the location to which they
point
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.4 Menus
●
●
●
●
●
an interaction technique that is common across many
non-windowing systems as well.
presents a choice of operations or services
provide information cues in the form of an ordered list
of operations that can be scanned.
menu bar
○ The main menu can be visible to the user all the
time,
Submenus
○ can be pulled down or across from it upon
request
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.4 Menus
●
●
pop-up menus
○ often used to present context sensitive options, for example allowing one to examine
properties of particular on-screen objects.
Pull-down menus
○ dragged down from the title at the top of the screen, by moving the mouse pointer into the title
bar area and pressing the button
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.5 Buttons
●
●
●
individual and isolated regions within a display that can
be selected by the user to invoke specific operations
radio buttons
○ toggle buttons grouped together
check boxes
○ set of options is not mutually exclusive, such as
font characteristics like bold, italics and underlining
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.6 Toolbars
●
●
collection of small buttons
placed at the top or side of the window and offering commonly used functions
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.7 Palettes
●
●
collection of small buttons placed at the
top or side of the window and offering
commonly used functions
drawing package
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.6.8 Dialog Boxes
●
information windows used by the system
to bring the user’s attention to some
important information
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.7 INTERACTIVITY
● the defining feature of an interactive system.
● crucial in determining the ‘feel’ of a WIMP environment.
● critical in dealing with errors.
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos
3.8 EXPERIENCE, ENGAGEMENT AND FUN
● Understanding experience
○
Example Shopping
● Designing experience
● Physical design and engagement
○
○
○
○
○
○
Ergonomic
Physical
Legal and safety
Context and environment
Aesthetic - The controls must look good
Economic - It must not cost too much!
● Managing value
CS1104: Human Computer Interaction
Department of Computer and Information Sciences - University of San Carlos