User Interface Design

By
Prof. Manjushree K,
Assistant Professor,
Computer Science and Engineering,
BNM Institute Of Technology,
Bengaluru
 The User Interface Design Process
Obstacles and Pitfalls in the Development Path

 Gould (1988) has made these general observations about design:

 Nobody ever gets it right the first time.
 Development is chock-full of surprises.
 Good design requires living in a sea of changes.
 Making contracts to ignore change will never eliminate the need for
change.
 Even if you have made the best system humanly possible, people
will still make mistakes when using it.
 Designers need good tools.
You must have behavioral design goals like performance design
goals.

 The first five conditions listed will occur naturally because

people are people, both as users and as developers. These kinds of
behavior must be understood and accepted in design. User
mistakes, while they will always occur, can be reduced.

 Pitfalls in the design process exist because of a flawed design

process, including a failure to address critical design issues, an
improper focus of attention, or development team organization
failures.
Common pitfalls are:
 No early analysis and understanding of the user’s needs and
expectations.
 A focus on using design features or components that are ―neat‖
or ―glitzy.
 Little or no creation of design element prototypes.
 No usability testing.
 No common design team vision of user interface design goals.
 Poor communication between members of the development
team.
Designing for People: The Five
Commandments
 The complexity of a graphical or Web interface will always magnify
any problems that do occur. Pitfalls can be eliminated if the following
design commandments remain foremost in the designer’s mind.

 Gain a complete understanding of users and their tasks: The users

are the customers. Today, people expect a level of design sophistication
from all interfaces, including Web sites. The product, system or Web
site must be geared to people’s needs, not those of the developers.
 Solicit early and ongoing user involvement: Involving the users in
design from the beginning provides a direct conduit to the knowledge
they possess about jobs, tasks, and needs. Involvement also allows the
developer to confront a person’s resistance to change, a common human
trait. People dislike change for a variety of reasons, among them fear of
the unknown and lack of identification with the system.

 Perform rapid prototyping and testing: Prototyping and testing the

product will quickly identify problems and allow you to develop
solutions. Prototyping and testing must be continually performed during
all stages of development to uncover all potential defects. Ifthorough
testing is not performed before product release, the testing will occur in
the user’s office. Encountering a series of problems early in system use
will create a negative first impressionin the customer’s mind, and this
may harden quickly, creating attitudes that may be difficult to change. It
is also much harder and more costly to fix a product after its release.
 Modify and iterate the design as much as necessary: While design
will proceed through a series of stages, problems detected in one stage
may force the developer to revisit a previous stage.. Establish user
performance and acceptance criteria and continue testing and modifying
until all design goals are met.

 Integrate the design of all the system components: The software, the
documentation, the help function, and training needs are all important
elements of a graphical system or Web site and all should be developed
concurrently. Time will also exist for design trade-offs to be thought out
more carefully.
Usability

 The term usability used to describe the effectiveness of human

performance.
 The term usability is defined as ―the capability to be used by
humans easily and effectively, where,

easily = to a specified level of subjective assessment,

effectively = to a specified level of human performance.
 Common Usability Problems
 Mandel (1994) lists the 10 most common usability problems in graphical
systems as reported by IBM usability specialists. They are:
1. Ambiguous menus and icons.
2. Languages that permit only single-direction movement through a system.
3. Input and direct manipulation limits.
4. Highlighting and selection limitations.
5. Unclear step sequences.
6. More steps to manage the interface than to perform tasks.
7. Complex linkage between and within applications.
8. Inadequate feedback and confirmation.
9. Lack of system anticipation and intelligence.
10. Inadequate error messages, help, tutorials, and documentation.
Web usability characteristics particularly wasteful of people’s time,
and often quite irritating, are:

 Visual clutter
 Impaired information readability.
 Incomprehensible components.
 Annoying distractions.
 Confusing navigation
Usability is nothing but common sense
 Inefficient navigation
 Inefficient operations.
 Excessive or inefficient page scrolling
 Information overload.
 Design inconsistency.
 Outdated information.
 Stale design caused by emulation of printed documents and past
systems.
Some Practical Measures of Usability

 Are people asking a lot of questions or often reaching for a

