SlideShare a Scribd company logo
1 of 40
Unit-2
The User Interface Design Process
based on client, Business functions
and Principal of Screen Design
Why People Have Trouble with Computers
Although system design and its behavioral implications have come under intense scrutiny
in the last decade or so, as we have seen, this has not always been the case. Historically,the
design of business computer systems has been the responsibility of programmers,systems
analysts, and system designers, many of whom possess extensive technical knowledge but
little behavioral training.
The intuition of designers or of anyone else, no matter how good or bad they may be at
what they do, is error-prone. It is much too shallow a foundation on which to base design
decisions. Specialized knowledge lulls one into a false sense of security. It enables one to
interpret and deal with complex or ambiguous situations on the basis of
context cues not visible to users, as well as a knowledge of the computer system that
users do not possess. The result is a system that appears perfectly useful to its designers
but one that the user is unable or unwilling to face up to and master.
Use of jargon
Systems often speak in a strange language. Words that are completely alien to the
office or home environment or used in different contexts, such as filespec, abend,
segment, and boot, proliferate. Learning to use a system often requires
learning a new language
Non-obvious design
Complex or novel design elements are not obvious or intuitive, but they must
nevertheless be mastered. Operations may have prerequisite conditions that must
be satisfied before they can be accomplished, or outcomes may not always be
immediate, obvious, or visible. The overall framework of the system may be
invisible, with the effect that results cannot always be related to the actions that
accomplish them.
Fine distinctions. Different actions may accomplish the same thing, depending
upon when they are performed, or different things may result from the same
action.
Often these distinctions are minute and difficult to keep track of.
Responses to Poor Design
Unfortunately, people remember the one thing that went wrong, not the many that
go right, so problems are ascribed an abnormal level of importance. Errors are a
symptom of problems. The magnitude of errors in a computer-based system has
been found to be as high as 46 percent for commands, tasks, or transactions. Errors,
and other problems that befuddle one, lead to a variety of psychological and physical
user responses.
Confusion
Detail overwhelms the perceived structure. Meaningful patterns are difficult to ascertain,
and the conceptual model or underlying framework cannot be understood or
established.
Annoyance
Roadblocks that prevent a task being completed, or a need from being satisfied,
promptly and efficiently lead to annoyance. Inconsistencies in design, slow computer
reaction times, difficulties in quickly finding information, outdated information, and
visual screen distractions are a few of the many things that may annoy users
Frustration
An overabundance of annoyances, an inability to easily convey one’s intentions to the
computer, or an inability to finish a task or satisfy a need can cause frustration.
Frustration is heightened if an unexpected computer response cannot be undone or if
what really took place cannot be determined
Panic or stress
Unexpectedly long delays during times of severe or unusual pressure may introduce
panic or stress. Some typical causes are unavailable systems or long response times
when the user is operating under a deadline or dealing with an irate customer.
Boredom.
Boredom results from improper computer pacing (slow response times or long
download times) or overly simplistic jobs.
Psychological
Typical psychological responses to poor design are:
Confusion.
Detail overwhelms the perceived structure. Meaningful patterns are difficult to ascertain,
and the conceptual model or underlying framework cannot be understood or established
Annoyance.
Roadblocks that prevent a task being completed, or a need from being satisfied,
promptly and efficiently lead to annoyance. Inconsistencies in design, slow computer
reaction times, difficulties in quickly finding information, outdated information, and
visual screen distractions are a few of the many things that may annoy users.
Frustration
An overabundance of annoyances, an inability to easily convey one’s intentions to the
computer, or an inability to finish a task or satisfy a need can cause frustration.
Panic or stress
Unexpectedly long delays during times of severe or unusual pressure may introduce
panic or stress. Some typical causes are unavailable systems or long response times
when the user is operating under a deadline or dealing with an irate customer
Boredom
Boredom results from improper computer pacing (slow response times or long
download times) or overly simplistic jobs
Physical
Psychological responses frequently lead to, or are accompanied by, the following
physical reactions.
Abandonment of the system.
The system is rejected and other information sources are relied upon. These sources
must, of course, be available and the user must have the discretion to perform the
rejection.
Partial use of the system
Only a portion of the system’s capabilities are used, usually those operations that are
easiest to perform or that provide the most benefits. Historically, this has been the most
common user reaction to most computer systems.
Indirect use of the system
An intermediary is placed between the would-be user and the computer.
Modification of the task
The task is changed to match the capabilities of the system. This is a prevalent reaction
when the tools are rigid and the problem is unstructured, as in scientific problem
solving.
Compensatory activity
Additional actions are performed to compensate for system inadequacies. A common
example is the manual reformatting of information to match the structure required by
the computer.
Important Human Characteristics in Design
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. We classify stimuli
based on models stored in our memories and in this way achieve understanding.
Comparing the accumulated knowledge of the child with that of an adult in interpreting
the world is a vivid example of the role of experience in perception. 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.
Succinctness.
We see an object as having some perfect or simple shape because perfectio or simplicity
is easier to remember.
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.
Memory
Memory is not the most stable of human attributes, as anyone who has forgotten
why they walked into a room, or forgotten a very important birthday, can attest.
Today, 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
longterm 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.
Long-term memory contains the knowledge we possess. 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. The human active vocabulary (words that can be
recalled) typically ranges between 2,000 and 3,000 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
Repeated and excessive stimulation can fatigue the sensory storage mechanism,
making it less attentive and unable to distinguish what is important (called
habituation). 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.
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 just described. 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.
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. Recent thinking (Lind,
Johnson, and Sandblad, 1992) is that there are two levels of information processing
going on within us. One level, the highest level, is identified with consciousness and
working memory.
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. We look
rather than see, perceive rather than read.
Mental Models
As a result of our experiences and culture, we develop mental models of things and
people we interact with. 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.
Movement Control
Once data has been perceived and an appropriate action decided upon, a response
must be made; in many cases the response is a movement
Particularly important in screen design is Fitts’ Law (1954). This law states that:
1.The time to acquire a target is a function of the distance to and size of the target.
2.This simply means that the bigger the target is, or the closer the target is, the
faster
3.it will be reached. The implications in screen design are:
4.Provide large objects for important functions.
5.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 that is contained in short-term memory. It is a complex process requiring
some effort on our part. Our ability to learn is important—it clearly differentiates
people from machines. Given enough time people can improve their performance in
almost any task. Too often, however, designers use our learning ability as an excuse to
justify complex design. Because people can be taught to walk a tightrope is no excuse
for incorporating tightropes in a design when walkways are feasible.
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. It is characterized by
consistency and economy of effort. Economy of effort is achieved by establishing a work
pace that represents optimum efficiency.
Human Considerations in Design
The User’s Knowledge and Experience
The knowledge possessed by a person, and the experiences undergone, shape the
design of the interface in many ways. The following kinds of knowledge and
experiences should be identified.
Computer Literacy
Are the users highly technical such as programmers or experienced data entry clerks?
Do they have moderate computer experience or none at all? Will they be familiar with
computer concepts and terms, the keyboard and its keys, and a mouse or other input
mechanisms? If familiar, how familiar?
System Experience
Are users already familiar with the interaction requirements of the new system,
somewhatfamiliar, or not familiar at all? Have users worked with similar systems? If
so, what kind? What are the similarities? The differences? The same questions can be
asked for Web systems.
Application Experience
Have users worked with a similar application (for example, word processing, airline
reservation, and so on)? Are they familiar with the basic application terms? Or does
little or no application experience exist
Task Experience
Are users experienced with the task being automated? If it is an insurance claim system,
do users have experience with paying claims? If it is a banking system, do users have
experience in similar banking applications? Or do users possess little or no knowledge of
the tasks the system will be performing?
Other System Use
Will the user be using other systems while using the new system? If so, they will bring
certain habits and expectancies to the new system. The more compatibility between
systems, the lower the learning requirements for the new system and the higher the
productivity using all systems.
Typing Skill
Is the user a competent typist or of the hunt-and-peck variety? Is he or she familiar with
the standard keyboard layout or other newer layouts? A competent typist may prefer to
interact with the system exclusively through the keyboard, whereas the unskilled typist
may prefer the mouse.
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. There are many techniques for capturing information for
determining requirements. Keil and Carmel (1995), Popowicz (1995), and Fuccella et al.
(1999) described many of the methods summarized in Table 2.1 and discussed shortly.
They have also provided insights into their advantages and disadvantages. The
techniques listed are classified as direct and indirect. Direct methods consist of face-to-
face meetings with, or actual viewing of, users to solicit requirements. Indirect methods
impose an intermediary, someone or something, between the users and the developers
Direct Methods
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.
A one-on-one visit is held with the user. It may be structured or more open-ended. The
interview must have focus and topics to be covered must be carefully planned so data is
collected in a common framework, and to ensure that all important aspects are
thoroughly covered
1.The activities performed in completing a task or achieving a goal or objective.
2.The methods used to perform an activity.
3.What interactions exist with other people or systems.
4.It is also very useful to also uncover any:
5.Potential measures of system usability
6.Unmentioned exceptions to standard policies or procedures.
7.Relevant knowledge the user must possess to perform the activity.
8.If designing a Web site, the following kinds of interview questions
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 will derive a deeper understanding of your users,
their experiences, attitudes, beliefs, and desires.
Disadvantages of interviews are that they can be costly and time-consuming to
conduct, and someone skilled in interviewing techniques should perform them.
Telephone Interview or Survey
This interview is conducted using the telephone. It must have structure and be well
planned. 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.
Telephone interviews have some disadvantages. 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.
Traditional Focus Group
A small group of users (8 to 12) and a moderator are brought together to discuss
the requirements. While the discussion is loosely structured, the range of topics
must be determined beforehand. A typical session lasts about two hours. 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. Focus groups are not
usually useful for establishing how users really work or what kinds of usability
problems they really have. Focus group discussion can be influenced by group
dynamics, for good or bad.
Observational Field Study
To see and learn what users actually do, they are watched and followed in their own
environment, office, or home, in a range of contexts for a period of time. Observation
provides good insight into tasks being performed, the working environment and
conditions,the social environment, and working practices. It is more objective,
natural,and realistic. Observation, however, can be time-consuming and expensive
Requirements Prototyping
A demonstration model, or very early prototype, is presented to users for their
comments concerning functionality. Prototypes are discussed more fully in Step 14,
“Test, Test, and Retest
Usability Laboratory Testing
A special laboratory is constructed and users brought in to perform actual newly
designed tasks. They are observed and results measured, and evaluated 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.
User Group
Improvements suggested by customer groups who convene periodically to discuss
system and software usage are evaluated. User groups have the potential to provide a
lot of good information, if organized properly
Competitor Analysis
Reviews of competitor’s products, or Web sites, can also be used to gather ideas, uncover
design requirements, and identify tasks. The designers can perform this evaluation or, even
better, users can be asked to perform the evaluation
Trade Show
Customers at a trade show can be exposed to a mock-up or prototype and asked for
comments. This method is dependent on the knowledge level of the customers and
may provide only a superficial view of most prominent features.
System Testing
New requirements and feedback stemming from ongoing system testing can be
accumulated, evaluated, and implemented as necessary.
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
The next phase in interface design is to thoroughly describe the expected system user
or users and their current tasks. The former will be derived from the kinds of
information collected in Step 1 “Understand the User or Client,” and the requirements
analysis techniques described above. 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.
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.
Guidelines for Designing Conceptual Models
Reflect the user’s mental model, not the designer’s. A user will have different
expectations
and levels of knowledge than the designer. So, the mental models of the user and
designer will be different. The user is concerned with the task to be performed, the
business objectives that must be fulfilled.
Draw physical analogies or present metaphors. Replicate what is familiar and well
known. Duplicate actions that are already well learned. The success of graphical
systems can be attributed, in part, to their employing the desktop metaphor. A
metaphor, to be effective, must be widely applicable within an interface. Metaphors
that are only partially or occasionally applicable should not be used.
Comply with expectancies, habits, routines, and stereotypes. Create a system that
builds on knowledge, habits, routines, and expectancies that already exist. Use
familiar associations, avoiding the new and unfamiliar. With color, for example,
accepted meanings for red, yellow, and green are already well established.
Provide action-response compatibility. All system responses should be compatible
with the actions that elicit them. Names of commands, for example, should reflect the
actions that will occur. The organization of keys in documentation or help screens
should reflect the ordering that actually exists on the keyboard.
Make invisible parts of the system visible. Systems are composed of parts and
processes, many of which are invisible to the user. In creating a mental model, a person
must make a hypothesis about what is invisible and how it relates to what is visible.
New users of a system often make erroneous or incomplete assumptions about what is
invisible and develop a faulty mental model
Avoid the unnecessary or irrelevant. Never display irrelevant information on the
screen. People may try to interpret it and integrate it into their mental models,
thereby creating a false one. Irrelevant information might be unneeded data fields,
screen controls, system status codes, or error message numbers. If potentially
misleading information cannot be avoided, point this out to the user.
Provide design consistency. Design consistency reduces the number of concepts to
be learned. Inconsistency requires the mastery of multiple models. If an occasional
inconsistency cannot be avoided, explain it to the user. For example, if an error is
caused by a user action that is inconsistent with other similar actions, explain in the
error message that this condition exists.
Provide documentation and a help system that will reinforce the conceptual
model. Consistencies and metaphors should be explicitly described in the user
documentation. This will assist a person in learning the system. Do not rely on the
people to uncover consistencies and metaphors themselves.
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.
System Training and Documentation 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. (Various types of training methods are more fully addressed in Step 9.)
Training needs must be established and training components developed as the design
process unfolds. This will ensure that the proper kinds of training are defined, properly
integrated with the design, and developed correctly.
Documentation
System documentation is a reference point, a form of communication, and a more
concrete design—words that can be seen and understood. It will also be based on
user needs, system conceptual design, and system performance goals. Creating
documentation during the development progress will uncover issues and reveal
omissions that might not otherwise be detected until later in the design process.
Human Considerations in Screen Design
Use of a screen, and a system, is affected by many factors. These include: how much
information is presented on a screen, how a screen is organized, the language used on
the screen, the distinctiveness of the screen’s components, its aesthetics, and a screen’s
consistency with other screens. First, let’s look at what aspects of poor screen design
can be distracting to the user, what a user is looking for in good design, and the kinds
of things screen users do interacting with a system or Web site. Then, we’ll address the
principles of good design.
How to Distract the Screen User
These factors certainly apply to electronic forms and screens as well, and include:
Unclear captions and badly worded questions. These cause hesitation, and rereading,
in order to determine what is needed or must be provided. They may also be
interpreted incorrectly, causing errors.
Improper type and graphic emphasis. Important elements are hidden.
What Screen Users Do
1. Identifies a task to be performed or need to be fulfilled.
The task may be very structured, including activities such as: enter this data from this
form into the system, answer a specific question regarding the status of an order, or
collect the necessary information from a customer to make a reservation.
2. Decides how the task will be completed or the need fulfilled.
For a structured or semi-structured task a set of transaction screens will be available.
The proper transaction is identified and the relevant screen series retrieved. To satisfy
a general or vague need will require browsing or searching through screens that might
possibly have relevance.
3. Manipulates the computer’s controls.
To perform the task or satisfy the need,the keyboard, mouse, and other similar
devices are used to select choices from lists, choose commands to be performed, key
data into text boxes, and so forth.
4. Gathers the necessary data.
Using structured and semi-structured transaction screens information is collected from
its source: a form, a coworker, or a customer. This information is identified on the screen,
or placed on the screen, through control manipulation. To satisfy a general or vague need
may require following Web site links down many paths
5. Forms judgments resulting in decisions relevant to the task or need.
Structured transactions will require minimal decision-making. Has all the data been
collected and is the data valid? Has the transaction been successfully accepted by
the system? If not accepted, why not? Semi-structured transactions, in addition,
may require decisions such as: Which set of screens, from all available, should I
use to complete this process? How much information is needed to complete the
sale of this particular product, make a reservation in this hotel, or complete the
enrollment process for a specific program?
Misleading headings. These also create confusion and inhibit one’s ability to see
existing relationships.
Information requests perceived to be irrelevant or unnecessary. The value of what one is
doing is questioned, as is the value of the system.
Information requests that require one to backtrack and rethink a previous answer,
or look ahead to determine possible context. Inefficiency results, and mistakes
increase.
Poor quality of presentation, legibility, appearance, and arrangement. Again, thi degrades
performance, slowing the user down and causing more errors.
What Screen Users Want
What are people looking for in the design of screens? One organization asked a group
of screen users and got the following responses:
An orderly, clean, clutter-free appearance.
An obvious indication of what is being shown and what should be done with it.
Expected information located where it should be.
A clear indication of what relates to what, including options, headings, captions,
data, and so forth.
Plain, simple English.
A simple way of finding out what is in a system and how to get it out.
A clear indication of when an action can make a permanent change in the data or
system.
The desired direction is toward simplicity, clarity, and understandability—qualities
lacking in many of today’s screens
The Test for a Good Design
People look at a screen for a particular reason, perhaps to locate a piece of information
such as a customer name, to identify the name of the screen, or to find an instructional
or error message. The signal at that moment is that element of interest on the screen.
The noise is everything else on the screen. Cues independent of context that
differentiate the components of the screen will reduce visual search times and
minimize confusion.
Imagine finding the headline on the front page of the newspaper if the same type size
and style were used for all components and their positions changed from day to day. If
this is true of a screen, screen scanning will be a lengthy and cumbersome process, and
the screen will not be appealing to use. Unfortunately, many of today’s screens cannot
pass this simple test and are unnecessarily difficult to use. Almost all the tools available
to the creator of the newspaper’s front page are now available to the screen designer.
Technology has added some additional weapons. An effective solution can be achieved.
It simply involves the thoughtful use of display techniques, consistent location of
elements, the proper use of “white space” and groupings, and an understanding of
what makes visually pleasing composition. The best interfaces make everything on the
screen obvious.
Organizing Screen Elements Clearly and Meaningfully
Visual clarity is achieved when the display elements are organized and presented in
meaningful and understandable ways. A clear and clean organization makes it easier
to recognize screen’s essential elements and to ignore its secondary information when
appropriate. Clarity is influenced by a multitude of factors: consistency in design, a
visually pleasing composition, a logical and sequential ordering, the presentation of
the proper amount of information, groupings, and alignment of screen items.
Consistency
Provide real-world consistency. Reflect a person’s experiences, expectations, work
conventions, and cultural conventions.
Provide internal consistency. Observe the same conventions and rules for all
aspects of an interface screen, and all application or Web site screens, including:
— Operational and navigational procedures.
— Visual identity or theme.
— Component.
• Organization.
• Presentation.
• Usage.
• Locations.
Ordering of Screen Data and Content
Divide information into units that are logical, meaningful, and sensible.
■ Organize by the degree interrelationship between data or information.
■ Provide an ordering of screen units of information and elements that is prioritized
according to the user’s expectations and needs.
■ Possible ordering schemes include:
— Conventional.
— Sequence of use.
— Frequency of use.
— Function.
— Importance.
— General to specific.
■ Form groups that cover all possibilities.
Upper-Left Starting Point
Eyeball fixation studies indicate that in looking at displays of information, usually
one’s eyes move first to the upper-left center of the display, and then quickly move
through the display in a clockwise direction. Streveler and Wasserman (1984) found
that visual targets located in the upper-left quadrant of a screen were found fastest
and those located in the lower- right quadrant took longest to find.
Screen Navigation and Flow
Provide an ordering of screen information and elements that:
— Is rhythmic, guiding a person’s eye through the display.
— Encourages natural movement sequences.
— Minimizes pointer and eye movement distances.
■ Locate the most important and most frequently used elements or controls at the top
left.
■ Maintain a top-to-bottom, left-to-right flow.
■ Assist in navigation through a screen by:
— Aligning elements.
— Grouping elements.
— Using of line borders.
■ Through focus and emphasis, sequentially, direct attention to items that are:
1. Critical.
2. Important.
3. Secondary.
4. Peripheral.
Visually Pleasing Composition
1.Balance
The design elements have an equal weight, left to right, top to bottom. The opposite of
balance is instability; the design elements seemingly ready to topple over.
2.Symmetry
A unit on one side of the centerline is exactly replicated on the other side. This exact
replication creates formal balance, but the difference is that balance can be achieved
without symmetry.
3.Regularity
Regularity in screen design is achieved by establishing standard and consistently
spaced column and row starting points for screen elements. It is also achieved
by using elements similar in size, shape, color, and spacing. The opposite of regularity,
irregularity, exists when no such plan or principle is apparent.
4.Predictability
Viewing one screen enables one to predict how another will look. Viewing part of a
screen enables one to predict how the rest of the screen will look. The opposite of
predictability—spontaneity—suggests no plan and thus an inability to predict the structure
of the remainder of a screen or the structure of other screens
5.Unity
With unity, the elements seem to belong together, to dovetail so completely
that they are seen as one thing. The opposite of unity is fragmentation, each piece
retaining its own character. In screen design similar sizes, shapes, and colors
promote unity, as does white space—borders at the display boundary
6.Simplicity (Complexity)
The scale created may also be considered a scale of complexity, with extreme complexity
at one end and minimal complexity (simplicity) at the other. While the graphics designer
usually considers this concept as simplicity, we will address it as complexity since it has been
addressed by this term in the screen design literature, where an objective measure of it has
been derived.

