Web GUI Interface Design

By

Michelle Yeung

GUI Interface Design is deals with the ease which the users can complete their task.

Through consistent interface, users can use the tools more effectively on any platform, operating system, or browser.

Intuitive interface with design cues allow faster usage and lower learning curve.

A good design allows the maximum amount of users at any level to understand the interface.

Users can understand feedback and suggestion provided by the interface to help their work.

CoNsiStEnt Interface

Through consistent interface, users can usethe tools more effectively on any platform, operating system, or browser.

This is an example of an inconsistent interface. It has difficult to read font sizes and colors that are not representative of their function.

Intuitive Design

Intuitive interface with design cues allow faster usage and lower learning curve.

Good Design

A good design allows the maximum amount of users at any level to understand the interface.

Helpful Feedback

Users can understand feedback and suggestion provided by the interface to help their work.

Through the users, employers increase productivity.

Users who understand the interface complete more work faster, and with consistency.

When a design is good, frustration is lower and users can work with each other without the interface interfering.

Users are as diverse as the work force – there should be no advantage to any group based on job function, demographics, computer skill, business skill, or physical characteristics.

Efficiency thanks to graphics

Users who understand the interface complete more work faster, and with consistency. Graphical cues help.

Example of an intuitive graphical interface, with needed tools available. It is reminiscent of computer folder structure.

Efficiency due to Interface

Example of a confusing interface. While the tools are also readily available, numbers before each title is supposed to represent placement of the page. The previous design was graphical and a user did not need prior knowledge of this numbering scheme.

When a design is good, frustration is lower and users can work with each other without the interface interfering.

Globally understood navigation

Users are as diverse as the work force – there should be no advantage to any group based on job function, demographics, computer skill, business skill, or physical characteristics.

Proper GUI Interface Design takes into account that all levels of users exist.

Because the web is used throughout many parts of the world, cues for usage are not based on culture or a specific area – they are based on research on how humans learn.

Design includes visual cues such as placement of commands, readability, color, and speed of use.

Humans Scan Objects Side-to-side

Because the web is used throughout many parts of the world, cues for usage are not based on culture or a specific area – they are based on research on how humans learn.

Visual cues help the user

Design includes visual cues such as placement of commands, readability, color, and speed of use.

What else is involved in Web GUI Interface Design?

Tools should be as standard as possible so a user will be familiar with related programs and platforms.

Beginning users must be able to use the interface, while advanced users should not be hindered by the interface.

Text must be readable for the average user and adjustable for those with other preferences.

BibliographyImplementing Visual Design PatternsBy James Hobarthttp://www.classicsys.comAugust 2002

What Kind of Users Use Your GUI?By Aviva Rosenstein, Ph.D.http://www.classicsys.comMay 2001

Clip art from Computoons.com, and Adobe.com

Screenshots from cnn.com, petflytrap.com, and lmu.edu

Principles of Good GUI DesignBy James Hobarthttp://www.classicsys.comOctober 1995

Five Mistakes to Avoid When Implementing a Thin-Client GUI StrategyBy James Hobarthttp://www.classicsys.comMay 2000

Other screenshots from webpages created by Michelle Yeung