manual?
 Are frequent exasperation responses heard?
 Are there many irrelevant actions being performed?
 Are there many things to ignore?
 Do a number of people want to use the product?
Some Objective Measures of Usability
 Shackel (1991) presents the following more objective criteria for
measuring usability.
How effective is the interface? Can the required range of tasks be
accomplished:
 At better than some required level of performance ?
 By some required percentage of the specified target range of users?
 Within some required proportion of the range of usage environments?
 How learnable is the interface? Can the interface be learned:
 Within some specified time from commissioning and start of user
training?
 Based on some specified amount of training and user support?
 Within some specified relearning time each time for intermittent users?
 How flexible is the interface? Is it flexible enough to:
 Allow some specified percentage variation in tasks and/or
environments beyond those first specified?
 What are the attitudes of the users?
 Are they: Within acceptable levels of human cost in terms of tiredness,
discomfort, frustration, and personal effort?
 Such that satisfaction causes continued and enhanced usage of the
system?
The Design Team

Provide a balanced design team, including specialists in:

 Development
 Human factors
 Visual design
 Usability assessment
 Documentation
 Training
 Important Human Characteristics in
Design
 We are complex organisms with a variety of attributes that have an
important influence on interface and screen design.
 Of particular importance in design are perception, memory, visual
acuity, foveal and peripheral vision, sensory storage, information
processing, learning, skill, and individual differences.
 Perception
 Perception is our awareness and understanding of the elements and
objects of our environment through the physical sensation of our various
senses, including sight, sound, smell, and so forth. Perception is
influenced, in part, by experience.
Other perceptual characteristics include the following:
 Proximity: Our eyes and mind see objects as belonging together if they
are near each other in space.
 Similarity: Our eyes and mind see objects as belonging together if they
share a common visual property, such as color, size, shape, brightness, or
orientation.
 Matching patterns: We respond similarly to the same shape in different
sizes. The letters of the alphabet, for example, possess the same meaning,
regardless of physical size.
 Closure: Our perception is synthetic; it establishes meaningful wholes. If
something does not quite close itself, such as a circle, square, triangle, or
word, we see it as closed anyway.
 Unity: Objects that form closed shapes are perceived as a group.
 Continuity: Shortened lines may be automatically extended.
 Balance: We desire stabilization or equilibrium in our viewing environment.
Vertical, horizontal, and right angles are the most visually satisfying and
easiest to look at.
 Expectancies: Perception is also influenced by expectancies; sometimes we
perceive not what is there but what we expect to be there. Missing a spelling
mistake in proof reading something we write is often an example of a
perceptual expectancy error; we see not how a word is spelled, but how we
expect to see it spelled.
 Context: Context, environment, and surroundings also influence
individual perception. For example, two drawn lines of the same length
may look the same length or different lengths, depending on the angle
of adjacent lines or what other people have said about the size of the
lines.

 Signals versus noise: Our sensing mechanisms are bombarded by

many stimuli, some of which are important and some of which are not.
Important stimuli are called signals; those that are not important or
unwanted are called noise.
Memory

 Memory is viewed as consisting of two components, long-term and

short-term (or working) memory.
 Short-term, or working, memory receives information from either the
senses or long-term memory, but usually cannot receive both at once, the
senses being processed separately. Within short-term memory a limited
amount of information processing takes place. Information stored within
it is variously thought to last from 10 to 30 seconds, with the lower
number being the most reasonable speculation. Knowledge, experience,
and familiarity govern the size and complexity of the information that
can be remembered.
 Long-term memory contains the knowledge. Information received in
short-term memory is transferred to it and encoded within it, a process we
call learning. It is a complex process requiring some effort on our part.

 The learning process is improved if the information being transferred

from short-term memory has structure and is meaningful and familiar.
Learning is also improved through repetition.
 Unlike short-term memory, with its distinct limitations, long-term
memory capacity is thought to be unlimited. An important memory
consideration, with significant implications for interface design, is the
difference in ability to recognize or recall words.
Sensory Storage
 Sensory storage is the buffer where the automatic processing of information
collected from our senses takes place. It is an unconscious process, large,
attentive to the environment, quick to detect changes, and constantly being
replaced by newly gathered stimuli. In a sense, it acts like radar, constantly
scanning the environment for things that are important to pass on to higher
memory.
 Repeated and excessive stimulation can stress the sensory storage
