Mable Kinzie Return to Mable's Home Page  
  Design Guidelines  

  User Interface Design Guidelines

For Web Site Design (but adaptable to any interface)

  
  A variety of people/resources have influenced my thinking on these. Jump down the page for my references

  Contents
  
 
  1. Intended audience, purpose, advantages of use are indicated.
  2. Tag line describes value of site to user; distinguishes organization from competitors.
  3. Each page indicates site ID, logo, page name, major sections, options at current level.
  4. Home page spells out "big picture: what it is, what it contains, what users can do, why users should be there.
  5. Sponsoring institution is indiciated, its philosophy described, and credibility established. The funding agency is identified.
  6. Samples provided before users must register.
  7. Each page is self-evident, or at least self-explanatory.
  8. All information presented is important. Importance is evident to user.
  9. Page is designed to be scanned rather than read. Limit text whenever possible.
  10. Plain language is used throughout.
  11. Meaningful content is provided within three seconds of page download.
  12. Entire page loads within six seconds-"six second rule."
  13. Policy for treatment of user's personal information is specified.
  14. FAQs are provided for common problems.
  15. E-mail contact is provided for user support.

 

  Graphic Design
  
 
  1. Site is designed for the users' monitor size, download speeds, browser and plug-ins.
  2. Unique and consistent look and feel are evident throughout
  3. Page download time is minimized through use of modest graphical elements.
  4. Visual noise and clutter are avoided.
  5. Visual hierarchy matches content hierarchy.
  6. Adequate contrast provided between foreground and background, for color-impaired vision and printing.
  7. Limited number of fonts used; fonts used are those commonly installed.
  8. ALL CAPS and all italics are used sparingly; underlined text is reserved to denote links.

 
  Navigation
  
 
  1. Navigational controls and search function are standardized across the site, conform to established convention.
  2. Primary information and navigation controls are displayed at top left of page.
  3. Structure of site, and current location, are easy to ascertain from appearance of navigational controls.
  4. Flexible navigation options are provided (more than one path through the woods).
  5. Home page provides "short-cuts" to frequently needed features.
  6. Home page is available from all pages.
  7. Users can 'backward chain," to retrace their steps.
  8. Every page is "bookmark-able."
  9. The clicks to get to desired information and functions are painless (easy to understand what options to select).
  10. The number of clicks to get to desired functions is minimized.

 
  Functions
  
 
  1. Navigational controls and search function are standardized across the site, conform to established convention.
  2. Primary information and navigation controls are displayed at top left of page.
  3. Structure of site, and current location, are easy to ascertain from appearance of navigational controls.
  4. Flexible navigation options are provided (more than one path through the woods).
  5. Home page provides "short-cuts" to frequently needed features.
  6. Home page is available from all pages.
  7. Users can 'backward chain," to retrace their steps.
  8. Every page is "bookmark-able."
  9. The clicks to get to desired information and functions are painless (easy to understand what options to select).
  10. The number of clicks to get to desired functions is minimized.

 

 
References

  
 
  • Cooper, A., & Reimann, R. (2003). About Face 2.0: The Essentials of Interaction Design. Indianapolis, IN: Wiley

  • Gagne, R. (1985). The conditions of learning and theory of instruction. 4th ed. New York: Holt, Rinehart and Winston.

  • Gillespie, J. Web page design for designers. http://www.wpdfd.com/wpdhome.htm

  • Krug, S. (2000). Don't Make Me Think: A Common Sense Approach to Web Usability. Indianapolis, IN: New Riders

  • Lynch, P. & Horton, S. Yale style manual. 1997. http://info.med.yale.edu/caim/manual

  • Nielsen, J. (2000). Designing Web Usability: The Practice of Simplicity. Indianapolis, IN: New Riders.

  • Norman, D. (1988.) The psychology of everyday things. New York: Basic Books.

  • Weinman, L. (1997). Designing web graphics.2. 2nd Ed. Indianapolis (IN): New Riders; 1997.

  • The following current and former UVa graduate students also contributed significant thinking to this list: Julie Adams, Paul Cheney, Marti Julian, Mike Matera, Kathy Neeson, Kenneth Warren, and Steve Whitaker. Many thanks to each.
 

 
· Return to Instructional Design & Project Management·
· Go to Mable's home page ·