banner image

Visual media are increasingly generated, manipulated, and transmitted by computers. When well designed, such displays capitalize on human facilities for processing visual information and thereby improve comprehension, memory, inference, and decision making. Yet the digital tools for transforming data into visualizations still require low-level interaction by skilled human designers. As a result, producing effective visualizations can take hours or days and consume considerable human effort.

In this course we will study techniques and algorithms for creating effective visualizations based on principles and techniques from graphic design, visual art, perceptual psychology and cognitive science. The course is targeted both towards students interested in using visualization in their own work, as well as students interested in building better visualization tools and systems. In addition to participating in class discussions, students will have to complete several short programming and data analysis assignments as well as a final programming project.

There are no official prerequisites for the class, but the class is aimed at graduate students and advanced undergraduates. However, familiarity with the material in CS147, CS 148 and CS142 can be useful. Even more important is a basic working knowledge of, of some web-programming and/or graphics API (e.g. Javascript/D3, Python, WebGL). Experience with data analysis applications (e.g. Excel, Matlab, R) is also helpful. The final project can be developed using any suitable language or application. While we will cover a little bit of Javascript/D3 in class, most of the other APIs, applications and languages will not be taught in the course. However many introductory tutorials at the level required for the class are available on the web and we can help you find the relevant information as you need it.

Contact me (Maneesh) via Piazza if you are worried about whether you have the background for the course.

Schedule


Week 1
M Sep 25: The Purpose of Visualization
    Submit Reading Response | Slides

    Assigned: Assignment 1 (due Oct 2 noon)
    Required readings:
        Chapter 1: Graphical Excellence, In The Visual Display of Quantitative Information. Tufte.
        Chapter 2: Graphical Integrity, In The Visual Display of Quantitative Information. Tufte.
    Optional readings:
        Decision to launch the Challenger, In Visual Explanations. Tufte. (pdf) (critique)
        Graphs in Statistical Analysis. F. J. Anscombe. The American Statistician (jstor)

W Sep 27: Data and Image Models
    Submit Reading Response | Slides

    Required readings:
        Chapter 1: Information Visualization, In Readings in Information Visualization. Card, et al. (pdf)
        Chapter 2: Graphical Integrity, In The Visual Display of Quantitative Information. Tufte.

Week 2
M Oct 2: Visualization Design
    Submit Reading Response | Slides

    Due (by noon): Assignment 1
    Assigned: Assignment 2 (due Oct 16 before class)
    Required readings:
        Chapter 3: Sources of Graphical Integrity, In VDQI. Tufte.
        Chapter 4: Data-Ink and Graphical Redesign, In VDQI. Tufte.
        Chapter 5: Chartjunk, In VDQI. Tufte.
        Chapter 6: Data-Ink Maximization and Graphical Design, In VDQI. Tufte.
    Optional readings:
        Sharing Visualizations with the World. ACM Queue. (web)

W Oct 4: Exploratory Data Analysis
    Submit Reading Response | Slides

    Required readings:
        Polaris. Stolte, Tang, and Hanrahan. IEEE TVCG, 8(1), Jan 2002. (pdf)
        Chapter 2: Macro/Micro Readings, In Envisioning Information. Tufte.
        Chapter 8: Data Density and Small Multiples, In VDQI. Tufte.
        Chapter 4: Small Multiples, In Envisioning Information. Tufte.
    Optional readings:
        Dynamic queries, starfield displays, and the path to Spotfire. Shneiderman. (html)
        Exploratory Data Analysis, NIST Engineering Statistics Handbook
        Exploratory Data Analysis, Wikipedia

Week 3
M Oct 9: Perception
    Submit Reading Response | Slides

    Required readings:
        Perception in visualization. Healey. (html)
        Graphical perception. Cleveland & McGill. (jstor)(Google Scholar)
        Chapter 3: Layering and Separation, In Envisioning Information. Tufte.
    Optional readings:
        Gestalt and composition. In Course #13, SIGGRAPH 2002. Durand. (1-up pdf) (6-up pdf)
        The psychophysics of sensory function. Stevens. (jstor)
        Crowdsourcing Graphical Perception. Heer and Bostock. ACM CHI 2010. (pdf)

W Oct 11: Interaction
    Submit Reading Response | Slides

    Required readings:
        Postmortem of an example, Bertin.(pdf)
        Visual information seeking, Ahlberg & Shneiderman. (html)
        Visual queries for finding patterns in time series data, Hochheiser & Schneiderman. (pdf)
    Optional readings:
        Generalized selection via interactive query relaxation. Heer, Agrawala & Willett. (html)
        The visual design and control of the trellis display. Becker, Cleveland and Shyu. (pdf)
        Exploration of the Brain’s White Matter Pathways with Dynamic Queries. Akers et al. (html)
    Demonstrations:
        ggobi
        Homefinder
        Cellphones
        Fry’s zipdecode
        Wattenberg’s NameVoyager
        Heer’s example of generalized selection. LA Homicides
        Classic systems on stat-graphics.org