mechanism, making it less attentive and unable to distinguish what is
important. Avoid unnecessarily stressing it.
 Design the interface so that all aspects and elements serve a definite
purpose. Eliminating interface noise will ensure that important things will
be less likely to be missed.
Visual Acuity
 The capacity of the eye to resolve details is called visual acuity. It
is the phenomenon that results in an object becoming more
distinct as we turn our eyes toward it and rapidly losing
distinctness as we turn our eyes away—that is, as the visual angle
from the point of fixation increases.
 It has been shown that relative visual acuity is approximately
halved at a distance of 2.5 degrees from the point of eye fixation
 The eye’s sensitivity increases for those characters closest to the
fixation point (the ―0‖) and decreases for those characters at the
extreme edges of the circle (a 50/50 chance exists for getting
these characters correctly identified). This may be presumed to be
a visual ―chunk‖ of a screen
 Foveal and Peripheral Vision
 Foveal vision is used to focus directly on something; peripheral vision
senses anything in the area surrounding the location we are looking at, but
what is there cannot be clearly resolved because of the limitations in visual
acuity.
 Foveal and peripheral vision maintain, at the same time, a cooperative and
a competitive relationship. Peripheral vision can aid a visual search, but can
also be distracting.
 In its cooperative nature, peripheral vision is thought to provide clues to
where the eye should go next in the visual search of a screen.
 In its competitive nature, peripheral vision can compete with foveal vision
for attention. What is sensed in the periphery is passed on to our
information processing system along with what is actively being viewed
foveally.
 Information Processing
 The information that our senses collect that is deemed important enough to
do something about then has to be processed in some meaningful way.
 There are two levels of information processing going on within us. One
level, the highest level, is identified with consciousness and working
memory. It is limited, slow, and sequential, and is used for reading and
understanding.
 In addition to this higher level, there exists a lower level of information
processing, and the limit of its capacity is unknown. This lower level
processes familiar information rapidly, in parallel with the higher level, and
without conscious effort.
 Both levels function simultaneously, the higher level performing reasoning
and problem solving, the lower level perceiving the physical form of
information sensed.
 Mental Models
 A mental model is simply an internal representation of a person’s current
understanding of something. Usually a person cannot describe this mental
mode and most often is unaware it even exists.
 Mental models are gradually developed in order to understand something,
explain things, make decisions, do something, or interact with another person.
Mental models also enable a person to predict the actions necessary to do
things if the action has been forgotten or has not yet been encountered.
 A person already familiar with one computer system will bring to another
system a mental model containing specific visual and usage expectations. If
the new system complies with already-established models, it will be much
easier to learn and use.
 The key to forming a transferable mental model of a system is design
consistency and design standards.
Movement Control

 Particularly important in screen design is Fitts’ Law (1954). This law

states that:
 The time to acquire a target is a function of the distance to and size of
the target.
 This simply means that the bigger the target is, or the closer the target
is, the faster it will be reached. The implications in screen design are:
- Provide large objects for important functions.
- Take advantage of the ―pinning actions of the sides, top, bottom,
and corners of the screen.
Learning
 Learning, as has been said, is the process of encoding in long-term
memory information
 A design developed to minimize human learning time can greatly
accelerate human performance. People prefer to stick with what they
know, and they prefer to jump in and get started that is contained in short-
term memory.
 Learning can be enhanced if it:
- Allows skills acquired in one situation to be used in another somewhat
like it. Design consistency accomplishes this.
- Provides complete and prompt feedback.
- Is phased, that is, it requires a person to know only the information
needed at that stage of the learning process.
Skill
 The goal of human performance is to perform skillfully. To do so requires
linking inputs and responses into a sequence of action. The essence of skill
is performance of actions or movements in the correct time sequence with
adequate precision.

 Skills are hierarchical in nature, and many basic skills may be integrated
to form increasingly complex ones. Lower-order skills tend to become
routine and may drop out of consciousness.
Individual Differences
 In reality, there is no average user. A complicating but very advantageous
human characteristic is that we all differ—in looks, feelings, motor
abilities, intellectual abilities, learning abilities and speed, and so on.

 Individual differences complicate design because the design must permit

