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 self-published 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 Smallest Effective Difference 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 – non-natural 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 real-live. 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