User:Beltzner/Notes From Tufte Course

From MozillaWiki
Jump to: navigation, search

Edward Tufte - Presenting Data

Fundamental Truths of Visualizing Information

Most interesting data is multivariate

  • yet our communication techniques are 2d flatland
  • escaping flatland is key

Progress for communication devices is expressed in an increase of information resolution

  • "what's my rate of information transfer" in a presentation
  • corresponds to progress in intellectual history
  • Gallileo's time was 10^-3 through 10^6
  • our time is hundreds of times more than that

ex: Euclid's Geometry (Envisioning, p16)

  • first excellent example of escaping flatland
  • "people should put names on their work" to signal responsibility / pride
  • paper is good beause euclidean geometry works in 2d
  • triangle "ABC" :
    • don't force users to decode using a legend when a label will suffice
    • people come to learn, not to decode your design/encoding for information

PRINCIPLE: minimize decode time and increase cognitive appreciation time

  • proof of pythygorean theorem requires 44 round trips between text and diagram, each requiring a decode step
  • visual proof is 1-step; "behold"
  • Euclid used physical models in his book to escape flatland

QUOTE: "Notice these are sidenotes? This is where God wants footnotes."

ex: Napoleon's March to Moscow (poster)

QUOTE: "This is war and peace as told by a visual Tolstoy."

  • any policy decision is based on evidence of causality
  • the map is merely descriptive, showing the location of the bad news
  • temperature scale illustrates causality; it was the winter retreat that hurt a lot
  • dimensions shown in this map:
    • size of army
    • location
      • longitude
      • latitude
    • direction
    • temperature
  • multimodal display can yield richer communications and reduce round tripping


  1. "Show comparisons"
  2. "Show causality"
  3. "Show multivariate data"
  4. "Integrate word, number and image"
  5. "Document everything and cite sources, scales, error"
  6. "Presentations stand or fall based on quality, relevance and integrity of content"
  7. "Adjecent in space is superior to stacked in time"
  8. "Use small multiples" (or other mechanisms that illustrate whole-evidence summaries)
  9. "Put everything on a universal grid"
  • note that these principles can be inverted to be principles of shrewd consumption
  • that's because they're based on fundamental analytical tasks
  • principles of design = f(principles of analytical thinking)

QUOTE: "Interest and boredom is not a function of decoration, it's a property of content." PRINCIPLE: Transform your critical thinking tasks into principles of information design

  • first question should be "what is the thinking task that my presentation is supposed to help with"
    • dictates type of content, information architecture, etc.
    • gets us out of the business of "what's cool" and "what's hot"
  • claim that these principles are universal and indifferent to the environment
    • makes techniques for cartography equivalent to techniques for websites
    • evidence: natural laws are causal, multimodal, integrated, etc.
    • thus: principles are universal due to neccesity of our natural environment

QUESTION: what about emotional impact of design? how can one design for that? should one?

ex: Gallileo's Discovery of Saturn & Sunspots (Envisioning, p18)

  • embedded image right alongside word
  • "Saturn looks like this" ... "when it's blurry, it looks like this" ...
  • elegant, focus on data, design is transparent
  • sunspot data that proved that the sun rotates

GEM: Adjescent Information >> Information Stacked in Time

  • information stacked in time ("one damned thing after another" / "computer interface")
  • information resolution is powerful for putting more information in a single eyespan
    • our visual system is very high resolution & very selective in terms of processing
    • computer screens are trivial by comparison, and thus cannot present overload
    • bad _design_ creates overload, not amount of information

QUOTE: "The single best thing you can do to get better information on a computer (other than getting a Mac) is to get a great, big, high resolution display."

    • people doing serious analytics on computer usually use multiple monitors
    • this is why voicemail systems are so annoying

QUESTION: so why is animation better? because the time-delay is short enough that we can keep the previous image in mind?

  • sunspot data includes throwaway line "the annual movement of the earth"

QUOTE: "How religious faith got mixed up with astrological data is an idea that, I think, escapes anyone outside of Kansas."

  • represents the incredible change in the way our society analysed thought and principles
    • previously all thinking was done by philosophers
    • winning theories were those that were most eloquent or endorsed by church
    • this represents a shift to data/evidence based reasoning

