7 Dos and Don'ts in Getting Started in User Centered Design

This week’s Pixel8 episode continues the series of user experience fundamentals with Dr. Tobias Komischke Director of User Experience at Infragistics. Tobias shares seven user-centered design concepts and the associated “dos” and “don’ts” with each point.

1: Orientation

Do

  • Try to answer the three fundamental questions for every screen:
    • Where am I?
    • Where have I come from?
    • What's next?
  • Employ UI patterns (often implemented by controls) to answer these questions
    • Bread crumb and outlook bars do an excellent job of orienting a user

Don’t

  • Provide a blank context for a screen

2: Visual Attention

Do

  • Group items that go together
  • Make important elements stick out using size and color
  • Use relative white space as a way to draw attention

Don’t

  • Give all visual elements the same “weight” in size and color
  • Use motion or animation unless you have a good reason to do so

3: Visual Structure and Flow

Do

  • Think about how people consume visual information (often top to bottom and left to right)
  • Provide visual clues to guide users what to look at first, next and so on
  • Place controls that finalize actions at the end of the flow
  • Pay attention to consistent alignment
  • Try to adhere to established conventions

Don’t

  • Add components to a screen simply because there is space to fill
  • Place submit buttons at the top of a form  - we’re looking at you, SharePoint :)
  • Require users add in un-necessary data

4: Scrolling & Paging

Do

  • Employ paging when data is 3x or more larger than the available view area
  • Give ways for users to jump to specific pages when dealing with a lot of data

Don’t

  • Scroll horizontally unless you absolutely must
  • Scroll endlessly

5: Text

Do

  • Vary font sizes to bring attention to important text
  • Choose font sizes that people can read

Don’t

  • Select text colors that are hard to read
  • Use text when it obstructs the meaning or a function of an operation – consider using an icon

6: Icons

Do

  • Use icons to save screen real estate
  • Provide a legend to explain meaning of icons
  • Define tool tips to give context and meaning to icons

Don’t

  • Use icons to represent complicated concepts
  • Use icons inconsistently throughout the application

7: Graphs

Do

  • Bar charts when possible
    • Research indicates bar charts are easiest to interpret as the X axis doesn’t convey meaning relative to the value
  • Label chart scales
  • Use appropriate scale values

Don’t

  • Rely solely on ability of the user to interpret volumes
    • For example, 3D pie charts may prove difficult to understand as volumes are difficult for users to rate

Reference Books

In the interview Tobias mentions a number of books that you may find useful when building data visualization screens:

No Comments