More Related Content

Similar to wid_uni2.pptx

User Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionUser Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionbrindaN
 
Information processing theory
Information processing theoryInformation processing theory
Information processing theorySwapon Spn
 
20IT706PE User Interface Design - Unit 1.pptx
20IT706PE User Interface Design - Unit 1.pptx20IT706PE User Interface Design - Unit 1.pptx
20IT706PE User Interface Design - Unit 1.pptxParthibanSubramani7
 
HCI Unit 3.pptx
HCI Unit 3.pptxHCI Unit 3.pptx
HCI Unit 3.pptxRaja980775
 
Cognitive_presentation and realistics.pptx
Cognitive_presentation and realistics.pptxCognitive_presentation and realistics.pptx
Cognitive_presentation and realistics.pptxsol zem
 
Intro to user experience design
Intro to user experience designIntro to user experience design
Intro to user experience designyaluna
 
Interaction design workshop
Interaction design workshopInteraction design workshop
Interaction design workshopShyamala Prayaga
 
Information processing theory
Information processing theoryInformation processing theory
Information processing theoryAnushka1607
 
Assignment 4 hci
Assignment 4 hciAssignment 4 hci
Assignment 4 hciJeddie Bere
 
Chapter1 presentation week1
Chapter1 presentation week1Chapter1 presentation week1
Chapter1 presentation week1Assaf Arief
 
