The world is awash with increasing amounts of data, and we must keep afloat with our relatively constant perceptual and cognitive abilities. Visualization provides one means of combating information overload, as a well-designed visual encoding can supplant cognitive calculations with simpler perceptual inferences and improve comprehension, memory, and decision making. Furthermore, visual representations may help engage more diverse audiences in the process of analytic thinking.
In this course we will study techniques and algorithms for creating effective visualizations based on principles from graphic design, perceptual psychology, and cognitive science. Students will learn how to design and build interactive visualizations for the web, using the Vega-Lite and D3.js (Data-Driven Documents) frameworks.
In addition to class discussions, students will complete visualization design and data analysis assignments, as well as a final project. Students will share the results of their final project as both an interactive website and a video presentation.
Textbooks
-
Interactive Data Visualization for the Web, 2nd Edition. Scott Murray, O'Reilly Press.
- To read online, use the "O'Reilly (Formerly Safari)" link on the UW library page.
- Code examples available on GitHub.
- Vega-Lite Visualization Notebook Curriculum. Jeffrey Heer, Dominik Moritz, Jake VanderPlas, and Brock Craft.
Learning Goals & Objectives
This course is designed to provide students with the foundations necessary for understanding and extending the current state of the art in data visualization. By the end of the course, students will have gained:- An understanding of key visualization techniques and theory, including data models, graphical perception, and methods for visual encoding and interaction.
- Exposure to a number of common data domains and corresponding analysis tasks, including multivariate data, geo-spatial data, and networks.
- Practical experience building and evaluating visualization applications.
Schedule & Readings Show short citations.
Week 1
- ASSIGNED Assignment 1: Visualization Design (Due: Mon 4/5)
- REQUIRED Notebook: Introduction to Vega-Lite.
- REQUIRED Chapter 1: Information Visualization. Stuart Card, Jock Mackinlay, and Ben Shneiderman. Readings in Information Visualization. 1999.
- OPTIONAL Decision to Launch the Challenger. Edward Tufte. Visual Explanations. 1997.
- SECTION CSE 412 Section 1: Data Wrangling
- REQUIRED Notebook: Data Transformation.
- REQUIRED Introducing Arquero: A JavaScript library for query processing and data transformation.
- OPTIONAL Wrangler: Interactive Visual Specification of Data Transformation Scripts. Sean Kandel, Andreas Paepcke, Joseph M. Hellerstein, and Jeffrey Heer. ACM CHI. 2011.
- OPTIONAL Research Directions in Data Wrangling: Visualizations and Transformations for Usable and Credible Data. Sean Kandel, Jeffrey Heer, Catherine Plaisant, Jessie Kennedy, Frank van Ham, Nathalie Henry Riche, Chris Weaver, Bongshin Lee, Dominique Brodbeck, and Paolo Buono. Information Visualization. 2011.
-
REQUIRED
Chapter 3 in Interactive Data Visualization for the Web, 2nd Edition. Scott Murray.
Either read or skim depending on your comfort level with HTML, CSS, and JavaScript. - OPTIONAL A Tour through the Visualization Zoo. Jeffrey Heer, Michael Bostock, and Vadim Ogievetsky. ACM Queue. 2010.
Week 2
-
DUE TODAY
Assignment 1: Visualization Design
- ASSIGNED Assignment 2: Exploratory Data Analysis (Due: Mon 4/19)
- REQUIRED Polaris: A System for Query, Analysis and Visualization of Multi-dimensional Relational Databases. Chris Stolte, Diane Tang, and Pat Hanrahan. IEEE TVCG. 2002.
- OPTIONAL Voyager: Exploratory Analysis via Faceted Browsing of Visualization Recommendations. Kanit Wongsuphasawat, Dominik Moritz, Anushka Anand, Jock Mackinlay, Bill Howe, and Jeffrey Heer. IEEE TVCG. 2016.
Week 3
- REQUIRED Multidimensional Detective. Alfred Inselberg. IEEE InfoVis. 1997.
- OPTIONAL A Rank-by-Feature Framework for Interactive Exploration of Multidimensional Data. Jinwook Seo and Ben Shneiderman. Information Visualization. 2005.
- OPTIONAL Techniques for Flexible Responsive Visualization Design. Jane Hoffswell, Wilmot Li, and Zhicheng Liu. ACM CHI. 2020.
- REQUIRED Narrative Visualization: Telling Stories with Data. Edward Segel and Jeffrey Heer. IEEE InfoVis. 2010.
- REQUIRED Chapters 2, 4, 5 in Interactive Data Visualization for the Web, 2nd Edition. Scott Murray.
- OPTIONAL Reinventing Explanation. Michael Nielsen. 2014.
Week 4
- DUE TODAY Assignment 2: Exploratory Data Analysis
- ASSIGNED Assignment 3: Ethical & Deceptive Visualization (Due: Mon 5/3)
- REQUIRED Notebook: Interaction.
- REQUIRED Interactive Dynamics for Visual Analysis. Jeffrey Heer and Ben Shneiderman. 2012.
- OPTIONAL The Death of Interactive Infographics? Dominikus Baur. 2017.
- OPTIONAL In Defense of Interactive Graphics. Gregor Aisch. 2017.
- REQUIRED Chapters 11, 12 in Interactive Data Visualization for the Web, 2nd Edition. Scott Murray.
- REQUIRED Easing Functions Cheat Sheet.
- OPTIONAL Animated Transitions in Statistical Data Graphics. Jeffrey Heer and George Robertson. IEEE InfoVis. 2007.
- OPTIONAL Effectiveness of Animation in Trend Visualization. George Robertson, Roland Fernandez, Danyel Fisher, Bongshin Lee, and John Stasko. IEEE InfoVis. 2008.
- OPTIONAL Gemini: A Grammar and Recommender System for Animated Transitions in Statistical Graphics. Younghoon Kim and Jeffrey Heer. IEEE InfoVis. 2021.
- REQUIRED Ethical Dimensions of Visualization Research. Michael Correll. ACM CHI. 2019.
- OPTIONAL The Work that Visualisation Conventions Do. Helen Kennedy, Rosemary Lucy Hill, Giorgia Aiello, and William Allen. Information, Communication & Society. 2016.
- OPTIONAL Useful Junk? The Effects of Visual Embellishment on Comprehension and Memorability of Charts. Scott Bateman, Regan L. Mandryk, Carl Gutwin, Aaron Genest, David McDine, and Christopher Brooks. ACM CHI. 2010..
Week 5
- ASSIGNED Final Project (Multiple Due Dates)
- REQUIRED 39 Studies About Human Perception in 30 Minutes. Kennedy Elliott. 2016.
- OPTIONAL What Makes a Visualization Memorable? Michelle A. Borkin, Azalea A. Vo, Zoya Bylinskii, Phillip Isola, Shashank Sunkavalli, Aude Oliva, and Hanspeter Pfister. IEEE InfoVis. 2013.
- OPTIONAL Beyond Memorability: Visualization Recognition and Recall. Michelle A. Borkin, Zoya Bylinskii, Nam Wook Kim, Constance May Bainbridge, Chelsea S. Yeh, Daniel Borkin, Hanspeter Pfister, and Aude Oliva. IEEE InfoVis. 2015.
- SECTION CSE 412 Intro to Git & Web Handout
- SECTION HTML/CSS Demo GitHub Repository
- REQUIRED Color Use Guidelines for Data Representation. Cynthia Brewer. Section on Statistical Graphics, American Statistical Association. 1999. Color Scheme Explorer.
- REQUIRED How to pick more beautiful colors for your data visualizations. Lisa Charlotte Rost. 2020.
- OPTIONAL D3 color scales: d3-scale-chromatic
- OPTIONAL Somewhere Over the Rainbow: An Empirical Assessment of Quantitative Colormaps. Yang Liu and Jeffrey Heer. ACM CHI. 2018.
- OPTIONAL Colorgorical: Creating Discriminable and Preferable Color Palettes for Information Visualization. Connor Gramazio, David Laidlaw, and Karen Schloss. IEEE TVCG. 2017.
- OPTIONAL Color Crafting: Automating the Construction of Designer Quality Color Ramps. Stephen Smart, Keke Wu, Danielle Albers Szafir. IEEE TVCG. 2020. Try it online!
Week 6
- DUE TODAY Assignment 3: Ethical & Deceptive Visualization
- ASSIGNED Assignment 3b: Peer Evaluation (Due Mon 5/10)
- REQUIRED Chapters 6, 7, 8 in Interactive Data Visualization for the Web, 2nd Edition. Scott Murray.
- OPTIONAL Critical Reflections on Visualization Authoring Systems. Arvind Satyanarayan, Bongshin Lee, Donghao Ren, Jeffrey Heer, John Stasko, John R. Thompson, Matthew Brehmer, and Zhicheng Liu. IEEE InfoVis. 2020.
- REQUIRED Chapters 9, 10 in Interactive Data Visualization for the Web, 2nd Edition. Scott Murray.
- OPTIONAL D3: Data-Driven Documents. Michael Bostock, Vadim Ogievetsky, and Jeffrey Heer. IEEE InfoVis. 2011.
Week 7
- DUE TODAY Assignment 3b: Peer Evaluation
- REQUIRED Notebook: Cartographic Visualization.
- OPTIONAL Chapter 14 in Interactive Data Visualization for the Web, 2nd Edition. Scott Murray.
- OPTIONAL Chapter 11: The Cartogram: Value-by-Area Mapping. Borden D. Dent. Cartography: Thematic Map Design. 1990.
- SECTION Notebook: Introduction to D3, Part 2.
Week 8
- REQUIRED The Barnes-Hut Approximation: Efficient computation of N-body forces. Jeffrey Heer. 2017.
- OPTIONAL Scalable, Versatile and Simple Constrained Graph Layout. Tim Dwyer. EuroVis. 2009.
- OPTIONAL SetCoLa: High-Level Constraints for Graph Layout. Jane Hoffswell, Alan Borning, and Jeffrey Heer. EuroVis. 2018.
- OPTIONAL Use the Force! Michael Bostock. 2011. (Video)
- OPTIONAL d3-force. Michael Bostock.
- DUE TODAY Final Project: Initial Prototype
- REQUIRED imMens: Real-time Visual Querying of Big Data. Zhicheng Liu, Biye Jiang, and Jeffrey Heer. EuroVis 2013.
- REQUIRED Falcon: Balancing Interactive Latency and Resolution Sensitivity for Scalable Linked Visualizations. Dominik Moritz, Bill Howe, and Jeffrey Heer. ACM CHI. 2019.
- OPTIONAL Dynamic Prefetching of Data Tiles for Interactive Visualization. Leilani Battle, Remco Chang, and Michael Stonebraker. SIGMOD. 2016.
- OPTIONAL Trust, but Verify: Optimistic Visualizations of Approximate Queries for Exploring Big Data. Dominik Moritz, Danyel Fisher, Bolin Ding, and Chi Wang. ACM CHI. 2017.
Week 9
- REQUIRED The Visual Uncertainty Experience. Jessica Hullman. OpenVis Conf. 2016.
- REQUIRED Error Bars Considered Harmful: Exploring Alternate Encodings for Mean and Error. Michael Correll and Michael Gleicher. IEEE InfoVis. 2014.
- OPTIONAL Visual Semiotics & Uncertainty Visualization: An Empirical Study. Alan MacEachren, Robert Roth, James O'Brien, Bonan Li, Derek Swingley, and Mark Gahegan. IEEE InfoVis. 2012.
- OPTIONAL When(ish) is My Bus? User-centered Visualizations of Uncertainty in Everyday, Mobile Predictive Systems. Matthew Kay, Tara Kola, Jessica Hullman, and Sean Munson. ACM CHI. 2016.
Week 10
Week 11 - Finals Week
- DUE TODAY Final Project: Deliverables
Assignments
- Class Participation 10%
- Assignment 1: Visualization Design 10%
- Assignment 2: Exploratory Data Analysis 15%
- Assignment 3: Ethical & Deceptive Visualization 20%
- Assignment 3b: Peer Evaluation 5%
- Final Project 40%
Individual Assignments: The three course assignments are all individual assignments. You are welcome to ask questions of the instructor and/or TAs during office hours, and you may also ask general questions on the Ed discussion board to receive answers from staff and students.
Team Project: The final project should be completed in teams of 3-5 people, and therefore encourages collaboration on all parts of the project. All team members will receive the same grade for the assignment, but team members will be asked to catalog their individual contributions to ensure an equitable devision of labor across the team.
Class Participation
It is important to attend the lectures (or if you are unable to attend during class time, to watch the recordings after they are posted) and read the readings. Each lecture will assume that you have read and are ready to discuss the day's readings.
Class participation includes both in-lecture activities (as is feasible) and engagement on the course discussion site (Ed). Up through week 8, all enrolled students are required to submit at least 1 substantive discussion post per week related to the course readings or lecture material. Each student also has 1 free pass for skipping the discussion and quiz.
Good comments typically exhibit one or more of the following:
- Critiques of arguments made in the papers
- Analysis of implications or future directions for work discussed in lecture or readings
- Clarification of some point or detail presented in the class
- Insightful questions about the readings or answers to other people's questions
- Links and commentary for web resources or examples that pertain to a lecture or reading
In addition, we will post short quizzes to reinforce important concepts. The quizzes are not graded (your score on a quiz will not affect your course grade), but you are required to complete the quiz as part of your course participation.
Policies
Late Policy: We will automatically deduct 10% for each day an assignment is late. Please contact the instructors well in advance to request an extension if needed.
Plagiarism Policy: Assignments should consist primarily of 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.
Religious Accommodation: Washington state law requires that UW develop a policy for accommodation of student absences or significant hardship due to reasons of faith or conscience, or for organized religious activities. The UW's policy, including more information about how to request an accommodation, is available here: Religious Accommodations Policy. Accommodations must be requested within the first two weeks of this course using the Religious Accommodations Request form.
Resources
See the resources page for a general list of visualization tools, related web sites, and software development tips to support your work in this class.
Q&A
General questions should be posted on the course discussion site (Ed). If you have a private question, please email the instructors at cse412-staff [at] cs [dot] washington [dot] edu or discuss it privately during office hours.
Acknowledgments
The material for this course have been adapted from classes taught by Jeffrey Heer here at the University of Washington, Arvind Satyanarayan from the Massachusetts Institute of Technology, and Niklas Elmqvist at the University of Maryland, College Park.