Week 4
M Oct 16: Interaction II
    Submit Reading Response | Slides

    Due (before class): Assignment 2
    Assigned: Assignment 3 (due Oct 30 before class)
    Required readings:
        Generalized selection via interactive query relaxation. Heer, Agrawala & Willett. (html)
        The visual design and control of the trellis display. Becker, Cleveland and Shyu. (pdf)
        Exploration of the Brain’s White Matter Pathways with Dynamic Queries. Akers et al. (html)
    Demonstrations:
        ggobi
        Homefinder
        Cellphones
        Fry’s zipdecode
        Wattenberg’s NameVoyager
        Heer’s example of generalized selection. LA Homicides
        Classic systems on stat-graphics.org

W Oct 18: Introduction to D3
    Submit Reading Response | Slides | Cats and dogs scatter

    Required readings:
        D3: Data Driven Documents. D3: Data-Driven Documents Bostock, Ogievetsky & Heer. (html)
        Read the D3 documentation and tutorials, including the bar chart tutorial.
        Work through the D3 tutorials created by Scott Murray
    Optional readings:
        Software Design Patterns for Information Visualization. Heer & Agrawala. (html)
        Protovis: A Graphical Toolkit for Visualization. Bostock & Heer. (pdf)
        prefuse: A Toolkit for Interactive Information Visualization. Heer, Card & Landay. (html)

Week 5
M Oct 23: D3 Tutorial
    Submit Reading Response | Slides | Exercise solutions

    Required readings:
        Visual exploration of time-series data, Hochheiser & Schneiderman. (pdf)
        Interactive Data Visualization for the Web, Scott Murray. Chapters 3, 4, 5. (html)
        Eloquent Javascript, Marijn Haverbeke. Chapter 16. (html)
    Optional readings:
        Interactive Data Visualization for the Web, Scott Murray. Chapters 6, 8, 10. (html)
        jQuery Enlightenment, Cody Lindley. Chapters 1, 2, 6. (pdf)
        Dive Into HTML5, Mark Pilgrim. Chapter 4. (html)

W Oct 25: Work on Assignment 3 in class


Week 6
M Oct 30: Using Space Effectively: 2D
    Submit Reading Response | Slides

    Due (before class): Assignment 3
    Assigned: Final Project (project proposal due Nov 6 before class)
    Required readings:
        Graphical Methods for Data Presentation. Cleveland. (jstor)
        Chapter 11: The Cartogram: Value-by-Area Mapping. In Cartography. Dent (pdf)
    Optional readings:
        Multi-Scale Banking to 45 Degrees. Heer & Agrawala. (pdf)
        An Empirical Model of Slope Ratio Comparisons. Talbot et al. (html)
        Pad++, Bederson & Hollan (acm)
        Generalized fisheye views, Furnas. (acm)
        Hyperdimensional data analysis using parallel coordinates, Wegman (jstor)
        A framework for unifying presentation space, Carpendale & Montagnese. (acm)
        Nomography
        Cartogram central

W Nov 1: Spatial Layout
    Submit Reading Response | Slides

    Required readings:
        A general cartographic labeling algorithm, Edmondson, Marks & Shieber (pdf)
        A survey of automated layout techniques for information presentations, Lok and Feiner (pdf)
    Optional readings:
        Dynamic space management for user interfaces, Bell & Feiner (pdf)
        Rendering effective routemaps, Agrawala & Stolte (pdf)
        Artistic resizing, Dragicevic et al. (acm)
        Adaptive grid-based document layout, Jacobs et al. (acm)
        Map labeling bibliography
    Demonstrations:
        Excentric labels

Week 7
M Nov 6: Deconstructing Visualizations
    Submit Reading Response | Slides

    Due (before class): Final Project (proposal)
    Required readings:
        Revision: Automated Classification, Analysis and Redesign of Chart Images.Savva et al.. (html)
        Graphical Overlays: Using Layered Elements to Aid Chart Reading. Kong and Agrawala. (html)
    Optional readings:
        Deconstructing and Restyling D3 Visualizations. Harper and Agrawala. (html)
        Extracting References Between Text and Charts via Crowdsourcing. Kong et al. (html)

W Nov 8: Color
    Submit Reading Response | Slides

    Required readings:
        Color and information, In Envisioning Information, E. Tufte
        Color Naming Models for Color Selection, Image Editing and Palette Design. Heer and Stone. (html)
        Color guidelines, Brewer, (html)
    Optional readings:
        The crayola-fication of the world. Bhatia. (html)
        A rule-based system for assisting color map selection, Bergman, Treinish, Rogowitz, (pdf)
        Charting color from the eye of the beholder. Landa, Fairchild. (pdf)
        Color2Gray: Salience-preserving color removal. Gooch, Olsen, Tumblin, Gooch. (pdf)
    Demonstrations:
        ColorBrewer2
        Bruce Lindbloom’s Useful color information, studies, and files
        Meet iCam: A Next-Generation Color Appearance Model