Expert Systems
Expert SystemsExpert Systems
Expert SystemsAmir NikKhah
 
Memory and Cognition
 Memory and Cognition Memory and Cognition
Memory and CognitionMuhammadasif909
 
Heuristic principles
Heuristic principlesHeuristic principles
Heuristic principlesSwathy Tantry
 
Cog learning theory
Cog learning theoryCog learning theory
Cog learning theoryDinka Rosely
 
Information Processing and Motor Skill Performance
Information Processing and Motor Skill PerformanceInformation Processing and Motor Skill Performance
Information Processing and Motor Skill PerformanceJohn John
 
3 Proven Decision Support Systems for Business Operations Managers
3 Proven Decision Support Systems for Business Operations Managers3 Proven Decision Support Systems for Business Operations Managers
3 Proven Decision Support Systems for Business Operations ManagersQuekelsBaro
 
Universal Design Principles and Methods
Universal Design Principles and MethodsUniversal Design Principles and Methods
Universal Design Principles and Methodsmbrosset
 

Similar to wid_uni2.pptx (20)

User Interface Design - Module 1 Introduction
User Interface Design - Module 1 IntroductionUser Interface Design - Module 1 Introduction
User Interface Design - Module 1 Introduction
 
Information processing theory
Information processing theoryInformation processing theory
Information processing theory
 
