Submit Search
Upload
Edward Tufte and Information Design for the Web
•
23 likes
•
22,093 views
S
sprocketeer
Follow
Reprise of my 2009 presentation for Refresh the Triangle
Read less
Read more
Design
Slideshow view
Report
Share
Slideshow view
Report
Share
1 of 96
Download now
Download to read offline
Recommended
Effective Data Visualization (David Giard)
Effective Data Visualization (David Giard)
ITCamp
How to Write Clickass Presentations that Convert
How to Write Clickass Presentations that Convert
Barry Feldman
Working With Big Data
Working With Big Data
Seth Familian
Visual Thinking - Sketch Notes
Visual Thinking - Sketch Notes
XPLANE
24 Awesome Infographic Ideas to Inspire Your Next Beautiful Creation
24 Awesome Infographic Ideas to Inspire Your Next Beautiful Creation
Piktochart
Experience – The New “E” in Google’s E-E-A-T Ranking System
Experience – The New “E” in Google’s E-E-A-T Ranking System
Jomer Gregorio
Google E-E-A-T - Learn It, Live It, Love It.pptx
Google E-E-A-T - Learn It, Live It, Love It.pptx
Wellspring Digital
Employee Development Strategies For Your Remote Workforce
Employee Development Strategies For Your Remote Workforce
O.C. Tanner
Recommended
Effective Data Visualization (David Giard)
Effective Data Visualization (David Giard)
ITCamp
How to Write Clickass Presentations that Convert
How to Write Clickass Presentations that Convert
Barry Feldman
Working With Big Data
Working With Big Data
Seth Familian
Visual Thinking - Sketch Notes
Visual Thinking - Sketch Notes
XPLANE
24 Awesome Infographic Ideas to Inspire Your Next Beautiful Creation
24 Awesome Infographic Ideas to Inspire Your Next Beautiful Creation
Piktochart
Experience – The New “E” in Google’s E-E-A-T Ranking System
Experience – The New “E” in Google’s E-E-A-T Ranking System
Jomer Gregorio
Google E-E-A-T - Learn It, Live It, Love It.pptx
Google E-E-A-T - Learn It, Live It, Love It.pptx
Wellspring Digital
Employee Development Strategies For Your Remote Workforce
Employee Development Strategies For Your Remote Workforce
O.C. Tanner
Place in Space (AKA "How to Design A Concept Model")
Place in Space (AKA "How to Design A Concept Model")
Stephen Anderson
The Art of the Presentation
The Art of the Presentation
Jeffrey Stevens
Guide to-google-analytics google 4
Guide to-google-analytics google 4
Nizam Uddin
Marketing Plan for an App
Marketing Plan for an App
Siddharth JP
NLP for entity-based and semantic SEO - Contference.pptx
NLP for entity-based and semantic SEO - Contference.pptx
Studio Makoto Agenzia di Marketing e Comunicazione
Automating Google Lighthouse
Automating Google Lighthouse
Hamlet Batista
The Great State of Design with CSS Grid Layout and Friends
The Great State of Design with CSS Grid Layout and Friends
Stacy Kvernmo
500 Demo Day Batch 19: Gluwa
500 Demo Day Batch 19: Gluwa
500 Startups
An introduction to Google Analytics
An introduction to Google Analytics
Joris Roebben
Five Killer Ways to Design The Same Slide
Five Killer Ways to Design The Same Slide
Crispy Presentations
WTM-2023-Looker Studio.pdf
WTM-2023-Looker Studio.pdf
PyariKumaran
Getting Started with Google Analytics 4
Getting Started with Google Analytics 4
In Marketing We Trust
Building a Search Intent-Driven Website Architecture (SEO Mastery Summit 2022...
Building a Search Intent-Driven Website Architecture (SEO Mastery Summit 2022...
LazarinaStoyanova
Google Analytics 4 Trial Recommendation
Google Analytics 4 Trial Recommendation
Yisrael Segall
Keyword Research and Topic Modeling in a Semantic Web
Keyword Research and Topic Modeling in a Semantic Web
Bill Slawski
How Game Developers Reach New Customers with Twitch
How Game Developers Reach New Customers with Twitch
Amazon Web Services
BrightonSEO March 2021 | Dan Taylor, Image Entity Tags
BrightonSEO March 2021 | Dan Taylor, Image Entity Tags
Dan Taylor
Book Recommendations.pptx
Book Recommendations.pptx
DishaSharma337110
How NOT to Run Your Company – Lessons Learned
How NOT to Run Your Company – Lessons Learned
Weekdone.com
signmesh snapshot - the best of sustainability
signmesh snapshot - the best of sustainability
signmesh
怎样办理巴斯大学毕业证(Bath毕业证书)成绩单留信认证
怎样办理巴斯大学毕业证(Bath毕业证书)成绩单留信认证
eeanqy
Resume all my skills and educations and achievement
Resume all my skills and educations and achievement
210303105569
More Related Content
What's hot
Place in Space (AKA "How to Design A Concept Model")
Place in Space (AKA "How to Design A Concept Model")
Stephen Anderson
The Art of the Presentation
The Art of the Presentation
Jeffrey Stevens
Guide to-google-analytics google 4
Guide to-google-analytics google 4
Nizam Uddin
Marketing Plan for an App
Marketing Plan for an App
Siddharth JP
NLP for entity-based and semantic SEO - Contference.pptx
NLP for entity-based and semantic SEO - Contference.pptx
Studio Makoto Agenzia di Marketing e Comunicazione
Automating Google Lighthouse
Automating Google Lighthouse
Hamlet Batista
The Great State of Design with CSS Grid Layout and Friends
The Great State of Design with CSS Grid Layout and Friends
Stacy Kvernmo
500 Demo Day Batch 19: Gluwa
500 Demo Day Batch 19: Gluwa
500 Startups
An introduction to Google Analytics
An introduction to Google Analytics
Joris Roebben
Five Killer Ways to Design The Same Slide
Five Killer Ways to Design The Same Slide
Crispy Presentations
WTM-2023-Looker Studio.pdf
WTM-2023-Looker Studio.pdf
PyariKumaran
Getting Started with Google Analytics 4
Getting Started with Google Analytics 4
In Marketing We Trust
Building a Search Intent-Driven Website Architecture (SEO Mastery Summit 2022...
Building a Search Intent-Driven Website Architecture (SEO Mastery Summit 2022...
LazarinaStoyanova
Google Analytics 4 Trial Recommendation
Google Analytics 4 Trial Recommendation
Yisrael Segall
Keyword Research and Topic Modeling in a Semantic Web
Keyword Research and Topic Modeling in a Semantic Web
Bill Slawski
How Game Developers Reach New Customers with Twitch
How Game Developers Reach New Customers with Twitch
Amazon Web Services
BrightonSEO March 2021 | Dan Taylor, Image Entity Tags
BrightonSEO March 2021 | Dan Taylor, Image Entity Tags
Dan Taylor
Book Recommendations.pptx
Book Recommendations.pptx
DishaSharma337110
How NOT to Run Your Company – Lessons Learned
How NOT to Run Your Company – Lessons Learned
Weekdone.com
signmesh snapshot - the best of sustainability
signmesh snapshot - the best of sustainability
signmesh
What's hot
(20)
Place in Space (AKA "How to Design A Concept Model")
Place in Space (AKA "How to Design A Concept Model")
The Art of the Presentation
The Art of the Presentation
Guide to-google-analytics google 4
Guide to-google-analytics google 4
Marketing Plan for an App
Marketing Plan for an App
NLP for entity-based and semantic SEO - Contference.pptx
NLP for entity-based and semantic SEO - Contference.pptx
Automating Google Lighthouse
Automating Google Lighthouse
The Great State of Design with CSS Grid Layout and Friends
The Great State of Design with CSS Grid Layout and Friends
500 Demo Day Batch 19: Gluwa
500 Demo Day Batch 19: Gluwa
An introduction to Google Analytics
An introduction to Google Analytics
Five Killer Ways to Design The Same Slide
Five Killer Ways to Design The Same Slide
WTM-2023-Looker Studio.pdf
WTM-2023-Looker Studio.pdf
Getting Started with Google Analytics 4
Getting Started with Google Analytics 4
Building a Search Intent-Driven Website Architecture (SEO Mastery Summit 2022...
Building a Search Intent-Driven Website Architecture (SEO Mastery Summit 2022...
Google Analytics 4 Trial Recommendation
Google Analytics 4 Trial Recommendation
Keyword Research and Topic Modeling in a Semantic Web
Keyword Research and Topic Modeling in a Semantic Web
How Game Developers Reach New Customers with Twitch
How Game Developers Reach New Customers with Twitch
BrightonSEO March 2021 | Dan Taylor, Image Entity Tags
BrightonSEO March 2021 | Dan Taylor, Image Entity Tags
Book Recommendations.pptx
Book Recommendations.pptx
How NOT to Run Your Company – Lessons Learned
How NOT to Run Your Company – Lessons Learned
signmesh snapshot - the best of sustainability
signmesh snapshot - the best of sustainability
Recently uploaded
怎样办理巴斯大学毕业证(Bath毕业证书)成绩单留信认证
怎样办理巴斯大学毕业证(Bath毕业证书)成绩单留信认证
eeanqy
Resume all my skills and educations and achievement
Resume all my skills and educations and achievement
210303105569
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
gargpaaro
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
meghakumariji156
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
gajnagarg
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
yhavx
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
eeanqy
Jual Obat Aborsi Bandung ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan ...
Jual Obat Aborsi Bandung ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan ...
ZurliaSoop
Furniture & Joinery Details_Designs.pptx
Furniture & Joinery Details_Designs.pptx
Nikhil Raut
Essential UI/UX Design Principles: A Comprehensive Guide
Essential UI/UX Design Principles: A Comprehensive Guide
Design Studio UI UX
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
samsungultra782445
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
ehyxf
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
meghakumariji156
How to Build a Simple Shopify Website
How to Build a Simple Shopify Website
mark11275
Minimalist Orange Portfolio by Slidesgo.pptx
Minimalist Orange Portfolio by Slidesgo.pptx
balqisyamutia
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
nirzagarg
Simple Conference Style Presentation by Slidesgo.pptx
Simple Conference Style Presentation by Slidesgo.pptx
balqisyamutia
Eye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docx
MdBokhtiyarHossainNi
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
CristineGraceAcuyan
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Nitya salvi
Recently uploaded
(20)
怎样办理巴斯大学毕业证(Bath毕业证书)成绩单留信认证
怎样办理巴斯大学毕业证(Bath毕业证书)成绩单留信认证
Resume all my skills and educations and achievement
Resume all my skills and educations and achievement
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Mohanlalganj ! Call Girls in Lucknow - 450+ Call Girl Cash Payment 9548273370...
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
Jual Obat Aborsi Bandung ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan ...
Jual Obat Aborsi Bandung ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan ...
Furniture & Joinery Details_Designs.pptx
Furniture & Joinery Details_Designs.pptx
Essential UI/UX Design Principles: A Comprehensive Guide
Essential UI/UX Design Principles: A Comprehensive Guide
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
Abortion pills in Riyadh +966572737505 <> buy cytotec <> unwanted kit Saudi A...
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
怎样办理莫纳什大学毕业证(Monash毕业证书)成绩单留信认证
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
How to Build a Simple Shopify Website
How to Build a Simple Shopify Website
Minimalist Orange Portfolio by Slidesgo.pptx
Minimalist Orange Portfolio by Slidesgo.pptx
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Top profile Call Girls In Sonipat [ 7014168258 ] Call Me For Genuine Models W...
Simple Conference Style Presentation by Slidesgo.pptx
Simple Conference Style Presentation by Slidesgo.pptx
Eye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docx
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
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