Edward Tufte and Information Design for the Web3. “ The fundamental task of the
information architect is to
make the information
understandable.
The goal is to clarify.
Richard Saul Wurman Digerati
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
5. “ Insights into graphical
design are to be gained, I
believe, from theories of
what makes for excellence in
art, architecture, and prose.
The Visual Display of Quantitative Information
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
8. Tufte’s Information Design Principles
1 Graphics reveal data
2 To clarify, add detail
3 Small multiples invite comparisons
4 “Smallest effective difference”
5 Above all else, show the data
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
13. “ Often the most effective way
to describe, explore, and
summarize a set of
numbers... is to look at
pictures of those numbers.
Visual Display of Quantitative Information
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
18. “ Every bit of ink on a graphic
requires a reason. And
nearly always that reason
should be that the ink
presents new information.
Visual Display of Quantitative Information 96
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
26. “ Information-sensitive designs
are exacting and laborious,
requiring a deep appreciation
of the particular content
at hand.
Visual Explanations 148
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
29. “ Multiple images reveal
repetition and change,
pattern and surprise—the
defining elements in the idea
of information.
Visual Explanations 105
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
36. “ Now what can be eliminated?
Frank Lloyd Wright
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
37. Principle 5
Above all else,
show the data
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
47. “ It is all right to decorate
construction, but never
construct decoration.
Robert Venturi Learning from Las Vegas
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
48. Tufte’s Information Design Principles
1 Graphics reveal data
2 To clarify, add detail
3 Small multiples invite comparisons
4 “Smallest effective difference”
5 Above all else, show the data
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
49. Application to Web Design
1 Design reveals content
2 To clarify, add detail
3 Design from the inside, out
4 Smallest effective difference
5 Above all else, show the content
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
50. “ Design is largely an exercise
in creating or suggesting
contrasts ... in an effort to
convey meaning.
Andy Rutledge A List Apart
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
55. “ Information consists of
differences that make
a difference.
Envisioning Information 65
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
58. 1 List your bits
2 Figure out which bits relate
3 Assign priorities
4 Design each bit
5 Assemble bits
37Signals An Introduction to Using Patterns in Web Design
67. Application 3
Employ the smallest
effective difference
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
73. “ I’ve never liked the adage Less
is more... I say Less is better,
which is neither cute nor
clever, but almost always true.
John Gruber Independent Days
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
80. “ Copywriting is interface
design. Great interfaces are
written. ... Good writing is
good design.
37Signals Getting Real
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
81. Application 5
Above all else,
show the content
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
88. “ In an architecture of content,
the information becomes the
interface.
Visual Explanations 146
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
93. “ Aesthetics matter: attractive
things work better.
Donald Norman Interactions Magazine
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
94. Applications to Web Design
1 Design reveals content
2 To clarify, add detail
3 Design from the inside, out
4 Smallest effective difference
5 Above all else, show the content
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
95. “ ‘Make it look good!’ That’s
not what we think design is.
It’s not just what it looks and
feels like. Design is
how it works.
Steve Jobs NYTimes Magazine
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
96. Thank you
This has been
a Sprocket House
production.
© 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC