Edward Tufte and Information Design for the Web

Edward Tufte &Information DesignFor the Web

Dilbert Another Day in Cubicle Paradise

The fundamental task of the information architect is to make the information understandable. The goal is to clarify.

Richard Saul Wurman Digerati

The Visual Display of Quantitative Information

Insights into graphical design are to be gained, I believe, from theories of what makes for excellence in art, architecture, and prose.

Information design principles

Application to Web design

Outline

Graphics reveal data

To clarify, add detail

Small multiples invite comparisons

“Smallest effective difference”

Above all else, show the data

Tufte’s Information Design Principles

Principle 1

Visual Display of Quantitative Information

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 96

Every bit of ink on a graphic requires a reason. And nearly always that reason should be that the ink presents new information.

Principle 2

Information-sensitive designs are exacting and laborious, requiring a deep appreciation of the particular content at hand.

Visual Explanations 148

Principle 3

Tufte iPhone Video:

http://www.edwardtufte.com/bboard/q-and-a-fetch-msg?msg_id=00036T

Multiple images reveal repetition and change, pattern and surprise—the defining elements in the idea of information.

The “smallest effective difference”

Principle 4

Now what can be eliminated?

Frank Lloyd Wright

Above all else,show the data

Principle 5

It is all right to decorate construction, but never construct decoration.

Robert Venturi Learning from Las Vegas

“Smallest effective difference”

Above all else, show the data

Tufte’s Information Design Principles

Design reveals content

Design from the inside, out

Smallest effective difference

Above all else, show the content

Application to Web Design

Andy Rutledge A List Apart

Design is largely an exercise in creating or suggesting contrasts ... in an effort to convey meaning.

Design

Application 1

reveals data

Contrast

Application 1a

reveals data

Contrast

Application 1b

reveals information

Andy Rutledge A List Apart

Information consists of differences that make a difference.

Envisioning Information 65

1 23 4

Application 2

List your bits

Figure out which bits relate

Assign priorities

Design each bit

Assemble bits

37Signals An Introduction to Using Patterns in Web Design

Scan annotatedcontent invent.

Employ the smallest effective difference

Application 3

tutorial9.net

Dan Cederholm simplebits.com

Doug Bowman stopdesign.com

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

Application 4

Warren Parsons Photo

Copywriting is interface design. Great interfaces are written. ... Good writing is good design.

37Signals Getting Real

Above all else,show the content

Application 5

In an architecture of content, the information becomes the interface.

Aesthetics matter: attractive things work better.

Donald Norman Interactions Magazine

Design reveals content

Smallest effective difference

Above all else, show the content

Applications to Web Design

‘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

This has beena Sprocket House production.

Thank you

Edward Tufte and Information Design for the Web

Design

MindMapping - Georgia Department of Education • Introduction ... Tony Buzan •Video. Data Visualization •Edward Tufte •Napoleon Russian Invasion •PowerPoint. Edward Tufte

Lessons From Edward Tufte

Chapter 4: Data-Ink and Graphical Redesign.online.sfsu.edu/trogu/523/fall2010/tufte/04data-ink_graphical... · Title: Data Ink and Graphical Redesign Author: Edward Tufte Subject:

Tufte envisioning designing_data

Slides by: Sheelagh Carpendale E. Tufte: Visual Display of Quantitative Information Design World Graphical Excellence largely from Edward Tufte, The Visual

EDWARD TUFTE ALL POSSIBLE PHOTONS

Pecha Kucha - Edward Tufte Information Design books review

LESSONS FROM EDWARD TUFTE · This is according to Tufte possibly the worst graph ever : “A series of weird three-dimensional displays appearing in the magazine of American Education

XML/XSL and Information continue with XML/XSL Ideas from Edward Tufte on data density & data junk Homework: find & report on data presentation, Tufte,

Launch and Entry Failuresspacecraft.ssl.umd.edu/academics/791S14/791S14L21.failures.novidx.pdfFrom Edward R. Tufte, Visual and Statistical Thinking: Displays of Evidence for Making

THE VISUALIZATION OF DATABASE SEARCH RESULTS Introduction: Edward Tufte describes the visual presentation of quantitative data as “envisioning information.”

Introduction to Information Visualizationzhao/infovis18/lectures/Introduction… · · 2015-01-15• Edward Tufte: –The Visual Display of Quantitative Information –Envisioning

Colin Jackson and Helen Baxter - Sas Institute...The Visual Display of Quantitative Information EDWARD R. TUFTE EDWARD R. Tl VISUAL EX 'MAGES ANO @arte 8tgurative '1812-"813. , [e

[eBook] Edward Rolf Tufte - The Visual Display of Quantitative Information (1983)

EDWARD TUFTE ALL POSSIBLE PHOTONS - s3.amazonaws.com · EDWARD TUFTE ALL POSSIBLE PHOTONS ... Rocket Science 3 ... John Cage, detail from Concert for piano and orchestra, 1958,

Edward R. Tufte Copyright © 2006 Patrick McDermott UCB Extension pmcdermott@msn.com Tufte, Edward R., Envisioning Information, Cheshire, Connecticut: Graphics

Edward R. Tufte Marvin A. Ruder - Heidelberg …...The Book The Visual Display of Quantitative Information, by Edward R. Tufte Figure:Tufte 2001, originally published in 1983. M. Ruder

Edward Tufte and Information Design for the Web (Mar 11)

November 10, 2017 DRAFT Advanced Cartography GEOG 493/593 Map Design … · 2017-11-13 · Information, Second Edition, Edward Tufte, 2001. Making Maps: A Visual Guide to Map Design

Graficas de Tufte