people with widely varying characteristics to satisfactorily and
comfortably learn the task or job, or use the Web site.

 Multiple versions of a system can easily be created. Design must provide

for the needs of all potential users.
Human Interaction Speeds
 The speed at which people can perform using various communication
methods has been studied by a number of researchers. The following,
are summarized as table below
Performance versus Preference
 people may prefer an interface design feature that actually yields poorer
performance than another feature.
 Preferences are influenced by a number of things, including familiarity,
aesthetics, novelty, and perceived effort in feature use. Rarely are people
aware of the many human mechanisms responsible for the speed and
accuracy of human-computer interaction.
 Ideally, in design, always augment preferences with performance
measures and try to achieve an optimized solution. Where optimization is
impossible, however, implement the feature that provides the best
performance, and, very importantly, explain to the user why this is being
done. In these cases the user may not always be right.
 Methods for Gaining an Understanding of
Users
 Visit user locations, particularly if they are unfamiliar to you, to gain an
understanding of the user’s work environment.
 Talk with users about their problems, difficulties, wishes, and what works
well now. Establish direct contact; avoid relying on intermediaries.
 Observe users working or performing a task to see what they do, their
difficulties, and their problems.
 Videotape users working or performing a task to illustrate and study problems
and difficulties.
 Learn about the work organization where the system may be installed.
 Have users think aloud as they do something to uncover details that may not
otherwise be solicited.
 Try the job yourself. It may expose difficulties that are not known, or
expressed, by users.
Understand the Business Function
The general steps to be performed are:
 Perform a business definition and requirements analysis.
 Determine basic business functions.
 Describe current activities through task analysis.
 Develop a conceptual model of the system.
 Establish design standards or style guides.
 Establish system usability design goals.
 Define training and documentation needs.
 Business Definition and Requirements
Analysis

 The objective of this phase is to establish the need for a system. A

requirement is an objective that must be met.
 A product description is developed and refined, based on input
from users or marketing.
DIRECT METHODS
Advantages
 The significant advantage of the direct methods is the opportunity they
provide to hear the user’s comments in person and firsthand.
 Person-to-person encounters permit multiple channels of
communication (body language, voice inflections, and so on) and
provide the opportunity to immediately follow up on vague or
incomplete data.
 Here are some recommended direct methods for getting input from
users.
Individual Face-to-Face Interview
 A one-on-one visit with the user to obtain information. It may be structured or
somewhat open-ended.
 A formal questionnaire should not be used, however. Useful topics to ask the
user to describe in an interview include:
 The activities performed in completing a task or achieving a goal or objective.
 The methods used to perform an activity.
 What interactions exist with other people or systems?
 It is also very useful to also uncover any:
Potential measures of system usability
Unmentioned exceptions to standard policies or procedures.
Relevant knowledge the user must possess to perform the activity.
Advantages
 Advantages of a personal interview are that you can give the user your
full attention, can easily include follow-up questions to gain additional
information, will have more time to discuss topics in detail, and
willderive a deeper understanding of your users, their experiences,
attitudes, beliefs, and desires.
Disadvantages
 Disadvantages of interviews are that they can be costly and
timeconsuming to conduct, and someone skilled in interviewing
techniques should perform them.
Telephone Interview or Survey
 A structured interview conducted via telephone.
Advantages
 Arranging the interview in advance allows the user to prepare for it.
Telephone interviews are less expensive and less invasive than
personal interviews. They can be used much more frequently and are
extremely effective for very specific information.
Disadvantage
It is impossible to gather contextual information, such as a description
of the working environment, replies may be easily influenced by the
interviewer’s comments, and body language cues are missing. Also, it
may be difficult to contact the right person for the telephone interview.
 Traditional Focus Group
 A small group of users and a moderator brought together to verbally discuss
the requirements. The purpose of a focus group is to probe user’s
experiences, attitudes, beliefs, and desires, and to obtain their reactions to
ideas or prototypes
 Setting up focus group involves the following:
Establish the objectives of the session.
Select participants representing typical users, or potential users.
Write a script for the moderator to follow.
Find a skilled moderator to facilitate discussion, to ensure that the discussion
remains focused on relevant topics, and to ensure that everyone participates.
Allow the moderator flexibility in using the script.
Take good notes, using the session recording for backup and clarification
Facilitated Team Workshop
 A facilitated, structured workshop held with users to obtain