ex: Shiner's Refuting of Sunspots (Envisioning, p19)

  • uses small multiples
  • once the viewer figures out the format, small multiples can be quickly scanned and compared
  • takes advantage of user's investment in decoding the format
  • implicit credibility through repetition and exploration/mastery of detail, showing all data

QUOTE: "The single biggest threat to learning the truth from a presentation is evidence selection by the presenter"

  • no such thing as objectivity, everyone's an advocate for something, usually their POV

QUOTE: "When a company beats the quarterly expectations by a penny, that's nice. When 20% of all companies do, that's perjury."

  • repeated studies are an excellent way to protect against cherry-picking/evidence selection
  • initial biotech studies are always the most positive explorations
    • subsequent designs exhibit more control, less enthusiasm, more critical review
    • more comparative data is avaiable which prevents cherry-picking

ex: John Gotti's "spreadsheet of crime" acquittal chart (Envisioning, p31)

  • this is a large multiple
  • yet these are "dummy variables"; they don't show multiplicity!
  • Cardinale was, in fact, convicted of murder 5 times
  • most obnoxious crimes are placed near top or bottom of chart for visual impact
  • information is adjescent in space, perhaps in order of testimonies
    • accomodates different cognitive styles
    • some will follow, some will peek ahead, some will draw their own comparisons
  • better than flipcharts/powerpoint since it lets the viewer explore it at their own speed/style

Scaling, Explaining Magnitude (Explanations, p16-24)

  • looks better in the "after" image because the perspective is adjusted, resulting in a more intimate view
  • good example of how size, magnitude and quantity
  • Lichtenstein painting is shown to be large by having an item of known size in view
  • severe grids to exploit perspective and motion distract from the actual information
  • NASA flyover of Venus featured a vertical exaggeration of 22.5 times normal
  • everything should be on a "universal grid" of some fashion
    • your data resides somewhere
    • provide context of where that is in relation to some universal grid
  • compare sunspot graphs (Explanations, p25) for the different scales
    • scale exploits that it's easiest to compare slopes that center around 45 degrees
    • selected aspect ratio of display that average absolute value of slopes is 1
    • eye wants "lumpy" graphics for best chance in learning about slope differences
    • sometimes called "banking" or "bringing level to 45"
    • the scale is driven by the cognitive task of wanting to compare the slopes

