Web Metrics | Search Marketing
Site Strategy

"In a nutshell, Jason created our marketing analytics capability. He was able to figure out what data we collect, where it is, what was missing, and hook it all up so we canget meaningful, actionable data. Our marketing efforts have improved leads and conversions in some cases by an order of magnitude. He knows his stuff."
Chris Foleen, Marketing Project Coordinator, TransCore, Inc.

Read More >>

Tuesday, October 07, 2008

Information Dashboard Design Part 2

Chapters 4 and 5 of Steven Few's book deal with the research on how people percieve information, how memory works, and how that can be used by information designers to most effectively show the data. I was hoping to chunk the book up into, say, 3 pieces, but because there is so much information in these chapters, I want to deal with them as their own post. Here are my notes on chapters 4 and 5 of Information Dashboard Design.

Chapter 4


2 greatest challenges:

  1. Make the most important information stand out.
  2. Arrange everything so it makes sense and gives meaning.

Three stages of memory:

  1. iconic = visual based. "preattentive processing".
  2. short term = temporary, partially visual, limited capacity
  3. long term

"Preattentive processing" is things that we don't think about, we just recognize immediately. Categories are color, form, spatial position, motion.


Short term memory can hold 3 to 9 chunks of information at a time. Because of this, dashboards should seek "optimal chunking" of information. Chunks are "big visual gulps". Short term memory is out of sight = out of mind. Because of this, limit fragmenting data on multiple screens or scrolling.


How to use these concepts in dashboard design:


Note: the brain can only recognize 5 distinct expressions of any item (except length and 2D location).


Based on iconic memory, these are the things to work with for maximum absorption in a minimum of time. These can be used to highlight or group information. Use sparingly for maximum effect:

  • Color: Hue and intensity. Max of 9 hues can be understood at once by short term memory.
  • Position: 2D location
  • Form: orientation (italics/tilted), length, width (line weight), size, shape. added marks (simple icons like astricks), enclosure
  • Motion: flicker.

Use size to show ranking or importance.


Use shapes to differentiate data sets.


Use width for highlighting, like bolding.


Use enclosure to group information.
Gestalt Principles of Visual Perception


How we group visual information.

  1. Proximity. Group based on location can be used to direct eye movement by organizing (i.e. rows or columns).
  2. Similarity. Things that look the same. Can be used to draw connections between info in different groups.
  3. Enclosure. any type of visual border will cause that info to be perceived as connected.
  4. Closure. People will always try to connect loose ends or close open objects. This allows people to understand distinct regions even if borders are not completely defined (x and y axis as opposed to full borders). Allows for less non-data ink.
  5. Continuity. Things that are alligned are understood as part of the same group--i.e. indentation, number columns, etc.
  6. Connection. Things that are visually connected are understood as part of the same group. Only enclosure is a stronger grouping mechanism.


Chapter 5


The guiding principle of dashboard design is simplicity.


"The fundamental challenge of dashboard design is to effectively display a great deal of often disparate data in a small amount of space." (p.97)


Include only absolutely necessary info and display in easy to understand ways.


Necessary means an overview that can be quickly understood but doesn't give all the in depth info.


Quickly understood means the dashboard makes you aware of problems for further investigation.


Summaries & Exceptions. Summaries are usually sums and averages. Exceptions are unusual data that leads to problems and opportunities.


Customizable--communicate in the audience's vocabulary and the right granularity.


Group info into two types (creates multi-focal displays):

1. Info that is always important (static emphasis).

2. Info that is only important now (dynamic emphasis).


Visual emphasis:

  1. Top left and center = most important.
  2. Bottom right = least important.

Two principles of choosing media (chart types):

  1. Best display of the data.
  2. Must still make sense when shrunk down.

Aesthetics of Charts:

  1. Remove extra lines, images, decorations, gradients, dimensions.
  2. Standardize what is left and de-emphasize.
  3. Navigation and instructions go way to the side (out of the way).

No comments:

Post a Comment