Dr. Dobb's is part of the Informa Tech Division of Informa PLC

This site is operated by a business or businesses owned by Informa PLC and all copyright resides with them. Informa PLC's registered office is 5 Howick Place, London SW1P 1WG. Registered in England and Wales. Number 8860726.


Channels ▼
RSS

Tufte on Visualizing Information


Op-Ed: Aug 5, 1997: Tufte on Visualizing Information

Eugene, DDJ's technical editor, can be reached at [email protected].


As I drove into the parking lot to attend a one-day course taught by Edward Tufte, it occurred to me that all I really knew about Tufte, I learned from Ray Duncan's book review in the June 1997 issue of Dr. Dobb's Journal. I quickly learned something else about him as I unsuccessfully tried to find a parking spot--Tufte is a very popular guy.

Over 375 people payed $300 to attend Tufte's course on information design and receive copies of his three self-published books: The Visual Display of Quantitative Information, Envisioning Information, and Visual Explanations: Images and Quantities, Evidence and Narrative. The books alone could have made the fee worthwhile; the opportunity to hear Tufte passionately preach his design principles (peppered with not-so-occasional one-liners) made the fee a steal.

Information Design

The problem with presenting information, as explained by Tufte, is simple -- the world is high-dimensional, but our displays are not. To address this basic problem, Tufte offered five principles of information design:

  1. Quantitative thinking comes down to one question: Compared to what?
  2. Try very hard to show cause and effect.
  3. Don't break up evidence by accidents of means of production.
  4. The world is multivariant, so the display should be high-dimensional.
  5. The presentation stands and falls on the quality, relevance, and integrity of the content.

Tufte's first two principles found their way into almost all of his examples, and I found them the most useful lessons of the course. In essence, the effectiveness of any visual display can be determined by asking what is being compared, what is the cause, and what is the effect. To be persuasive, which is, after all, the ultimate goal, a display must adequately answer these three questions.

Of the five principles, the third received the lightest treatment. It addresses a common problem in books and magazines, including Dr. Dobb's Journal: using references for figures and examples rather than including them in the flow of the text. Tufte griped about those who stapled tables and figures to the end of a report. "Tell a coherent story," pleaded Tufte.

To demonstrate his fourth principle, Tufte showed a 19th-century map of Napoleon's 1812 march into Russia. Drawn by the engineer Charles Minard, the map had a band of varying thickness that traced Napoleon's path, with the march and retreat in different colors. The thickness of the band represented the number of soldiers. On the bottom of the map was a timeline with the corresponding temperature.

The band, which at first is quite thick (representing 422,000 soldiers), gets thinner as Napoleon marches towards Moscow. The retreating band, already considerably narrower at 100,000 soldiers, continues to thin. At one point on the map, it halves in size, representing Napoleon's loss of half his army as they fell into the frozen Berezina River. At the end of the retreat, Napoleon has only 10,000 soldiers left, a fraction of the width of the original band.

Minard manages to portray six dimensions on this two-dimensional paper -- the size of the army, latitude, longitude, direction the army is going, temperature, and date. On a single sheet of paper with nary a paragraph, Minard simply and eloquently tells the history of Napoleon's failed march to take Russia.

It was pleasing to hear Tufte call his fifth principle the most important. "Good design is clear thinking made visible," he says. Throughout the day, Tufte constantly poked fun at the cartoon icons and rainbow effects in many of the examples, noting that these embellishments were there to obscure the fact that the images contained little content.

User Interfaces

When Tufte began discussing computer interfaces, several people in the audience leaned forward in anticipation. Many of the attendees were undoubtedly web designers, trying to see if Tufte could impart any wisdom on their trade.

Tufte didn't offer much hope. "Only two industries refer to their customers as 'users'," he quipped, obviously disenchanted with his experiences with the computer industry and software interfaces. "The most common user activity of a web site is to flee as quickly as possible."

Why so many bad user interfaces? The main problem is that computer monitors are low resolution. For comparison, one page from Who's Who contains around 50,000 characters, at least ten times the resolution of a computer screen. To compound the inherent deficiencies of the medium, said Tufte, user interfaces generally replicate the hierarchy of those who control the content, rather than focus on the content itself.

His claim definitely corresponded with my own experience with corporate web sites -- marketing people insisting on including the oversized, animated corporate logo, web designers packing in as many tables and frames as possible, programmers ignoring everyone else and implementing their own obscure interface. Most web pages, according to Tufte, reflect this political power struggle, with the content relegated to a tiny percentage of the already low-resolution screen.

This political power struggle also appears in other mediums. Tufte claimed that the headings that labelled each page in Newsweek as "World News" or "Business" were unnecessary embellishments designed to mark each section as territory belonging to a particular editor. While I disagreed with this particular criticism, I noted (happily) that Dr. Dobb's Journal did not suffer from this fault.