Showing Causality (Explanations, p30)

  • John Snow's map of London during the cholera epidemic illustrated causality by adding pumps to locations of deaths
  • ended up bringing an end to cholera epidemics in England
  • compare, tragically, to the 13 exhibit presentation by NASA engineers that predicted the Challenger explosion in 1988
  • their presentation failed to show causal comparison (ironically, so did Feynman's icewater experiment)
  • see page 53, Visual Explanations which was the nexus of the "grand principles"

Explaining Magic (Explanations, p55)

  • requires 5 dimensions: 3 for space, 1 for time, 1 for reveal/concealed
  • based in the design of disinformation
    • ex: they say "never tell your audience what you're about to do"
    • invert that, and you get a presentation design principle: tell people what the problem is, and how you're trying to solve it
    • ex2: "never repeat a trick"
    • inverted, this yeilds the conclusion that repetition is a valuable learning aid
  • advice learned from magic for presentations is on Explanations p68

Parallelism (Explanations, p82)

  • went over many examples of parallel graphics
  • fantastic example on page 90-91 of the history of music
  • dense information graphics allow the viewer to delve in and explore

QUOTE: "And I'm talking about why this graphic is good and nobody's listening to a damned word that I'm saying because you're all looking at it."

  • overdesigned displays have a fantastic amount of decoration and a poverty of information
  • cluttered designs are simply designs that failed at achieving parallelism

QUOTE: "Clutter and confusion are not attributes of information they are failures of design."

  • to clarify, add detail, don't remove content!

Sparklines (Beautiful Evidence 4pg Advance)

  • incredibly dense resolution of information
  • completely open source, and implementations exist in the field for several popular applications (including MS Word)
  • they provide visual access to massive amounts of information
    • better to be approximately right than absolutely wrong
  • sparklines are treated like regular typography, and have the resolution of words
    • like words, you can scan wholistically, or go bit-by-bit for in depth analysis
    • lowercase "a" makes 20-50 visual distinctions (on/off); sparklines use similar "resolution"

QUESTION: things like the "home-game" variant in a sparkline aren't immediately apparent; would require an additional decode step to be published each time?

  • tempting to get sparkline featuritis

GUI (Explanations, p146-7)

  • frquently violates rule #4 - doesn't let you integrate word, number and image
  • initial GUI by Xerox had no concept other than documents and folders
    • applications didn't exist; they were just opened when someone opened a document
  • three things now exist in GUIs that were never intended to by Xerox:
    • concept of an "operating system"
    • concept of an "application"
    • concept of a "marketing experience"
  • too frequently, UI designs mimic the organizational heirarchy
    • this happens a lot in annual reports, too

QUOTE: "The only damned metaphor that they can think of is heirarchical."

    • menu structures that don't show the downstream options are unfriendly and limit content unneccessarily
    • pages with few links are keeping users from the content they're looking for

QUESTION: so, I guess the idea is that promoting 3-5 simple tasks on a webpage is good, but then laundry-list other things in an easy-to-scan fashion? where's the idea of trying to limit complexity by limiting choice?

  • what good are icons that need to have words beneath them? at that point, the icon has failed and is chartjunk
  • computer systems are loaded with chartjunk
    • icons, system controls, low-frequency use buttons, advertising
    • the battle for control over the screen is foisted onto the user
    • should be based on a calculation of content/totalArea yeilding a number higher than 90%

QUOTE: "Nobody ever comes to a website for a design experience ... the two most embarrasing words in the history of web design are 'Skip Intro'." COMMENT: this all goes back to "good design is invisible", really; not sure how I feel about his advice that home pages should be full of links. Also, his definition of "design experience" seems to be heavily graphical with no content, flash movies, etc.

    • every pixel counts in a low-resolution environment (screens are low-res compared to paper!)

Cognitive Style of PowerPoint (essay of same name)

  • executive summary suffered from "marketing terminology" such as "conservatism"
  • title was "Review of Test Data Indicates Conservatism for Tile Penetration"
    • focus was on "Tile", not "RCC" which actually ended up being the problem
    • how, as a consumer of the presentation, would you know to ask "how about the RCC?"

PRINCIPLE: be careful of too narrow a domain specification; try to always think about what's relevant to the problem and ensure that your domain is inclusive

  • first bullet makes no sense; this is very common and due to the low resolution nature of the medium
    • PowerPoint promotes a "writing style somewhere between sentences and grunts"
    • heavy reliance on acronyms and grammatical shortcuts
    • the act of sentance structure requires analytical thought; PowerPoint works against this
    • requires consumers have same cognitive context / shortcuts as authors
    • hard to inline graphics, proper mathematical/engineering notation, domain specific notation
  • close reading revealed a lack of analysis
    • overuse of vaguely qualitative words
    • indirect nouns such as "flight condition" vs. "Columbia"
    • vague references such as "it" which actually referred to "loss of vehicle and crew"
    • inconsistent use of terminology, formatting and style

QUOTE: "The appropriate title for this slide would have been 'Review of Test Data Indicates Irrelevance of Two Models'. That's not disingenuous; that would have meant something in a safety culture."

  • PowerPoint forwards an attitude and a cognitive style

QUOTE: "Use the AutoContent wizard to decide what you want to say." -- PowerPoint marketing brochure

    • foreshortens evidence and thought
    • low resolution
    • single path heirarchical presentation of information
    • broken narrative structure with minimal fragments
    • rapidly spaced thin information rather than focused spatial analysis
    • preoccupation with format not content which leads to marketing-like "pitch" effect
    • only 1982-era Pravda had thinner information presentation than PowerPoint templates & textbooks
  • don't fit the presentation to the software!

Tips for Delivering Presentations

  • For before you even get into the meeting / creating the presentation ..:
    • Serious presentations stand or fall based on the quality of the content
    • Design cannot rescue failed content
    • Practise, Practise, Practise your presentation
  • Presentation delivery tips:
    • Show up early
    • Avoid meaningless filler and uptalk
    • Start with the 200 word summary (what's the problem? who cares? what's to be done?)
    • Use Particular-General-Particular (PGP) structure for explaining information
    • Give everyone at least one piece of paper
    • Tailor to your audience (copy the WSJ, second most selling newspaper, highest resolution)
    • Find good models and follow them (don't get it original, get it right)
    • Use humour for quick reinforcement, not as a set piece
    • End early

And then he did, by about 2 minutes.