Transcript Document 7905641

Designing Appropriate
User Interfaces
Professor Larry Heimann
Carnegie Mellon University
88-272 Lecture Notes — Fall 1999
Agenda & Announcements
•
•
•
•
•
•
Announcements
What is the Purpose of an Interface?
Top Usability Problems with GUIs
The Interface Development Process
Golden Rules of GUI Design
Examples of Poor GUI Design
Purposes of a Software Interface
•
•
•
•
A tool for accomplishing tasks
A search mechanism to find files, data
A learning tool
An entertainment vehicle (e.g., playing games)
Top Usability Problems with GUIs
(with apologies to Letterman and thanks to the IBM Usability Lab)
10.
9.
8.
7.
6.
5.
4.
3.
2.
1.
Complex linkage between and w/in applications
Single-direction languages
Input and direct-manipulation limits
Highlighting and selection limitations
Unclear step sequences
More steps to manage the interface than to do tasks
Lack of system anticipation and intelligence
Inadequate feedback and confirmation
Ambiguous menus and icons
Inadequate error messages, help, tutorials, & documentation
The Interface Development Process
• 3 stage process for developing user interfaces
– Analysis
– Design
– Construction
• Cyclical process in developing an interface
• Does the interface development occur:
– in advance of software coding and design?
– concurrently with software coding and design?
– towards the end of software coding and design?
Phase I: Analysis
• Purpose of the analysis phase is to develop
complete picture of interface requirements
• Steps in analysis phase:
–
–
–
–
–
–
–
–
Identifying scope
Developing user profiles
Gathering data
Documenting current tasks
Documenting opportunities
Describing future tasks
Developing usability specs
Developing scenarios
Phase II: Design Process
• Design stage is usually a team effort; tends to
involve lots of creativity & brainstorming
–
–
–
–
–
interface designers (to translate tasks into objects, metaphors, etc.)
users (to address team questions and give design feedback)
technical personnel (to provide guidance on technical constraints)
graphical designers (sketch ideas; work on aesthetics)
training/support/documentation specialist
• Typically begin these design sessions looking
at the most frequent/critical tasks
Design Step 1: Choose Major
User Objects for Interface
• User objects are not GUI objects
• Using the use cases to identify objects
– look for things (nouns, objects) that user has to manipulate
or takes some action on (view, edit, enter, etc.)
– identify those items which are really sub-objects of other
items in the interface
– eliminate objects users don’t really need to see or directly
interact with in the interface
• Listing object attributes
• Listing user actions on task objects
Example
of an
ObjectAction
Table
Object/Sub-object
Checkbook
Attributes
Bank name
Checkbook name (personal,
business, etc.)
- Blank check
Account number
Start date
End date
Checkbook/account number
User entries (amount, payee,
etc.)
- Checkbook register
Checkbook entries
Running balance
-- Checkbook entry
Type
Amount
Date
Cleared/not cleared
Note
-- Running balance
Value
User Actions
Start new checkbook
Name
Delete
Print
View
Write/Edit
Copy
Print
Send/Transfer
View
Navigate
Add entry
Print
Sort
View
Edit
Copy and Paste
Print
Void
Find
Move
View
Adjust
Step 2: Select Metaphors
• Metaphors provide the mental model for user;
connect what is known w/ what is unfamiliar
• Keys to effective metaphors:
–
–
–
–
–
metaphors should hold up to users’ primary assumptions
does not have to be a full visual representation
best metaphors are simple; may not be unique
can find effective metaphors in the physical world
more than one is okay; often more are necessary
• Metaphors assist, shouldn’t control interface
Step 3: Storyboard
• Storyboards are quick sketches of objects,
actions, metaphors and representation ideas.
• Key points on storyboarding
–
–
–
–
sketch on an erasable medium
keep storyboards rough
whole team needs to be involved (users, technical people)
begin with most frequent tasks
• Storyboards are an opportunity to look at a
variety of design options that connect objects
Step 4: Create High Level Design
•
•
•
•
•
•
•
Select or adapt a style/standard
Identify main windows and related actions
Identify home bases and launching pads
Identify how users access main windows
Assign user actions for main windows
Create design mockups
Review and revise high-level design as
needed
Step 5: Develop Support Plan
• Identify user knowledge and skill deficiencies
– user profiles can reveal potential deficiencies
– seeing users working w/ prototypes can also be revealing
• Generate support plan, which may include:
–
–
–
–
–
–
job aids (quick reference cards, keyboard templates)
classroom or on-the-job training
computer-based training (tutorials, cue cards)
online manuals
video courses
hot lines
Phase III: Construction
• Develop prototype
– doesn’t need to do data processing, but should allow
users to navigate within the interface and use controls
– careful not to develop unrealistic expectations of system
capabilities
– Don’t lose control of prototype to marketing or coders
• Test prototype
– include outside parties, key stakeholders, and users
– careful not to be too defensive, too accomodating
• Document the design
Golden Rule 1:
Place Users in Control
• Some things that help keep users in control:
–
–
–
–
–
–
–
–
–
use modes judiciously
allow users to use either keyboard or mouse
allow users to change focus
display descriptive text and messages
provide feedback and allow for reversible actions
provide meaningful paths and exits
accommodate users of different skill levels
allow users to customize interface
allow direct manipulation of interface objects
Golden Rule 2:
Reduce Users’ Memory Load
• Some things that reduce user memory load:
–
–
–
–
–
–
–
–
–
relieve short-term memory
rely on recognition, not recall
provide visual cues
provide defaults, undo, and redo
provide interface shortcuts
promote an object-action syntax
use appropriate metaphors
use progressive disclosures
promote visual clarity
Golden Rule 3:
Make Interface Consistent
• Some things that help promote consistency:
–
–
–
–
sustain the context of the users’ tasks
maintain consistency within and across products
keep interaction results the same
provide aesthetic appeal and integrity (but never at the
cost of dcreasing usability!)
– encourage exploration
Examples of Poor GUI Designs
• Windows 95 -- not even following MS
guidelines
• IBM Real Phone -- overdoing metaphors
• Error Messages from Heck (the kingdom of
insufficient light)