CS 501: Software Engineering

1
CS 501 Software Engineering
Lecture 11 Designing for Usability I
2
Administration
Requirements Presentation next week Sign up with
Rosemary Adessa for a time.
3
Design for Usability
Usability of a computer system is a combination
of factors User interface design
Functionality Performance Help systems and
documentation Freedom from errors Anything
else?
4
Elements of an Interface
metaphors terms, images, concepts that can be
learned mental model organization and
representation of data, functions, tasks and
roles navigation rules how to move among data
functions, activities and roles look
characteristics of the appearance that convey
information feel interaction techniques that
provide an appealing experience Marcus (1993)
quoted by Pfleeger
5
Levels of Usability
interface design functional design data and
metadata computer systems and networks
conceptual model
6
The Conceptual Model
The conceptual model is the user's internal model
of what the system provides The desk top
metaphor -- files and folders The web model --
click on hyperlinks The library model --
search and retrieve The form filling model --
fill form, submit Example The Mercury page
turner
7
Interface Design
The interface design is the appearance on the
screen and the actual manipulation by the user
(look and feel) Fonts, colors, logos, key
board controls, menus, buttons Mouse control
or keyboard control? Conventions (e.g.,
"back", "help") Example Screen space
utilization in the Mercury page turner
8
Principles of Interface Design
Interface design is partly an art there are
general principles Consistency -- in
appearance, controls, and function. Feedback
-- what is the computer system is doing?
why does the user see certain results?
Users should be able to interrupt or reverse
actions Error handling should be simple and
easy to comprehend Skilled users offered
shortcuts beginners have simple, well-defined
options The user should feel in control
9
Disabilities
What if the user is visually impaired or
color blind? does not speak English? is a poor
typist? There is a tradition of blind
programmers Navigation of web sites need not
be only visual You may have a legal requirement
to support people with disabilities
10
Functional Design
The functional design, determines the functions
that are offered to the user Selection of
parts of a digital object Searching a list or
sorting the results Help information
Manipulation of objects on a screen Pan or zoom
11
Same Functions, Different Interface
Example The desk top metaphor Mouse -- 1
button (Macintosh), 2 button (Windows)
or 3 button (Unix) Close button -- left of
window (Macintosh) right of
window (Windows)
12
Data and Metadata
Data and metadata stored by the computer system
enable the functions and the interface The
desktop metaphor has the concept of associating
a file with an application. This requires a
file type to be stored with each file --
extension to filename (Windows and Unix) --
resource fork (Macintosh) Data validation
often requires that a user interface has
access to a database (e.g., names and addresses)
13
Computer Systems and Networks
The performance, reliability and predictability
of computer systems and networks is crucial to
usability Response time instantaneous for
mouse tracking and echo of key stroke 5 seconds
for simple transactions Example Pipelined
algorithm for the Mercury page turner Quality
of Service for real time information
14
Design Tensions in Networked Systems
Client computers and network connections vary
greatly in capacity Client software may run
on various operating systems it may be current
or an earlier version System designers wish
to control clients users wish to configure their
own environments
15
Usability and Cost
Performance may be expensive in hardware or
special software development User interface
development may be a major part of a software
development project Costs are multiplied if a
user interface has to be used on different
computers or migrate to different versions of
systems Web browsers provide a general purpose
user interface that others maintain
16
Usability Requirements and Refinement

• It is very difficult to specify and comprehend an
  interactive
• interface in a textual documents.
• Requirement documents benefit from sketches,
  comparison with existing systems, etc.
• Design documents should definitely include
  graphical elements and often benefit from a
  mock-up or other form of prototype.
• Implementation plans should include evaluation of
  user factors and time to make changes.

17
User Interfaces Iterative Design
Requirements
Evaluation
Implementation (prototype)
Design
18
Methods for Specifying Requirements and
Evaluation of Usability
Observing users (user protocols) Focus
groups Measurements effectiveness in
carrying out tasks speed Expert review
Client's opinions Competitive analysis