User Interface Design

Course code: CSI1005

Lecture 3

Prof. Vydianathan Ramaswami 1

Principles of User Interface Design

The interface itself should serve as both a connector and a separator: a connector in that it ties
the user to the power of the computer, and a separator in that it minimizes the possibility of the
participants damaging one another. We will begin with the first set of published principles, those
for the Xerox STAR.

2
Principles of User Interface Design
• Principles for the Xerox STAR
• The illusion of manipulable objects: Displayed objects that are selectable and manipulable must be
created. A design challenge is to invent a set of displayable objects that are represented meaningfully
and appropriately for the intended application. It must be clear that these objects can be selected,
• Visual order and viewer focus: Effective visual contrast between various components of the screen is
used to achieve this goal. Animation is also used to draw attention, as is sound. Feedback must also be
provided to the user.
• Revealed structure: The distance between one’s intention and the effect must be minimized. The
relationship between intention and effect must be tightened and made as apparent as possible to the
user.
• Consistency: Consistency aids learning. Consistency is provided in such areas as element location,
grammar, font shapes, styles, and sizes, selection indicators, and contrast and emphasis techniques.
• Appropriate effect or emotional impact: The interface must provide the appropriate emotional effect
for the product and its market. Is it a corporate, professional, and secure business system? Should it
reflect the fantasy, wizardry, and bad puns of computer games?
• A match with the medium: The interface must also reflect the capabilities of the device on which it will
be displayed. Quality of screen images will be greatly affected by a device’s resolution and color-
generation capabilities.
3
Principles of User Interface Design
General Principles
The design goals in creating a user interface are described below. They are fundamental to the
design and implementation of all effective interfaces, including GUI and Web ones. These
principles are general characteristics of the interface, and they apply to all aspects.
Aesthetically Pleasing
— Provide visual appeal by following these presentation and graphic design principles:
• Provide meaningful contrast between screen elements.
• Create groupings.
• Align screen elements and groups.
• Provide three-dimensional representation.
• Use color and graphics effectively and simply.
Clarity
— The interface should be visually, conceptually, and linguistically clear, including:
• Visual elements
• Functions
• Metaphors
• Words and text
4
Principles of User Interface Design
Compatibility
— Provide compatibility with the following:
• The user
• The task and job
• The product
— Adopt the user’s perspective.
Comprehensibility
— A system should be easily learned and understood. A user should know the following:
• What to look at
• What to do
• When to do it
• Where to do it
• Why to do it
• How to do it
— The flow of actions, responses, visual presentations, and information should be in a sensible
order that is easy to recollect and place in context. 5
Principles of User Interface Design
Configurability
— Permit easy personalization, configuration, and reconfiguration of settings.
• Enhances a sense of control.
• Encourages an active role in understanding.
Consistency
— A system should look, act, and operate the same throughout. Similar components should:
• Have a similar look.
• Have similar uses.
• Operate similarly.
— The same action should always yield the same result.
— The function of elements should not change.
— The position of standard elements should not change.

6
Principles of User Interface Design
Consistency
— In addition to increased learning requirements, inconsistency in design has a number of other
prerequisites and by-products, including:
— More specialization by system users.
— Greater demand for higher skills.
— More preparation time and less production time.
— More frequent changes in procedures.
— More error-tolerant systems (because errors are more likely).
— More kinds of documentation.
— More time to find information in documents.
— More unlearning and learning when systems are changed.
— More demands on supervisors and managers.
— More things to do wrong.

7
Principles of User Interface Design
Control
— The user must control the interaction.
• Actions should result from explicit user requests.
• Actions should be performed quickly.
• Actions should be capable of interruption or termination.
• The user should never be interrupted for errors.
— The context maintained must be from the perspective of the user.
— The means to achieve goals should be flexible and compatible with the user’s skills,
experiences, habits, and preferences.
— Avoid modes since they constrain the actions available to the user.
— Permit the user to customize aspects of the interface, while always providing a proper set of
defaults.

8
Principles of User Interface Design
Directness
— Provide direct ways to accomplish tasks.
• Available alternatives should be visible.
• The effect of actions on objects should be visible.
Efficiency
— Minimize eye and hand movements, and other control actions.
• Transitions between various system controls should flow easily and freely.
• Navigation paths should be as short as possible.
• Eye movement through a screen should be obvious and sequential.
— Anticipate the user’s wants and needs whenever possible.
Familiarity
— Employ familiar concepts and use a language that is familiar to the user.
— Keep the interface natural, mimicking the user’s behavior patterns.
— Use real-world metaphors.
9
Principles of User Interface Design
Flexibility
— A system must be sensitive to the differing needs of its users, enabling a level and type of
performance based upon:
• Each user’s knowledge and skills.
• Each user’s experience.
• Each user’s personal preference.
• Each user’s habits.
• The conditions at that moment.
Forgiveness
— Tolerate and forgive common and unavoidable human errors.
— Prevent errors from occurring whenever possible.
— Protect against possible catastrophic errors.

10
Principles of User Interface Design
Predictability
— The user should be able to anticipate the natural progression of each task.
• Provide distinct and recognizable screen elements.
• Provide cues to the result of an action to be performed.
— All expectations should be fulfilled uniformly and completely.
— When an error does occur, provide constructive messages.
Recovery
— A system should permit:
• Commands or actions to be abolished or reversed.
• Immediate return to a certain point if difficulties arise.
— Ensure that users never lose their work as a result of:
• An error on their part.
• Hardware, software, or communication problems.
Responsiveness
— The system must rapidly respond to the user’s requests.
— Provide immediate acknowledgment for all user actions:
• Visual.
• Textual.
• Auditory.
11
Principles of User Interface Design
Simplicity
— Provide as simple an interface as possible.
— Five ways to provide simplicity:
• Use progressive disclosure, hiding things until they are needed.
— Present common and necessary functions first.
— Prominently feature important functions.
— Hide more sophisticated and less frequently used functions.
• Provide defaults.
• Minimize screen alignment points.
• Make common actions simple at the expense of uncommon actions being made harder.
• Provide uniformity and consistency.
Transparency
— Permit the user to focus on the task or job, without concern for the mechanics of the interface.
• Workings and reminders of workings inside the computer should be invisible to the user.

12
Principles of User Interface Design
General Principles
Trade-Offs
— Final design will be based on a series of trade-offs balancing often conflicting design
principles.
— People’s requirements always take precedence over technical requirements.

13
Thank You!

14