20IT706PE User Interface Design - Unit 1.pptx
20IT706PE User Interface Design - Unit 1.pptx20IT706PE User Interface Design - Unit 1.pptx
20IT706PE User Interface Design - Unit 1.pptx
 
HCI Unit 3.pptx
HCI Unit 3.pptxHCI Unit 3.pptx
HCI Unit 3.pptx
 
Cognitive_presentation and realistics.pptx
Cognitive_presentation and realistics.pptxCognitive_presentation and realistics.pptx
Cognitive_presentation and realistics.pptx
 
Intro to user experience design
Intro to user experience designIntro to user experience design
Intro to user experience design
 
Interaction design workshop
Interaction design workshopInteraction design workshop
Interaction design workshop
 
Information processing theory
Information processing theoryInformation processing theory
Information processing theory
 
Assignment 4 hci
Assignment 4 hciAssignment 4 hci
Assignment 4 hci
 
Chapter1 presentation week1
Chapter1 presentation week1Chapter1 presentation week1
Chapter1 presentation week1
 
Expert Systems
Expert SystemsExpert Systems
Expert Systems
 
Memory and Cognition
 Memory and Cognition Memory and Cognition
Memory and Cognition
 
Heuristic principles
Heuristic principlesHeuristic principles
Heuristic principles
 