requirements information. Similar to the traditional Focus Group.
 Like focus groups, they do require a great deal of time to organize and
run.
Observational Field Study
 Users are observed and monitored for an extended time to learn what
they do.
 Observation provides good insight into tasks being performed, the
working environment and conditions, the social environment, and
working practices.
 Observation, however, can be time-consuming and expensive.
 Video recording of the observation sessions will permit detailed task
analysis.
Requirements Prototyping
 A demo, or very early prototype, is presented to users for comments
concerning functionality.

User-Interface Prototyping
 A demo, or early prototype, is presented to users to uncover user-
interface issues and problems
Usability Laboratory Testing
 Users at work are observed, evaluated, and measured in a specially
constructed laboratory to establish the usability of the product at that
point in time.
 Usability tests uncover what people actually do, not what they think
they do a common problem with verbal descriptions.
 The same scenarios can be presented to multiple users, providing
comparative data from several users.
 Card Sorting for Web Sites
 A technique to establish groupings of information for Web sites. Briefly, the
process is as follows:
 From previous analyses, identify about 50 content topics and inscribe them
on index cards. Limit topics to no more than 100.
 Provide blank index cards for names of additional topics the participant may
want to add, and colored blank cards for groupings that the participant will be
asked to create.
 Number the cards on the back.
 Arrange for a facility with large enough table for spreading out cards.
 Select participants representing a range of users. Use one or two people at a
time and 5 to 12 in total.
 Explain the process to the participants, saying that you are trying to
determine what categories of information will be useful, what groupings
make sense, and what the groupings should be called.
 Ask the participants to sort the cards and talk out loud while doing so.
Advise the participants that additional content cards may be named and
added as they think necessary during the sorting process.
 Observe and take notes as the participants talk about what they are doing.
Pay particular attention to the sorting rationale.
 Upon finishing the sorting, if a participant has too many groupings ask that
they be arranged hierarchically.
 Ask participants to provide a name for each grouping on the colored blank
cards, using words that the user would expect to see that would lead them to
that particular grouping.
 Make a record of the groupings using the numbers on the back of each card.
 Reshuffle the cards for the next session.
 When finished, analyze the results looking for commonalities among the
different sorting sessions.
INDIRECT METHODS

 An indirect method of requirements determination is one that places an

intermediary between the developer and the user. This intermediary
may be electronic or another person
Problems of Indirect Method
 First, there may be a filtering or distortion of the message, either
intentional or unintentional.
 Next, the intermediary may not possess a complete, or current,
understanding of user’s needs, passing on an incomplete or incorrect
message.
 Finally, the intermediary may be a mechanism that discourages direct
user developer contact for political reasons.
MIS Intermediary

 A company representative defines the user’s goals and needs to

designers and developers.
 This representative may come from the Information Services
department itself, or he or she may be from the using department.
Paper Survey or Questionnaire
 A survey or questionnaire is administered to a sample of users using
traditional mail methods to obtain their needs.
Advantage
 Questionnaires have the potential to be used for a large target audience
located most anywhere, and are much cheaper than customer visits.
 They generally, however, have a low return rate
Disadvantage
 They may take a long time to collect and may be difficult to analyze
 Questionnaires should be composed mostly of closed questions
 Questionnaires should be relatively short and created by someone
experienced in their design.
Electronic Survey or Questionnaire
 A survey or questionnaire is administered to a sample of users using e-
mail or the Web to obtain their needs.
 In creating an electronic survey:
Determine the survey objectives.
Determine where you will find the people to complete the survey.
Create a mix of multiple choice and open-ended questions requiring short
answers addressing the survey objectives.
Keep it short, about 10 items or less is preferable.
Keep it simple, requiring no more than 5–10 minutes to complete
Iterative survey
 Consider a follow-up more detailed survey, or surveys, called iterative
surveys. Ask people who complete and return the initial survey if they
are willing to answer more detailed questions. If so, create and send the
more detailed survey.
 A third follow-up survey can also be designed to gather additional
information about the most important requirements and tasks
 Iterative surveys, of course, take a longer time to complete.