Tufte also criticized books on user-interface design. While he recommended the well-known Designing the User Interface, by Ben Schneiderman, he noted that the Schneiderman book placed an unfortunate emphasis on the design-and-test cycle. This led to "taste testing" by amateur design consultants, rather than "performance testing."

Finance and Feynman

Tufte spent a considerable amount of time discussing displaying financial data. He summed up his views on properly displaying financial information by quoting T.S. Eliot (and the countless other artists who have said this in one form or another): "Talent imitates, but genius steals." Why try to reinvent the wheel, asked Tufte, when publications like the Wall Street Journal and organizations such as the U.S. Census Bureau had spent years inventing a very good one?

Tufte also discussed the events leading up to the 1986 Challenger explosion. The rocket-maker, Morton Thiokol, had recommended that NASA cancel the Challenger launch the night before, but had been unable to persuade NASA. Tufte first showed how the Thiokol presentation violated several principles of design, and then showed a more persuasive rearrangement of the same data. (Tufte's discussion and charts are published in Visual Explanations.)

Tufte then described physicist Richard Feynman's famous demonstration of the brittle O-Ring in a glass of ice water. After praising Feynman for several minutes, Tufte surprised the audience by noting that Feynman's demonstration was just as flawed as the Thiokol presentation. The problem was that Feynman's presentation did not answer the question, "compared to what?", Tufte's first principle. Feynman's presentation would have been more correct had he taken a second glass of water at room temperature, and compared O-Rings from each glass.

Sleight of Hand

The final topic of the course was magic. Magic is expressed in five dimensions: 3-dimensional space, time, and what is revealed and concealed. Tufte called magic the art of "disinformation design."

In some ways, Tufte used sleight of hand to make the course seem more substantial than it really was, in some cases violating his own fifth principle. Most of his talk and examples were derived from his three books, although he did add value to most of them by pointing out important details and offering interesting background and anecdotes not found in the book.

And while some of his examples demonstrated a principle perfectly, like the Minard map, others seemed more impressive than they really were. For example, at the beginning of the talk, Tufte raised the basic question of how to display three dimensional objects on a two-dimensional book page. To demonstrate one solution, Tufte showed a 427-year old English translation of Euclid's Geometry. The publisher of this rare old tome had pasted a large triangle onto the page, which could be folded up into a three-sided pyramid.

The awe of seeing such an old book in remarkably good condition made the example seem better than it was. This solution, after all, was to physically add the physical third dimension, not to actually express the third dimension on a two dimensional medium.

Nevertheless, Tufte made no pretense at the day being anything more than an introductory course. While I conceivably could have learned as much from his books and saved myself the irritation of hunting for a parking spot, Tufte's dynamic speaking style and anecdotes made the course worthwhile.


Related web sites


These op/eds do not necessarily reflect the opinions of the author's employer or of Dr. Dobb's Journal. If you have comments, questions, or would like to contribute your own opinions, please contact us at [email protected].


Related Reading


More Insights






Currently we allow the following HTML tags in comments:

Single tags

These tags can be used alone and don't need an ending tag.

<br> Defines a single line break

<hr> Defines a horizontal line

Matching tags

These require an ending tag - e.g. <i>italic text</i>

<a> Defines an anchor

<b> Defines bold text

<big> Defines big text

<blockquote> Defines a long quotation

<caption> Defines a table caption

<cite> Defines a citation

<code> Defines computer code text

<em> Defines emphasized text

<fieldset> Defines a border around elements in a form

<h1> This is heading 1

<h2> This is heading 2

<h3> This is heading 3

<h4> This is heading 4

<h5> This is heading 5

<h6> This is heading 6

<i> Defines italic text

<p> Defines a paragraph

<pre> Defines preformatted text

<q> Defines a short quotation

<samp> Defines sample computer code text

<small> Defines small text

<span> Defines a section in a document

<s> Defines strikethrough text

<strike> Defines strikethrough text

<strong> Defines strong text

<sub> Defines subscripted text

<sup> Defines superscripted text

<u> Defines underlined text

Dr. Dobb's encourages readers to engage in spirited, healthy debate, including taking us to task. However, Dr. Dobb's moderates all comments posted to our site, and reserves the right to modify or remove any content that it determines to be derogatory, offensive, inflammatory, vulgar, irrelevant/off-topic, racist or obvious marketing or spam. Dr. Dobb's further reserves the right to disable the profile of any commenter participating in said activities.

 
Disqus Tips To upload an avatar photo, first complete your Disqus profile. | View the list of supported HTML tags you can use to style comments. | Please read our commenting policy.