Interface Design
Tufteism
What is Tufteism?

The study of the philosophies of
Edward Tufte.
Who is Edward Tufte?


Professor of statistical
evidence and information
design at Yale University
Teaches:




statistical evidence
information design
interface design
Known primarily for his selfpublished books on
information design, which
have received more than 40
awards for content and
design.
Tufte Books


Published in 1983
The classic book on statistical
graphics, charts, tables.
Theory and practice in the
design of data graphics, with
detailed analysis of how to
display data for precise,
effective, quick analysis.
Design of the high-resolution
displays, small multiples.
Editing and improving
graphics
Tufte Books


Published in 1990
This book celebrates
escapes from the
flatlands of both paper
and computer screen,
showing superb displays
of high-dimensional
complex data. The most
design-oriented of
Edward Tufte's books.
Tufte Books


Published in 1997
Visual Explanations: Images and
Quantities, Evidence and Narrative is
about pictures of verbs, the
representation of mechanism and
motion, process and dynamics,
causes and effects, explanation and
narrative. Practical applications and
examples include statistical graphics,
charts for making important
decisions in engineering and
medicine, technical manuals,
diagrams, design of computer
interfaces and websites and on-line
manuals, animations and scientific
visualizations, techniques for talks,
and design strategies for enhancing
the rate of information transfer in
print, presentations, and computer
screens.
How does he relate to
interface design?
Interface designers organize
information and design a means to
present it.
 Tufte believes that the way we
choose to organize and present
information can have a dramatic
effect on how the reader/user
interprets it.

Presentation of Information has a
Dramatic Effect on How It is
Interpreted.




The Challenger
Shuttle explosion
of 1986.
Information
existed that should
have prevented
launch.
Lauch occurred.
Shuttle exploded.
Presentation of Information has a
Dramatic Effect on How It is
Interpreted.
Presentation of Information has a
Dramatic Effect on How It is
Interpreted.
Tufte Principles

Escaping Flatlands
High Information Resolution
 Small Multiples

Smallest Effective Difference
 1 + 1 =3
 Quantify Information

Escaping Flatland
All communication between a viewer
and an image occurs on a 2
dimensional surface.
 Most interesting data is multivariate
in nature.

How to Escape Flatlands

How to increase the number of
dimensions that can be reproduced
on flat surfaces?
High information resolution
 Use small multiples
 Compromise – what non-essential
information can you get rid of to
incorporate data from other
dimensions?

Escaping Flatland –
Information Resolution


Flat image –
High
Information
Resoultion
4+ Dimensions
of data:




Geographical
context of
landmarks
Altitute
Distance
Subway line
Escaping Flatland
- Information Resolution


Flat image – High
information resolution
4+ Dimestions of data



Era/costume
Music
Dance steps –
• Movements
• direction

Timing
Escaping Flatland – Small
Multiples

Repetition of data elements allows the
viewer’s eye to move from one image
to the next, and focus on changes in
information.
Small Multiples
Escaping Flatland – Small
Multiples



Eye detects
pattern of
unbroken runs.
This catches the
viewer’s attention.
Clear than verbal
communication of
same information.
Smallest Effective
Difference


White band is
dominant visual
statement.
Visual war
between
information and
band that
highlights it.
1 + 1 =3

Intentional use of
1 + 1 =3
Smallest Effective
Difference & 1 + 1=3


Make all visual
distinctions as
subtle as
possible, but
still clear and
effective
1 + 1 =3
Quantify Information

If information is given no context - I.e.
we have nothing to compare it to, it is
meaningless.
Quantify Information
Quantify Information
• information is
quantified
• high information
resolution
• small multiples
• smallest effective
difference
Quantify Information



Smallest
Effective
Difference?
Information
is not
quantified.
Color usage
– nonnatural
colors.
Quantify Information



Smallest
Effective
Difference
1+1=3
Color usage
Interface Design


90% of image
= substance.
Scope of
information
available from
first panel.
Interface Design


High
information
resolution.
Integration of
map and reallive.






See foot in
image
You are put
into map.
Your path is
shown in 3-D.
Color =
smallest
effective
difference.
Written
directions.
Top bar
consistent
Tufte’s Principles of
Displaying Information
Show visual comparisons
 Show causality
 Show multivariable data
 Completely integrate word and
image
 Do no harm to your content: quality,
relevance, integrity
