0% found this document useful (0 votes)
38 views16 pages

Updating PB Apps WP

This document summarizes 18 principles of graphical user interface design: 1) Provide an aesthetically pleasing interface with meaningful contrast, groupings, alignment and use of color. 2) Ensure the interface is clear visually, conceptually and linguistically. 3) Provide compatibility with the user, task, product and adopt the user's perspective. 4) Make the system easily understood and learned with clear instructions.

Uploaded by

Marvi Carranza
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
38 views16 pages

Updating PB Apps WP

This document summarizes 18 principles of graphical user interface design: 1) Provide an aesthetically pleasing interface with meaningful contrast, groupings, alignment and use of color. 2) Ensure the interface is clear visually, conceptually and linguistically. 3) Provide compatibility with the user, task, product and adopt the user's perspective. 4) Make the system easily understood and learned with clear instructions.

Uploaded by

Marvi Carranza
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 16

Wikibooks

GUI Design
Principles

This page was transwikied from another project


and needs to be adopted.
This page needs to be moved to the main
namespace, either as the main page of a book, or
as a chapter of another book. After moving, please
remove {{Tw-adopt}} from this page. Learn more

Generally accepted principles for Graphical


user interface design are:
1. 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 colors and graphics effectively and
simply.

2. Clarity The interface should be visually,


conceptually and linguistically clear,
including
Visual elements
Functions
Metaphors
Words and text

3. Compatibility Provide compatibility with


the following:

The user
The task and job
The product
Adopt the user’s perspective

4. Comprehensibility A system should be


easily understood and learned. A user
should know the following
What to do
What to look at
When to do it
Where to do it
Why to do it
How to do it
The flow of actions, responses, visual
preparations and information should be
in a sensible order that is easy to
recollect and place in context.

5. Configurability Permit easy


personalization, configuration and
reconfiguration of settings.

Enhances a sense of control


Encourages an active role in
understanding

6. Consistency A system should look, act,


and operate the same throughput. Similar
components should:

Have a similar look


Have similar uses.
Operate similarly
The same action should always yield the
same result.
The function of the elements should not
change
The position of standard elements
should not change.
7. 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. Directness Provide direct ways to


accomplish tasks

Available alternatives should be visible,


The effect of actions on objects should
be visible.

9. 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.

10. 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.

11. Flexibility A system must be flexible to


the different 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

12. Forgiveness
Tolerate and forgive common and
unavoidable human errors
Prevent errors from occurring whenever
possible.
Protect against possible catastrophic
errors.
When an error does occur, provide
constructive messages.

13. Predictability The user’s should be


able to anticipate the natural progression
of the 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.

14. 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


H/W, S/W or communication problems.
15. Responsiveness The system must
rapidly respond to the user’s requests.

Provide immediate acknowledgement


for all user actions
Visual
Textual
Auditory

16. Simplicity

Provide as simple an interface as


possible
Provide defaults
Minimize screen alignment points.
Make common actions simple at the
expense of uncommon actions being
made harder.
Provide uniformity and consistency

Five ways to provide simplicity:

Present common and necessary


functions first.
Prominently feature important functions,
Hide more sophisticated and less
frequently used functions

17. 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.

18. 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

Further reading
Verplank, W.L. (1985). "Graphics in
Human-Computer Communication:
Principles of Graphical User-Interface
Design". in Peterson H.E. and Schneider
W.. Proceedings of the IFIP-IMIA Second
Stockholm Conference on
Communication in Health Care,
Stockholm, Sweden. pp. 113–130.
Aaron Marcus (1995). "Principles of
effective visual communication for
graphical user interface design". Human-
computer interaction: toward the year
2000. San Francisco: Morgan Kaufmann
Publishers Inc.. pp. 425–441. ISBN 1-
55860-246-1.

Retrieved from
"https://en.wikibooks.org/w/index.php?
title=GUI_Design_Principles&oldid=3474345"

Last edited 4 months ago by an ano…

Content is available under CC BY-SA 3.0 unless


otherwise noted.

You might also like