Cog learning theory
Cog learning theoryCog learning theory
Cog learning theory
 
Information Processing and Motor Skill Performance
Information Processing and Motor Skill PerformanceInformation Processing and Motor Skill Performance
Information Processing and Motor Skill Performance
 
3 Proven Decision Support Systems for Business Operations Managers
3 Proven Decision Support Systems for Business Operations Managers3 Proven Decision Support Systems for Business Operations Managers
3 Proven Decision Support Systems for Business Operations Managers
 
Paradox of the Active User
Paradox of the Active UserParadox of the Active User
Paradox of the Active User
 
Tables
TablesTables
Tables
 
Universal Design Principles and Methods
Universal Design Principles and MethodsUniversal Design Principles and Methods
Universal Design Principles and Methods
 
Manual stella ist
Manual stella istManual stella ist
Manual stella ist
 

Recently uploaded

Folding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a seriesFolding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a seriesPhilip Schwarz
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...Christina Lin
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackVICTOR MAESTRE RAMIREZ
 
Cloud Data Center Network Construction - IEEE
Cloud Data Center Network Construction - IEEECloud Data Center Network Construction - IEEE
Cloud Data Center Network Construction - IEEEVICTOR MAESTRE RAMIREZ
 
Professional Resume Template for Software Developers
Professional Resume Template for Software DevelopersProfessional Resume Template for Software Developers
Professional Resume Template for Software DevelopersVinodh Ram
 
Unveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsUnveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsAhmed Mohamed
 
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...stazi3110
 
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...soniya singh
 
Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024Andreas Granig
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataBradBedford3
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityNeo4j
 
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio, Inc.
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - InfographicHr365.us smith
 
What is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need ItWhat is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need ItWave PLM
 
Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...OnePlan Solutions
 
React Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaReact Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaHanief Utama
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)OPEN KNOWLEDGE GmbH
 
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...MyIntelliSource, Inc.
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...gurkirankumar98700
 

Recently uploaded (20)

Folding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a seriesFolding Cheat Sheet #4 - fourth in a series
Folding Cheat Sheet #4 - fourth in a series
 
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort ServiceHot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
 
Cloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStackCloud Management Software Platforms: OpenStack
Cloud Management Software Platforms: OpenStack
 
Cloud Data Center Network Construction - IEEE
Cloud Data Center Network Construction - IEEECloud Data Center Network Construction - IEEE
Cloud Data Center Network Construction - IEEE
 
Professional Resume Template for Software Developers
Professional Resume Template for Software DevelopersProfessional Resume Template for Software Developers
Professional Resume Template for Software Developers
 
Unveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsUnveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML Diagrams
 
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
Building a General PDE Solving Framework with Symbolic-Numeric Scientific Mac...
 
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
Russian Call Girls in Karol Bagh Aasnvi ➡️ 8264348440 💋📞 Independent Escort S...
 
Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024Automate your Kamailio Test Calls - Kamailio World 2024
Automate your Kamailio Test Calls - Kamailio World 2024
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
 
EY_Graph Database Powered Sustainability
EY_Graph Database Powered SustainabilityEY_Graph Database Powered Sustainability
EY_Graph Database Powered Sustainability
 
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - Infographic
 
What is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need ItWhat is Fashion PLM and Why Do You Need It
What is Fashion PLM and Why Do You Need It
 
Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...
 
React Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaReact Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief Utama
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
 
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
Steps To Getting Up And Running Quickly With MyTimeClock Employee Scheduling ...
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
 

