Making Information Usable: The Art & Science of Information Design

Making Information Usable: The Art & Science of Information DesignNathan Denton & Jeff Hirner

Innovation as a Convergence Point Opportunity

Technology

DataPeople

Innovation opportunity around services marketing, business develop &

practice management

“Visualizing information is a form

of knowledge compression. It's a

way of squeezing an enormous amount of

information into a small space.”

- David McCandless

“The biggest value is achieved when you deliver the most valuable, actionable and trusted information to the right audience in a format that supports the decision making process”

- Angel Garcia

Delivery of Valuable Information

Data Collection

Data Processing

Information Generation

Knowledge Application

Data is entered or collected…

then cleaned, classified, related to

other data…

to create, organize, integrate, and

deliver information…

that ultimately is applied to inform

decisions.

The best “information value chain” adds the best value at the lowest cost along each “link”

Delivery of Actionable Information

Delivery of Trusted Information

Data Overload

“Art, in itself, is an attempt to bring order out of chaos.”- Stephen Sondheim

What is a good presentation?

• Finding the right presentation to uncover patterns, connections, relations that allow us to focus on the information that matters most so we can act on it.

• 3 Key Rules in delivering data– 1) Keep the visuals clear– 2) Keep the visuals consistent– 3) Make the visuals meaningful; space is a precious commodity

The Design Trends

Iconography

Iconography

Icons are a great way to quickly identify and group content in a way that adds visual interest to the page. It can also bridge the language gap.

5 Principles of Effective Icon Design

1. Approach icon design holistically

2. Consider your audience

3. Design for the size the icon will be used at

4. Keep icons simple

5. Create consistent icon set styles

Color

Colors

Ways that colors can help enhance content

• Grouping content and ideas

• Reinforcing interactivity

• Drawing attention

• Supporting brand

• Affect feeling and emotion

Info Graphics

Information Graphics

Presenting complex data quickly, cleanly, and efficiently.

Information graphics can help visually communicate:

• Data

• Relationships

• Processes

• Events

“Don’t just show the notes, play

the music!”- Hans Rosling

Source: Gapminder.com

“The commonality between science and art is in trying to see

profoundly - to develop strategies of seeing and showing.”

- Edward Tufte

“Visualizing information is a form

of knowledge compression. It's a

way of squeezing an enormous amount of

information into a small space.”

- David McCandless

StreamliningContent

Streamlining Content

• Show what is most important

• Reinforce importance with visual hierarchy

• Reinforce interactivity intuitively

• Consider the audience

ResponsiveDesign

Responsive Design

Responsive design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform, and orientation.

- Flexible grids

- Flexible layouts

- Flexible images

- Intelligent use of CSS media queries

Responsive Design

- Many users don’t maximize their web browsers (49.6%)- Roger Johansson poll: Windows 65%, Mac 20%

- Over 400 varying devices sold between 2005 and 2008

- Impossible to predict the future