CS 7295: Special Topics Course / Information Visualization

Syllabus

Spring 2023

Instructor: John Alexis Guerra Gómez

Full Course Syllabus PDF

Description

The purpose of Data Visualization is to discover insights from data, not just produce pretty pictures. In this course we will cover both the theory behind producing insightful data visualizations, as well as the practical components on how to create them. At the end of this course you will be able to:

Design efficient and insightful data visualizations based on perception theories and best practices from the research community.
Implement insightful and interactive, could based data visualizations using D3, Vega-Lite or Tableau.
Use a systematic approach for abstracting data analysis and visualization problems based on what and why is being visualized, and how is being represented. This will allow you to choose the right visualization for the tasks and data at hand beyond simple subjective rules of thumb.
Judge data visualizations based on their ability to help the target users address the proposed tasks on the data.
Conduct basic usability experiments to evaluate the value of a visualization with real users.
Work with real world clients on real world data problems to help them generate insights

Weekly Schedule

Week	Date	Topic	Tech Videos	Homeworks	Final Project
1	01/11	Class welcome and logistics Introduction Readings: CH1 VAD	Web Development Basics for Visualization ObservableHQ: From nothing to an interactive tree visualization in 20 mins Introduction to D3 with Observable Introduction to Vega-Lite for Observable Introduction to Tableau
2	01/18	What we visualize Readings: CH2 VAD	Javascript Fundamentals for Information Visualization Introduction to Observable's not Javascript Data files for dataviz: JSON vs CSV Array operations, map, filter, reduce and above Nesting, Pivoting and Folding in JavaScript Tableau for Nesting, Folding and Pivoting Data	HW1 Adapting communitie's visualizations
3	01/25	Why we visualize Readings: CH3 VAD	SVG, the building blocks of dataviz on the web Introduction to web Canvas for visualization Webgl for even more performant data visualizations Setting up D3 for Observable and local development Setting up the Vega-lite Javascript API for Observable and beyond Setting up Tableau
4	02/01	How we visualize Readings: CH5 VAD	D3 v6 Selections explained Translating Marks and Channels visualization theory to practice with D3 Translating marks and channels visualization theory to practice with the Vega-Lite JS API Translating Marks and Channels Visualization theory to practice with Tableau Calculated Fields, Level of Detail (LOD) Functions	HW2 Basic Vega-Lite Viz
5	02/08	Rules of thumb Readings: CH6 VAD	D3 v6 Data Binding explained using Observable Towards reusable d3 v6 charts on Observable Vega-Lite API custom charts How to use D3 path to generate lines, areas, shapes and more Other scales in D3: scaleSqrt, scaleTime, scalePoint and more D3: Creating a Histogram step by step D3 Stack and other layouts	HW3 Visualization Problem Abstraction
6	02/15	Tabular, Multidimensional Data Readings: CH7 VAD	Using D3 for creating a donut chart step by step Creating a Donut Chart with Vega-Lite API Creating stacked and radial charts in Tableau		Select team and topic
7	02/22	Temporal Data	Using D3 with temporal data How to create a D3 heatmap from scratch Creating temporal visualizations with Vega-Lite API Visualizing temporal data with Tableau	HW4 Multidimensional data
8	03/01	Midterm recap Midterm	Visualizing Node-Link Networks with D3 v6 and Observable Visualizing Node-Link Networks with Vega-Lite-API, D3 and Observable Network Visualization with Tableau (and D3 + Observable) Using color in D3 Working with color in Vega-Lite API Working with Color in Tableau		Initial proposal (15%)
9	03/08	Spring Break
10	03/15	Networks and Color Readings: CH9 and CH10 VAD	Visualizing Trees with D3 v6 and Observable Visualizing Trees with Vega-Lite API Visualizing Trees with Tableau Visualizing Geo with D3 Using Vega-Lite for Maps and Geographical Data Visualizing Maps with Tableau and Mapbox	HW5 Temporal
11	03/22	Trees and Geo Readings: CH8-10 VAD	D3 Transitions and animations in Observable Animations with the Vega Lite API on Observable	HW6 Networks
12	03/29	Evaluation Readings: CH10-14 VAD	How to create a scrolly-telling visualization D3 Faceting visualizations into multiple views Vega-Lite API faceting into multiple views Tableau faceting into multiple views	HW7 Trees
13	04/05	Manipulating Views Readings: CH11 VAD	How to implement crossfiltering across charts in Observable Filtering attributes and items in Javascript Tableau Data Preparation		Project progress report and presentation (20%)
14	04/12	Faceting Readings: CH12 VAD			Usability Study Result (25%)
15	04/19	Reducing Advanced Concepts
Finals week	04/26				Project presentation/Blog/Demo (40%)

Slack Workspace infovis-neu.slack.com

All the class' messages are going to be sent using our Slack workspace. Students are encouraged to use slack to ask questions, coordinate and collaborate. Some guidelines:

Use #general for general issues, questions etc.
Use #project for proposing projects and requesting approval. All projects must be approved by the teacher.
Only the teaching assistants and the professor should create threads on #announcements. This channel is used for major announcements.
Use #random for sharing random stuff.

Videos and Lectures

For previous iterations of this course I have pre-recorded more than 60 technical videos where I show how to go from the theory concepts to actual visualizations using D3, the Vega-Lite API and Tableau.

There are also some recordings (in Spanish) of previous lectures

Grading

Concept	%
Participation	15%
Midterm	15%
Final project	30%
Homeworks	40%