Electronic Focus Group
 A small group of users and a moderator discuss the requirements
online using workstations.
advantages
 Advantages of electronic focus groups over traditional focus groups
are that the discussion is less influenced by group dynamics; has a
smaller chance of being dominated by one or a few participants; can
be anonymous, leading to more honest comments and less caution in
proposing new ideas
Disadvantages
 The depth and richness of verbal discussions does not exist and the
communication enhancement aspects of seeing participant’s body
language are missing.
Marketing and Sales
 Company representatives who regularly meet customers obtain
suggestions or needs, current and potential.
Support Line
 Information collected by the unit that helps customers with day-to-day
problems is analyzed (Customer Support, Technical Support, Help
Desk, etc.).
E-Mail or Bulletin Board
 Problems, questions, and suggestions from users posted to a bulletin
board or through e-mail are analyzed.
 User Group : Improvements are suggested by customer groups who
convene periodically to discuss software usage. They require careful
planning.
 Competitor Analyses : A review of competitor’s products or Web sites
is used to gather ideas, uncover design requirements and identify tasks.
 Trade Show : Customers at a trade show are presented a mock-up or
prototype and asked for comments.
 Other Media Analysis:
An analysis of how other media, print or broadcast, present the process,
information, or subject matter of interest.
 System Testing:
New requirements and feedback are obtained from ongoing product testing
Requirements Collection Guidelines
Establish 4 to 6 different developer-user links.
Provide most reliance on direct links.
Determining Basic Business Functions
 A detailed description of what the product will do is prepared. Major
system functions are listed and described, including critical system
inputs and outputs. A flowchart of major functions is developed. The
process the developer will use is summarized as follows:
 Gain a complete understanding of the user’s mental model based upon:
The user’s needs and the user’s profile.
A user task analysis.
 Develop a conceptual model of the system based upon the user’s
mental model. This includes:
Defining objects.
Developing metaphors.
Understanding the User’s Mental Model

 A goal of task analysis, and a goal of understanding the user, is to gain a

picture of the user’s mental model. A mental model is an internal
representation of a person’s current conceptualization and
understanding of something.

 Mental models are gradually developed in order to understand, explain,

and do something. Mental models enable a person to predict the actions
necessary to do things if the actions have been forgotten or have not yet
been encountered.
Performing a Task Analysis
 User activities are precisely described in a task analysis. Task analysis
involves breaking down the user’s activities to the individual task level.
The goal is to obtain an understanding of why and how people currently
do the things that will be automated.
 Knowing why establishes the major work goals; knowing how provides
details of actions performed to accomplish these goals.
 Task analysis also provides information concerning workflows, the
interrelationships between people, objects, and actions, and the user’s
conceptual frameworks. The output of a task analysis is a complete
description of all user tasks and interactions.
 The objects can be sorted into the following categories:
 Concrete objects—things that can be touched.
 People who are the object of sentences—normally organization
employees, customers,
 Forms or journals—things that keep track of information.
 People who are the subject of sentences—normally the users of a
system.
 Abstract objects—anything not included above.
Developing Conceptual Models
 The output of the task analysis is the creation, by the designer, of a
conceptual model for the user interface. A conceptual model is the
general conceptual framework through which the system’s functions are
presented. Such a model describes how the interface will present
objects, the relationships between objects, the properties of objects, and
the actions that will be performed.
 The goal of the designer is to facilitate for the user the development of
useful mental model of the system. This is accomplished by presenting
to the user a meaningful conceptual model of the system. When the user
then encounters the system, his or her existing mental model will,
hopefully, mesh well with the system’s conceptual model.
 Guidelines for Designing Conceptual Models
 Reflect the user’s mental model, not the designer’s.
 Draw physical analogies or present metaphors.
 Comply with expectancies, habits, routines, and stereotypes.
 Provide action-response compatibility.
 Make invisible parts and process of a system visible.
 Provide proper and correct feedback.
Provide visible results of actions. Display actions in progress.
Provide a continuous indication of status. Present as much context information
as possible. Provide clear, constructive, and correct error messages.
 Avoid anything unnecessary or irrelevant.
 Provide design consistency.
 Provide documentation and a help system that will reinforce the conceptual
