Following are some basic considerations for designing graphical user interfaces (GUIs). The one principle that underpins all these suggestions is the need to actively involve the user. Prototyping GUIs and obtaining user feedback as part of the analysis process is critical. Having several iterations early in development will determine what designs will work well and which will cause user confusion. Early designs can be done with fourth generation language packages or even with paper. The idea is to be able to quickly generate several different prototypes. Try to apply Fudd's first law of creativity, which is "To get a good idea, get lots of ideas." And in this case, also get lots of feedback.

Color

Color is an important consideration in designing GUIs, yet one that is easy to overlook. It is often viewed as merely window dressing at the end of the design phase or as an opportunity for the designer to show off all their graphics tricks. Color is, however, always a communication tool. Take care so that what you express is what you intended to communicate.

Backgrounds should be white or light colored. Having massive areas of bright, dark colors may cause the user distress. For instance, the color red psychologically denotes danger or quick action. Text should have a high contrast with its background.

Poor use of color	Better use of color

Color should be used in a consistent way throughout an application's GUIs. Related objects should have the same color scheme to help organize them in the user's mind. Once a color scheme has been established, using that scheme consistently gives the user additional information about the purpose of that object.

Use color economically. Generally only use five plus or minus two colors per application. Those colors should be selected from the basic 16 color palette. Some of the more exotic custom colors may not look the same across all video drivers and at all resolutions.

Make sure you use color to draw attention to the area you want the user to focus on. For that reason, avoid using bright red or green colors in the periphery of the field. If you want the user directed to one area on the display, make sure you do not give another area the same color importance.

Be aware whether your design will always be displayed on color monitors. If the possibility exists that it will sometimes be used on monochrome monitors, be sure to test the design under those display situations.

Layout

Layout is another area that can provide additional non-textual information to the user. A good layout can help the user understand the uses of objects on the display and help navigate throughout the program. Layout is a design element that especially lends itself to paper prototyping.

Grouping by function is a principle of good layout. Location and shape are good means of relating objects to each other. On a button bar, grouping together the icons related to file management helps clarify their meanings and helps with user navigation.

Lotus 123 button bar is a good example of grouping by function. The buttons can also be customized.

Consider using a grid for layout design. Limiting the display to seven plus or minus two major vertical and horizontal divisions generally will make the screen less cluttered and easier to understand. Make sure to use white space to enhance readability and further reduce clutter.

Trying to cram too much onto one screen can cause confusion. It is better to keep a screen simple and move to another screen for additional functions.

Find out what display items are useful to the user. Adding lots of bells and whistles that the user does not want or need only adds to clutter.

---

Typography

As with other elements, type faces and type styles should be used in a consistent way throughout the application. Type faces and point sizes should be kept to a minimum. Use different colored type, bold type, italicized text, and underlined text, for emphasis only where needed. Chose fonts for legibility. Blinking text can draw user attention, but is difficult to read. It is also a distraction if user attention needs to move to another part of the display.

---

Other Considerations

Be consistent not only within your application, but attempt to use the same conventions that other applications use. This is not the place to be inventive. Even if you devise a better method, if it conflicts with standard conventions, you will only confuse your users.

If practical, give the users the ability to customize their display elements. This might consist of letting users select the toolbar bar buttons for functions they use most or allowing them to select the location of buttons or icons.

Do not rely solely on a mouse for navigation. If the mouse fails and you do not provide alternate keyboard controls, your users may be stuck.

The Analysis and Prototyping of Effective Graphical User Interfaces

What Is Prototyping?

Relevant Cases

References

URL: http://www.umsl.edu/~sauter/analysis/prototyping/intro.html
Project Team Members: C. Melissa Mcclendon, Larry Regot, Gerri Akers