Submit Search
Upload
Edward Tufte and Information Design for the Web
•
23 likes
•
22,067 views
S
sprocketeer
Follow
Reprise of my 2009 presentation for Refresh the Triangle
Read less
Read more
Design
Report
Share
Report
Share
1 of 96
Download now
Download to read offline
Recommended
Report on Beautiful Evidence by E. Tufte
Report on Beautiful Evidence by E. Tufte
hckingmtuedu
Tufte envisioning designing_data
Tufte envisioning designing_data
Hoàng Trần Hữu
Effective Data Visualization (David Giard)
Effective Data Visualization (David Giard)
ITCamp
Metrics Driven Design by Joshua Porter
Metrics Driven Design by Joshua Porter
Andrew Chen
MCJ Edward Tufte Notes
MCJ Edward Tufte Notes
McGarrah Jessee
Data visualization & Story Telling with Data
Data visualization & Story Telling with Data
Dr Nisha Arora
Metrics for product managers tpma-feb2020
Metrics for product managers tpma-feb2020
Saeed Khan
Storytelling with Data Visualization
Storytelling with Data Visualization
Kurtosys Systems
Recommended
Report on Beautiful Evidence by E. Tufte
Report on Beautiful Evidence by E. Tufte
hckingmtuedu
Tufte envisioning designing_data
Tufte envisioning designing_data
Hoàng Trần Hữu
Effective Data Visualization (David Giard)
Effective Data Visualization (David Giard)
ITCamp
Metrics Driven Design by Joshua Porter
Metrics Driven Design by Joshua Porter
Andrew Chen
MCJ Edward Tufte Notes
MCJ Edward Tufte Notes
McGarrah Jessee
Data visualization & Story Telling with Data
Data visualization & Story Telling with Data
Dr Nisha Arora
Metrics for product managers tpma-feb2020
Metrics for product managers tpma-feb2020
Saeed Khan
Storytelling with Data Visualization
Storytelling with Data Visualization
Kurtosys Systems
10 Principles of Design by Dieter Rams for Data Visualization
10 Principles of Design by Dieter Rams for Data Visualization
Mika Aldaba
Place in Space (AKA "How to Design A Concept Model")
Place in Space (AKA "How to Design A Concept Model")
Stephen Anderson
Storytelling with Data - Approach | Skills
Storytelling with Data - Approach | Skills
Amit Kapoor
UI/UX Tips & Tricks for developers
UI/UX Tips & Tricks for developers
Ecaterina Moraru (Valica)
Data Storytelling: The only way to unlock true insight from your data
Data Storytelling: The only way to unlock true insight from your data
Bright North
Design in Tech Report 2017
Design in Tech Report 2017
John Maeda
Netflix Digital Strategy
Netflix Digital Strategy
VCCP
Business Design Game: Gameboard (Business)
Business Design Game: Gameboard (Business)
Orange Hills GmbH
The pyramid principle by barbara minto
The pyramid principle by barbara minto
Altair Management Consultants
Personalization in banking- How to build relationships with Alyson Clarke of ...
Personalization in banking- How to build relationships with Alyson Clarke of ...
MoEngage Inc.
Disney: The Magic of Marketing Mix Analytics & Optimization
Disney: The Magic of Marketing Mix Analytics & Optimization
Vivastream
Graphic Design 101
Graphic Design 101
sbernalmarcial
Midwest UX '12: Mapping the Experience
Midwest UX '12: Mapping the Experience
Chris Risdon
Computer arts collection
Computer arts collection
Chanraksmey Ly
Consulting Template Slides - Mckinsey, BCG & Bain Style Communication
Consulting Template Slides - Mckinsey, BCG & Bain Style Communication
Boundless
"Introduction to Data Visualization" Workshop for General Assembly by Hunter ...
"Introduction to Data Visualization" Workshop for General Assembly by Hunter ...
Hunter Whitney
10 Principles for Data Storytelling
10 Principles for Data Storytelling
Damian Radcliffe
Strategic Planning Cheats
Strategic Planning Cheats
Andreas Krasser
Applying nudge theory in practice
Applying nudge theory in practice
Livework Studio
Marketing Automation at Adobe
Marketing Automation at Adobe
Marketo
Unit1_Syllbwbnwnwneneneneneneentation_Sem2.pptx
Unit1_Syllbwbnwnwneneneneneneentation_Sem2.pptx
Nitish292041
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 ppppppppppppppp
NadaMohammed714321
More Related Content
What's hot
10 Principles of Design by Dieter Rams for Data Visualization
10 Principles of Design by Dieter Rams for Data Visualization
Mika Aldaba
Place in Space (AKA "How to Design A Concept Model")
Place in Space (AKA "How to Design A Concept Model")
Stephen Anderson
Storytelling with Data - Approach | Skills
Storytelling with Data - Approach | Skills
Amit Kapoor
UI/UX Tips & Tricks for developers
UI/UX Tips & Tricks for developers
Ecaterina Moraru (Valica)
Data Storytelling: The only way to unlock true insight from your data
Data Storytelling: The only way to unlock true insight from your data
Bright North
Design in Tech Report 2017
Design in Tech Report 2017
John Maeda
Netflix Digital Strategy
Netflix Digital Strategy
VCCP
Business Design Game: Gameboard (Business)
Business Design Game: Gameboard (Business)
Orange Hills GmbH
The pyramid principle by barbara minto
The pyramid principle by barbara minto
Altair Management Consultants
Personalization in banking- How to build relationships with Alyson Clarke of ...
Personalization in banking- How to build relationships with Alyson Clarke of ...
MoEngage Inc.
Disney: The Magic of Marketing Mix Analytics & Optimization
Disney: The Magic of Marketing Mix Analytics & Optimization
Vivastream
Graphic Design 101
Graphic Design 101
sbernalmarcial
Midwest UX '12: Mapping the Experience
Midwest UX '12: Mapping the Experience
Chris Risdon
Computer arts collection
Computer arts collection
Chanraksmey Ly
Consulting Template Slides - Mckinsey, BCG & Bain Style Communication
Consulting Template Slides - Mckinsey, BCG & Bain Style Communication
Boundless
"Introduction to Data Visualization" Workshop for General Assembly by Hunter ...
"Introduction to Data Visualization" Workshop for General Assembly by Hunter ...
Hunter Whitney
10 Principles for Data Storytelling
10 Principles for Data Storytelling
Damian Radcliffe
Strategic Planning Cheats
Strategic Planning Cheats
Andreas Krasser
Applying nudge theory in practice
Applying nudge theory in practice
Livework Studio
Marketing Automation at Adobe
Marketing Automation at Adobe
Marketo
What's hot
(20)
10 Principles of Design by Dieter Rams for Data Visualization
10 Principles of Design by Dieter Rams for Data Visualization
Place in Space (AKA "How to Design A Concept Model")
Place in Space (AKA "How to Design A Concept Model")
Storytelling with Data - Approach | Skills
Storytelling with Data - Approach | Skills
UI/UX Tips & Tricks for developers
UI/UX Tips & Tricks for developers
Data Storytelling: The only way to unlock true insight from your data
Data Storytelling: The only way to unlock true insight from your data
Design in Tech Report 2017
Design in Tech Report 2017
Netflix Digital Strategy
Netflix Digital Strategy
Business Design Game: Gameboard (Business)
Business Design Game: Gameboard (Business)
The pyramid principle by barbara minto
The pyramid principle by barbara minto
Personalization in banking- How to build relationships with Alyson Clarke of ...
Personalization in banking- How to build relationships with Alyson Clarke of ...
Disney: The Magic of Marketing Mix Analytics & Optimization
Disney: The Magic of Marketing Mix Analytics & Optimization
Graphic Design 101
Graphic Design 101
Midwest UX '12: Mapping the Experience
Midwest UX '12: Mapping the Experience
Computer arts collection
Computer arts collection
Consulting Template Slides - Mckinsey, BCG & Bain Style Communication
Consulting Template Slides - Mckinsey, BCG & Bain Style Communication
"Introduction to Data Visualization" Workshop for General Assembly by Hunter ...
"Introduction to Data Visualization" Workshop for General Assembly by Hunter ...
10 Principles for Data Storytelling
10 Principles for Data Storytelling
Strategic Planning Cheats
Strategic Planning Cheats
Applying nudge theory in practice
Applying nudge theory in practice
Marketing Automation at Adobe
Marketing Automation at Adobe
Recently uploaded
Unit1_Syllbwbnwnwneneneneneneentation_Sem2.pptx
Unit1_Syllbwbnwnwneneneneneneentation_Sem2.pptx
Nitish292041
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 ppppppppppppppp
NadaMohammed714321
10 Best WordPress Plugins to make the website effective in 2024
10 Best WordPress Plugins to make the website effective in 2024
digital learning point
Pearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptx
DanielTamiru4
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
LucyBonelli
Pharmaceutical Packaging for the elderly.pdf
Pharmaceutical Packaging for the elderly.pdf
AayushChavan5
Interior Design for Office a cura di RMG Project Studio
Interior Design for Office a cura di RMG Project Studio
RMG Project Studio
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
Rishabh Aryan
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
JIT KUMAR GUPTA
AI and Design Vol. 2: Navigating the New Frontier - Morgenbooster
AI and Design Vol. 2: Navigating the New Frontier - Morgenbooster
1508 A/S
General Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptx
marckustrevion
Karim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 ppppppppppppppp
NadaMohammed714321
The spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenology
Christopher Totten
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
zdzoqco
Piece by Piece Magazine
Piece by Piece Magazine
CharlottePulte
Map of St. Louis Parks
Map of St. Louis Parks
CharlottePulte
Giulio Michelon, Founder di @Belka – “Oltre le Stime: Sviluppare una Mentalit...
Giulio Michelon, Founder di @Belka – “Oltre le Stime: Sviluppare una Mentalit...
Associazione Digital Days
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
MaryamAfzal41
guest bathroom white and bluesssssssssss
guest bathroom white and bluesssssssssss
NadaMohammed714321
Niintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptx
KevinYaelJimnezSanti
Recently uploaded
(20)
Unit1_Syllbwbnwnwneneneneneneentation_Sem2.pptx
Unit1_Syllbwbnwnwneneneneneneentation_Sem2.pptx
Karim apartment ideas 01 ppppppppppppppp
Karim apartment ideas 01 ppppppppppppppp
10 Best WordPress Plugins to make the website effective in 2024
10 Best WordPress Plugins to make the website effective in 2024
Pearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptx
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
simpson-lee_house_dt20ajshsjsjsjsjj15.pdf
Pharmaceutical Packaging for the elderly.pdf
Pharmaceutical Packaging for the elderly.pdf
Interior Design for Office a cura di RMG Project Studio
Interior Design for Office a cura di RMG Project Studio
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
Making and Unmaking of Chandigarh - A City of Two Plans2-4-24.ppt
AI and Design Vol. 2: Navigating the New Frontier - Morgenbooster
AI and Design Vol. 2: Navigating the New Frontier - Morgenbooster
General Knowledge Quiz Game C++ CODE.pptx
General Knowledge Quiz Game C++ CODE.pptx
Karim apartment ideas 02 ppppppppppppppp
Karim apartment ideas 02 ppppppppppppppp
The spirit of digital place - game worlds and architectural phenomenology
The spirit of digital place - game worlds and architectural phenomenology
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
Piece by Piece Magazine
Piece by Piece Magazine
Map of St. Louis Parks
Map of St. Louis Parks
Giulio Michelon, Founder di @Belka – “Oltre le Stime: Sviluppare una Mentalit...
Giulio Michelon, Founder di @Belka – “Oltre le Stime: Sviluppare una Mentalit...
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
guest bathroom white and bluesssssssssss
guest bathroom white and bluesssssssssss
Niintendo Wii Presentation Template.pptx
Niintendo Wii Presentation Template.pptx
Edward Tufte and Information Design for the Web
1.
Edward Tufte & Information
Design For the Web © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
2.
Dilbert Another Day
in Cubicle Paradise
3.
“
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
4.
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
6.
7.
Outline Information design principles Application
to Web design © 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
9.
Principle 1 Graphics reveal data ©
2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
10.
11.
12.
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
14.
15.
16.
17.
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
19.
20.
Principle 2 To clarify, add
detail © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
21.
22.
23.
24.
25.
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
27.
Principle 3 Small multiples invite
comparisons © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
28.
Tufte iPhone Video: http://www.edwardtufte.com/ bboard/q-and-a-fetch-msg? msg_id=00036T
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
30.
Principle 4 The “smallest effective
difference” © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
31.
32.
33.
34.
35.
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
38.
39.
40.
41.
42.
43.
44.
45.
46.
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
51.
Application 1 Design reveals data ©
2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
52.
Application 1a Contrast reveals data ©
2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
53.
Application 1b Contrast reveals information ©
2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
54.
Andy Rutledge A
List Apart
55.
“
Information consists of differences that make a difference. Envisioning Information 65 © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
56.
1
2 3 4 5 6
57.
Application 2 To clarify, add
detail © 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
59.
Scan annotated content invent.
60.
61.
62.
63.
64.
65.
66.
67.
Application 3 Employ the
smallest effective difference © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
68.
tutorial9.net
69.
tutorial9.net
70.
Dan Cederholm simplebits.com
71.
Doug Bowman stopdesign.com
72.
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
74.
Application 4 Design from
the inside, out © 2011 NATHAN HUENING sprockethouse.com 12 March 2011 Chapel Hill, NC
75.
Warren Parsons Photo
76.
77.
78.
79.
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
82.
83.
84.
85.
86.
87.
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
89.
90.
91.
92.
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
Download now