model.
 Defining Objects

 Determine all objects that have to be manipulated to get work done.

Describe: — The objects used in tasks.
— Object behavior and characteristics that differentiate each kind of object.
— The relationship of objects to each other and the people using them.
— The actions performed.
— The objects to which actions apply.
— State information or attributes that each object in the task must preserve,
display, or allow to be edited.
Identify the objects and actions that appear most often in the workflow.
Make the several most important objects very obvious and easy to manipulate.
Developing Metaphors
 A metaphor is a concept where one’s body of knowledge about one
thing is used to understand something else. Metaphors act as building
blocks of a system, aiding understanding of how a system works and is
organized.
 Real-world metaphors are most often the best choice. Replicate what is
familiar and well known.
A common metaphor in a graphical system is the desktop and its
components,
 Choose the analogy that works best for each object and its actions.
 Use real-world metaphors.
 Use simple metaphors.
 Use common metaphors.
 Multiple metaphors may coexist.
 Use major metaphors, even if you can’t exactly replicate them visually.
 Test the selected metaphors.
 Design Standards or Style Guides
 A design standard or style guide documents an agreed-upon way of doing
something. In interface design it describes the appearance and behavior of
the interface and provides some guidance on the proper use of system
components.

 It also defines the interface standards, rules, guidelines, and conventions that
must be followed in detailed design.

 It will be based on the characteristics of the system’s hardware and software,

the principles of good interface and screen design, the needs of system users,
and any unique company or organization requirements that may exist.
Value of Standards and Guidelines
 Developing and applying design standards or guidelines achieves
design consistency. This is valuable to users because the standards and
guidelines:
 Allow faster performance.
 Reduce errors.
 Reduce training time.
 Foster better system utilization.
 Improve satisfaction.
 Improve system acceptance
They are valuable to system developers because they:
 Increase visibility of the human-computer interface.
 Simplify design.
 Provide more programming and design aids, reducing programming
time.
 Reduce redundant effort.
 Reduce training time.
 Provide a benchmark for quality control testing.
 Web Guidelines and Style Guides
 Web interface design issues have also unleashed a plethora of Web-specific
design guidelines and style guides, many of which are found on the Web
itself. These guidelines can be seen on the sites of the various computer
companies and interface consulting firms, in newsletters, and even on
personal Web sites. While many of the traditional interface guidelines are
applicable in a Web environment, the Web does impose a host of additional
considerations.
 The haste to publish Web design guidelines has been fueled by the explosive
growth of the Web and a corresponding explosive growth in the number of
developers creating sites for public access. In the brief existence of the Web,
there has not been an opportunity for conventions and style guides to be
properly developed and then accepted by the development community. This
situation is made worse by the fact that many Web developers have had
limited knowledge of traditional interface issues and concerns, and many are
unfamiliar with the traditional interface design guidelines. Web guideline
documents have attempted to fill this void.
Document Design
 Include checklists to present principles and guidelines.
 Provide a rationale for why the particular guidelines should be used.
 Provide a rationale describing the conditions under which various
design alternatives are appropriate.
 Include concrete examples of correct design.
 Design the guideline document following recognized principles for
good document design.
 Provide good access mechanisms such as a thorough index, a table of
contents, glossaries, and checklists.
Document Design
 Checklists and rationale
 Concrete examples
 Document design and access
Design Support and Implementation
 Use all available reference sources in creating the guidelines.
 Use development and implementation tools that support the guidelines.
 Begin applying the guidelines immediately.
 Available Reference Sources
 Tool
 Applying the Guidelines
 System Training and Documentation
Needs
Needs Training
 System training will be based on user needs, system conceptual design,
system learning goals, and system performance goals.

 Training may include such tools as formal or video training, manuals,

online tutorials, reference manuals, quick reference guides, and online
help.

 Any potential problems can also be identified and addressed earlier in

the design process, reducing later problems and modification costs.
 System Training and Documentation
Needs
Documentation
 System documentation is a reference point, a form of communication,
and a more concrete design—words that can be seen and understood
based on user needs, system conceptual design, and system
performance goals.

 It will also be Creating documentation during the development

progress will uncover issues and reveal omissions that might not
otherwise be detected until later in the design process.