Week 8
M Nov 13: Project Progress Presentations I
    Submit Presentation Responses (repeat for each presentation) | Slides
  • Anika Benons & Sergio Sardar
  • Hope Casey-Allen
  • Cristian Lara
  • Vig Sachidananda
  • Jack Reidy
  • Megan Tinley Wilson
  • Berk Coker
  • Alyssa Vann
  • Soltan Malekghassemi
  • Fyza Parviz
  • David Mora
  • Heather Kramer & Janna Huang
  • Bronson Duran & Robert Fearon & Noam Habot
  • Kali Cornn
  • Gracie Young & Xin Jiang
  • Jay Patel
W Nov 15: Project Progress Presentations II
    Submit Presentation Responses (repeat for each presentation) | Slides
  • Basel Al Sharaf & Trina Sarkar
  • Danny Diekroger
  • Juliette Love
  • Sophia Pink
  • James Lyons
  • Jinglin Shan & Kristy Duong
  • Joshua Morris
  • Da Eun Kim & Sharon Chen
  • Amy Chen
  • Junjie Zhu & Qian Zhao
  • Jianqing Yang
  • Diego Hernandez
  • Ross Daly & Leonard Truong
  • Greg Ramel
  • Na He Jeon, Mattieu Rolfo, Karen Wang
  • Albert Feng & Pakapark Bhumiwat
  • Jesik Min


Thanksgiving Week
M Nov 20: No class due to Thanksgiving
W Nov 22: No class due to Thanksgiving


Week 9
M Nov 27: Graph Layout
    Submit Reading Response | Slides

    Required readings:
        Graph Visualization: A Survey. Herman, Melancon, Marshall. (pdf)
        Hierarchical Edge Bundles. Holten. (ieee)
    Optional readings:
        Let’s draw a graph. Khoury. (html)
        Visual Exploration of Multivariate Graphs. M. Wattenberg. (pdf)
        Improving Walker’s Algorithm to Run in Linear Time. Buchheim, Jünger & Leipert. (pdf)
        Dig-cola. Dwyer & Koren. (pdf)
        A Technique for Drawing Directed Graphs. Gansner, Koutsofios, North, Vo. (pdf)
    Demonstrations:
        Visual Complexity - graph visualization gallery

W Nov 29: Network Analysis
    Submit Reading Response | Slides

    Required readings:
        Centrality and Prestige of Social Network Analysis. (pp. 169-198) Wasserman & Faust. (pdf)
        Balancing Systematic and Flexible Exploration of Social Networks. Perrer and Shneiderman (pdf)
    Optional readings:
        The Structure and Function of Complex Networks (Sections 1 and 2 only pp. 1-8). Newman. (pdf)
        The Social Organization of Conspiracy. Baker & Faulkner. (pdf)

Week 10
M Dec 4: Animation
    Submit Reading Response | Slides

    Required readings:
        Animated Transitions in Statistical Data Graphics. Heer and Robertson. (html)
        The Value of Visualization. Van Wijk. (pdf)
    Optional readings:
        Animation: Can it facilitate? Tversky, Morrison and Betrancourt. (pdf)
        Visualization Research Challenges. NIH/NSF Research Report. Johnson et. al. (pdf)
        Principles of Traditional Animation Applied to Computer Animation. Lasseter (acm)
        Intuitive Physics. McCloskey. (pdf)
        Representing motion in a static image. Cutting. (pdf)

W Dec 6: Final Project Presentations


Textbooks


  1. The Visual Display of Quantitative Information (2nd Edition). E. Tufte. Graphics Press.
  2. Envisioning Information. E. Tufte. Graphics Press.

Your best bet is to order them online.
Please order soon. Readings will be assigned in the first week of class.


Teaching Staff


Instructor: Maneesh Agrawala
    Office Hours: 2-3pm Fridays, Gates 364 and by appointment
Course Assistant: Alec Glassford
    Office Hours: 3:30-4:30pm Wednesdays, Lathrop Lounge and by appointment
Course Assistant: Zach Maurer
    Office Hours: 3:15-4:15pm Mondays, Lathrop Lounge and by appointment

To contact us please use Piazza. This is the fastest way to get a response.


Assignments and Requirements


Class Participation (10%)
Assignment 1: Visualization Design (10%)
Assignment 2: Exploratory Data Analysis (15%)
Assignment 3: Creating Interactive Visualization Software (25%)
Final Project (40%)

Late Policy: For assignments we will deduct 10% for each day (including weekends) the assignment is late.

Plagiarism Policy: Assignments should consist primarily of your original work, building off of others’ work–including 3rd party libraries, public source code examples, and design ideas–is acceptable and in most cases encouraged. However, failure to cite such sources will result in score deductions proportional to the severity of the oversight.