wid_uni2.pptx

  • 1. Unit-2 The User Interface Design Process based on client, Business functions and Principal of Screen Design
  • 2. Why People Have Trouble with Computers Although system design and its behavioral implications have come under intense scrutiny in the last decade or so, as we have seen, this has not always been the case. Historically,the design of business computer systems has been the responsibility of programmers,systems analysts, and system designers, many of whom possess extensive technical knowledge but little behavioral training. The intuition of designers or of anyone else, no matter how good or bad they may be at what they do, is error-prone. It is much too shallow a foundation on which to base design decisions. Specialized knowledge lulls one into a false sense of security. It enables one to interpret and deal with complex or ambiguous situations on the basis of context cues not visible to users, as well as a knowledge of the computer system that users do not possess. The result is a system that appears perfectly useful to its designers but one that the user is unable or unwilling to face up to and master.
  • 3. Use of jargon Systems often speak in a strange language. Words that are completely alien to the office or home environment or used in different contexts, such as filespec, abend, segment, and boot, proliferate. Learning to use a system often requires learning a new language Non-obvious design Complex or novel design elements are not obvious or intuitive, but they must nevertheless be mastered. Operations may have prerequisite conditions that must be satisfied before they can be accomplished, or outcomes may not always be immediate, obvious, or visible. The overall framework of the system may be invisible, with the effect that results cannot always be related to the actions that accomplish them. Fine distinctions. Different actions may accomplish the same thing, depending upon when they are performed, or different things may result from the same action. Often these distinctions are minute and difficult to keep track of.
  • 4. Responses to Poor Design Unfortunately, people remember the one thing that went wrong, not the many that go right, so problems are ascribed an abnormal level of importance. Errors are a symptom of problems. The magnitude of errors in a computer-based system has been found to be as high as 46 percent for commands, tasks, or transactions. Errors, and other problems that befuddle one, lead to a variety of psychological and physical user responses. Confusion Detail overwhelms the perceived structure. Meaningful patterns are difficult to ascertain, and the conceptual model or underlying framework cannot be understood or established. Annoyance Roadblocks that prevent a task being completed, or a need from being satisfied, promptly and efficiently lead to annoyance. Inconsistencies in design, slow computer reaction times, difficulties in quickly finding information, outdated information, and visual screen distractions are a few of the many things that may annoy users
  • 5. Frustration An overabundance of annoyances, an inability to easily convey one’s intentions to the computer, or an inability to finish a task or satisfy a need can cause frustration. Frustration is heightened if an unexpected computer response cannot be undone or if what really took place cannot be determined Panic or stress Unexpectedly long delays during times of severe or unusual pressure may introduce panic or stress. Some typical causes are unavailable systems or long response times when the user is operating under a deadline or dealing with an irate customer. Boredom. Boredom results from improper computer pacing (slow response times or long download times) or overly simplistic jobs.
  • 6. Psychological Typical psychological responses to poor design are: Confusion. Detail overwhelms the perceived structure. Meaningful patterns are difficult to ascertain, and the conceptual model or underlying framework cannot be understood or established Annoyance. Roadblocks that prevent a task being completed, or a need from being satisfied, promptly and efficiently lead to annoyance. Inconsistencies in design, slow computer reaction times, difficulties in quickly finding information, outdated information, and visual screen distractions are a few of the many things that may annoy users. Frustration An overabundance of annoyances, an inability to easily convey one’s intentions to the computer, or an inability to finish a task or satisfy a need can cause frustration.
  • 7. Panic or stress Unexpectedly long delays during times of severe or unusual pressure may introduce panic or stress. Some typical causes are unavailable systems or long response times when the user is operating under a deadline or dealing with an irate customer Boredom Boredom results from improper computer pacing (slow response times or long download times) or overly simplistic jobs Physical Psychological responses frequently lead to, or are accompanied by, the following physical reactions. Abandonment of the system. The system is rejected and other information sources are relied upon. These sources must, of course, be available and the user must have the discretion to perform the rejection.
  • 8. Partial use of the system Only a portion of the system’s capabilities are used, usually those operations that are easiest to perform or that provide the most benefits. Historically, this has been the most common user reaction to most computer systems. Indirect use of the system An intermediary is placed between the would-be user and the computer. Modification of the task The task is changed to match the capabilities of the system. This is a prevalent reaction when the tools are rigid and the problem is unstructured, as in scientific problem solving. Compensatory activity Additional actions are performed to compensate for system inadequacies. A common example is the manual reformatting of information to match the structure required by the computer.
  • 9. Important Human Characteristics in Design 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. We classify stimuli based on models stored in our memories and in this way achieve understanding. Comparing the accumulated knowledge of the child with that of an adult in interpreting the world is a vivid example of the role of experience in perception. 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.
  • 10. 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. Succinctness. We see an object as having some perfect or simple shape because perfectio or simplicity is easier to remember. 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.
  • 11. Memory Memory is not the most stable of human attributes, as anyone who has forgotten why they walked into a room, or forgotten a very important birthday, can attest. Today, 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 longterm 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. Long-term memory contains the knowledge we possess. 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. The human active vocabulary (words that can be recalled) typically ranges between 2,000 and 3,000 words.
  • 12. 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 Repeated and excessive stimulation can fatigue the sensory storage mechanism, making it less attentive and unable to distinguish what is important (called habituation). 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. 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 just described. 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.
  • 13. 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. Recent thinking (Lind, Johnson, and Sandblad, 1992) is that there are two levels of information processing going on within us. One level, the highest level, is identified with consciousness and working memory. 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. We look rather than see, perceive rather than read. Mental Models As a result of our experiences and culture, we develop mental models of things and people we interact with. 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.
  • 14. Movement Control Once data has been perceived and an appropriate action decided upon, a response must be made; in many cases the response is a movement Particularly important in screen design is Fitts’ Law (1954). This law states that: 1.The time to acquire a target is a function of the distance to and size of the target. 2.This simply means that the bigger the target is, or the closer the target is, the faster 3.it will be reached. The implications in screen design are: 4.Provide large objects for important functions. 5.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 that is contained in short-term memory. It is a complex process requiring some effort on our part. Our ability to learn is important—it clearly differentiates people from machines. Given enough time people can improve their performance in almost any task. Too often, however, designers use our learning ability as an excuse to justify complex design. Because people can be taught to walk a tightrope is no excuse for incorporating tightropes in a design when walkways are feasible.
  • 15. 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. It is characterized by consistency and economy of effort. Economy of effort is achieved by establishing a work pace that represents optimum efficiency. Human Considerations in Design The User’s Knowledge and Experience The knowledge possessed by a person, and the experiences undergone, shape the design of the interface in many ways. The following kinds of knowledge and experiences should be identified.
  • 16. Computer Literacy Are the users highly technical such as programmers or experienced data entry clerks? Do they have moderate computer experience or none at all? Will they be familiar with computer concepts and terms, the keyboard and its keys, and a mouse or other input mechanisms? If familiar, how familiar? System Experience Are users already familiar with the interaction requirements of the new system, somewhatfamiliar, or not familiar at all? Have users worked with similar systems? If so, what kind? What are the similarities? The differences? The same questions can be asked for Web systems. Application Experience Have users worked with a similar application (for example, word processing, airline reservation, and so on)? Are they familiar with the basic application terms? Or does little or no application experience exist
  • 17. Task Experience Are users experienced with the task being automated? If it is an insurance claim system, do users have experience with paying claims? If it is a banking system, do users have experience in similar banking applications? Or do users possess little or no knowledge of the tasks the system will be performing? Other System Use Will the user be using other systems while using the new system? If so, they will bring certain habits and expectancies to the new system. The more compatibility between systems, the lower the learning requirements for the new system and the higher the productivity using all systems. Typing Skill Is the user a competent typist or of the hunt-and-peck variety? Is he or she familiar with the standard keyboard layout or other newer layouts? A competent typist may prefer to interact with the system exclusively through the keyboard, whereas the unskilled typist may prefer the mouse.
  • 18. 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. There are many techniques for capturing information for determining requirements. Keil and Carmel (1995), Popowicz (1995), and Fuccella et al. (1999) described many of the methods summarized in Table 2.1 and discussed shortly. They have also provided insights into their advantages and disadvantages. The techniques listed are classified as direct and indirect. Direct methods consist of face-to- face meetings with, or actual viewing of, users to solicit requirements. Indirect methods impose an intermediary, someone or something, between the users and the developers Direct Methods 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.
  • 19. A one-on-one visit is held with the user. It may be structured or more open-ended. The interview must have focus and topics to be covered must be carefully planned so data is collected in a common framework, and to ensure that all important aspects are thoroughly covered 1.The activities performed in completing a task or achieving a goal or objective. 2.The methods used to perform an activity. 3.What interactions exist with other people or systems. 4.It is also very useful to also uncover any: 5.Potential measures of system usability 6.Unmentioned exceptions to standard policies or procedures. 7.Relevant knowledge the user must possess to perform the activity. 8.If designing a Web site, the following kinds of interview questions 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 will derive a deeper understanding of your users, their experiences, attitudes, beliefs, and desires. Disadvantages of interviews are that they can be costly and time-consuming to conduct, and someone skilled in interviewing techniques should perform them.
  • 20. Telephone Interview or Survey This interview is conducted using the telephone. It must have structure and be well planned. 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. Telephone interviews have some disadvantages. 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. Traditional Focus Group A small group of users (8 to 12) and a moderator are brought together to discuss the requirements. While the discussion is loosely structured, the range of topics must be determined beforehand. A typical session lasts about two hours. 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. Focus groups are not usually useful for establishing how users really work or what kinds of usability problems they really have. Focus group discussion can be influenced by group dynamics, for good or bad.
  • 21. Observational Field Study To see and learn what users actually do, they are watched and followed in their own environment, office, or home, in a range of contexts for a period of time. Observation provides good insight into tasks being performed, the working environment and conditions,the social environment, and working practices. It is more objective, natural,and realistic. Observation, however, can be time-consuming and expensive Requirements Prototyping A demonstration model, or very early prototype, is presented to users for their comments concerning functionality. Prototypes are discussed more fully in Step 14, “Test, Test, and Retest Usability Laboratory Testing A special laboratory is constructed and users brought in to perform actual newly designed tasks. They are observed and results measured, and evaluated 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.
  • 22. User Group Improvements suggested by customer groups who convene periodically to discuss system and software usage are evaluated. User groups have the potential to provide a lot of good information, if organized properly Competitor Analysis Reviews of competitor’s products, or Web sites, can also be used to gather ideas, uncover design requirements, and identify tasks. The designers can perform this evaluation or, even better, users can be asked to perform the evaluation Trade Show Customers at a trade show can be exposed to a mock-up or prototype and asked for comments. This method is dependent on the knowledge level of the customers and may provide only a superficial view of most prominent features. System Testing New requirements and feedback stemming from ongoing system testing can be accumulated, evaluated, and implemented as necessary.
  • 23. 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.
  • 24. Understanding the User’s Mental Model The next phase in interface design is to thoroughly describe the expected system user or users and their current tasks. The former will be derived from the kinds of information collected in Step 1 “Understand the User or Client,” and the requirements analysis techniques described above. 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. 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.
  • 25. Guidelines for Designing Conceptual Models Reflect the user’s mental model, not the designer’s. A user will have different expectations and levels of knowledge than the designer. So, the mental models of the user and designer will be different. The user is concerned with the task to be performed, the business objectives that must be fulfilled. Draw physical analogies or present metaphors. Replicate what is familiar and well known. Duplicate actions that are already well learned. The success of graphical systems can be attributed, in part, to their employing the desktop metaphor. A metaphor, to be effective, must be widely applicable within an interface. Metaphors that are only partially or occasionally applicable should not be used. Comply with expectancies, habits, routines, and stereotypes. Create a system that builds on knowledge, habits, routines, and expectancies that already exist. Use familiar associations, avoiding the new and unfamiliar. With color, for example, accepted meanings for red, yellow, and green are already well established.
  • 26. Provide action-response compatibility. All system responses should be compatible with the actions that elicit them. Names of commands, for example, should reflect the actions that will occur. The organization of keys in documentation or help screens should reflect the ordering that actually exists on the keyboard. Make invisible parts of the system visible. Systems are composed of parts and processes, many of which are invisible to the user. In creating a mental model, a person must make a hypothesis about what is invisible and how it relates to what is visible. New users of a system often make erroneous or incomplete assumptions about what is invisible and develop a faulty mental model Avoid the unnecessary or irrelevant. Never display irrelevant information on the screen. People may try to interpret it and integrate it into their mental models, thereby creating a false one. Irrelevant information might be unneeded data fields, screen controls, system status codes, or error message numbers. If potentially misleading information cannot be avoided, point this out to the user.
  • 27. Provide design consistency. Design consistency reduces the number of concepts to be learned. Inconsistency requires the mastery of multiple models. If an occasional inconsistency cannot be avoided, explain it to the user. For example, if an error is caused by a user action that is inconsistent with other similar actions, explain in the error message that this condition exists. Provide documentation and a help system that will reinforce the conceptual model. Consistencies and metaphors should be explicitly described in the user documentation. This will assist a person in learning the system. Do not rely on the people to uncover consistencies and metaphors themselves.
  • 28. 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.
  • 29. System Training and Documentation 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. (Various types of training methods are more fully addressed in Step 9.) Training needs must be established and training components developed as the design process unfolds. This will ensure that the proper kinds of training are defined, properly integrated with the design, and developed correctly. Documentation System documentation is a reference point, a form of communication, and a more concrete design—words that can be seen and understood. It will also be based on user needs, system conceptual design, and system performance goals. Creating documentation during the development progress will uncover issues and reveal omissions that might not otherwise be detected until later in the design process.
  • 30. Human Considerations in Screen Design Use of a screen, and a system, is affected by many factors. These include: how much information is presented on a screen, how a screen is organized, the language used on the screen, the distinctiveness of the screen’s components, its aesthetics, and a screen’s consistency with other screens. First, let’s look at what aspects of poor screen design can be distracting to the user, what a user is looking for in good design, and the kinds of things screen users do interacting with a system or Web site. Then, we’ll address the principles of good design. How to Distract the Screen User These factors certainly apply to electronic forms and screens as well, and include: Unclear captions and badly worded questions. These cause hesitation, and rereading, in order to determine what is needed or must be provided. They may also be interpreted incorrectly, causing errors. Improper type and graphic emphasis. Important elements are hidden.
  • 31. What Screen Users Do 1. Identifies a task to be performed or need to be fulfilled. The task may be very structured, including activities such as: enter this data from this form into the system, answer a specific question regarding the status of an order, or collect the necessary information from a customer to make a reservation. 2. Decides how the task will be completed or the need fulfilled. For a structured or semi-structured task a set of transaction screens will be available. The proper transaction is identified and the relevant screen series retrieved. To satisfy a general or vague need will require browsing or searching through screens that might possibly have relevance. 3. Manipulates the computer’s controls. To perform the task or satisfy the need,the keyboard, mouse, and other similar devices are used to select choices from lists, choose commands to be performed, key data into text boxes, and so forth.
  • 32. 4. Gathers the necessary data. Using structured and semi-structured transaction screens information is collected from its source: a form, a coworker, or a customer. This information is identified on the screen, or placed on the screen, through control manipulation. To satisfy a general or vague need may require following Web site links down many paths 5. Forms judgments resulting in decisions relevant to the task or need. Structured transactions will require minimal decision-making. Has all the data been collected and is the data valid? Has the transaction been successfully accepted by the system? If not accepted, why not? Semi-structured transactions, in addition, may require decisions such as: Which set of screens, from all available, should I use to complete this process? How much information is needed to complete the sale of this particular product, make a reservation in this hotel, or complete the enrollment process for a specific program?
  • 33. Misleading headings. These also create confusion and inhibit one’s ability to see existing relationships. Information requests perceived to be irrelevant or unnecessary. The value of what one is doing is questioned, as is the value of the system. Information requests that require one to backtrack and rethink a previous answer, or look ahead to determine possible context. Inefficiency results, and mistakes increase. Poor quality of presentation, legibility, appearance, and arrangement. Again, thi degrades performance, slowing the user down and causing more errors.
  • 34. What Screen Users Want What are people looking for in the design of screens? One organization asked a group of screen users and got the following responses: An orderly, clean, clutter-free appearance. An obvious indication of what is being shown and what should be done with it. Expected information located where it should be. A clear indication of what relates to what, including options, headings, captions, data, and so forth. Plain, simple English. A simple way of finding out what is in a system and how to get it out. A clear indication of when an action can make a permanent change in the data or system. The desired direction is toward simplicity, clarity, and understandability—qualities lacking in many of today’s screens
  • 35. The Test for a Good Design People look at a screen for a particular reason, perhaps to locate a piece of information such as a customer name, to identify the name of the screen, or to find an instructional or error message. The signal at that moment is that element of interest on the screen. The noise is everything else on the screen. Cues independent of context that differentiate the components of the screen will reduce visual search times and minimize confusion. Imagine finding the headline on the front page of the newspaper if the same type size and style were used for all components and their positions changed from day to day. If this is true of a screen, screen scanning will be a lengthy and cumbersome process, and the screen will not be appealing to use. Unfortunately, many of today’s screens cannot pass this simple test and are unnecessarily difficult to use. Almost all the tools available to the creator of the newspaper’s front page are now available to the screen designer. Technology has added some additional weapons. An effective solution can be achieved. It simply involves the thoughtful use of display techniques, consistent location of elements, the proper use of “white space” and groupings, and an understanding of what makes visually pleasing composition. The best interfaces make everything on the screen obvious.
  • 36. Organizing Screen Elements Clearly and Meaningfully Visual clarity is achieved when the display elements are organized and presented in meaningful and understandable ways. A clear and clean organization makes it easier to recognize screen’s essential elements and to ignore its secondary information when appropriate. Clarity is influenced by a multitude of factors: consistency in design, a visually pleasing composition, a logical and sequential ordering, the presentation of the proper amount of information, groupings, and alignment of screen items. Consistency Provide real-world consistency. Reflect a person’s experiences, expectations, work conventions, and cultural conventions. Provide internal consistency. Observe the same conventions and rules for all aspects of an interface screen, and all application or Web site screens, including: — Operational and navigational procedures. — Visual identity or theme. — Component. • Organization. • Presentation. • Usage. • Locations.
  • 37. Ordering of Screen Data and Content Divide information into units that are logical, meaningful, and sensible. ■ Organize by the degree interrelationship between data or information. ■ Provide an ordering of screen units of information and elements that is prioritized according to the user’s expectations and needs. ■ Possible ordering schemes include: — Conventional. — Sequence of use. — Frequency of use. — Function. — Importance. — General to specific. ■ Form groups that cover all possibilities. Upper-Left Starting Point Eyeball fixation studies indicate that in looking at displays of information, usually one’s eyes move first to the upper-left center of the display, and then quickly move through the display in a clockwise direction. Streveler and Wasserman (1984) found that visual targets located in the upper-left quadrant of a screen were found fastest and those located in the lower- right quadrant took longest to find.
  • 38. Screen Navigation and Flow Provide an ordering of screen information and elements that: — Is rhythmic, guiding a person’s eye through the display. — Encourages natural movement sequences. — Minimizes pointer and eye movement distances. ■ Locate the most important and most frequently used elements or controls at the top left. ■ Maintain a top-to-bottom, left-to-right flow. ■ Assist in navigation through a screen by: — Aligning elements. — Grouping elements. — Using of line borders. ■ Through focus and emphasis, sequentially, direct attention to items that are: 1. Critical. 2. Important. 3. Secondary. 4. Peripheral.
  • 39. Visually Pleasing Composition 1.Balance The design elements have an equal weight, left to right, top to bottom. The opposite of balance is instability; the design elements seemingly ready to topple over. 2.Symmetry A unit on one side of the centerline is exactly replicated on the other side. This exact replication creates formal balance, but the difference is that balance can be achieved without symmetry. 3.Regularity Regularity in screen design is achieved by establishing standard and consistently spaced column and row starting points for screen elements. It is also achieved by using elements similar in size, shape, color, and spacing. The opposite of regularity, irregularity, exists when no such plan or principle is apparent.
  • 40. 4.Predictability Viewing one screen enables one to predict how another will look. Viewing part of a screen enables one to predict how the rest of the screen will look. The opposite of predictability—spontaneity—suggests no plan and thus an inability to predict the structure of the remainder of a screen or the structure of other screens 5.Unity With unity, the elements seem to belong together, to dovetail so completely that they are seen as one thing. The opposite of unity is fragmentation, each piece retaining its own character. In screen design similar sizes, shapes, and colors promote unity, as does white space—borders at the display boundary 6.Simplicity (Complexity) The scale created may also be considered a scale of complexity, with extreme complexity at one end and minimal complexity (simplicity) at the other. While the graphics designer usually considers this concept as simplicity, we will address it as complexity since it has been addressed by this term in the screen design literature, where an objective measure of it has been derived.