← Ayaan M. Kazerouni

CSC 477 Scientific and Information Visualization

This page is under construction.

Contents

• Info and important links
• Learning objectives
• Assignments
• Resources
• Classroom conduct and climate
  • Academic honesty
  • Using AI in this course
  • Classroom climate
• Course schedule
• Acknowledgements

What we’ll learn. Data visualization is one means of helping humans make sense of vast quantities of data. Well-designed visualizations can replace slower cognitive calculations with much faster perceptual inferences, improving comprehension, memory, and decision-making. Conversely, poorly-designed visualizations can (intentionally or unintentionally) make decision-making more difficult or inaccurate.

In this class, we’ll learn how to design expressive and effective visualizations. We’ll study techniques for creating 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 Vega-Lite and D3 (data-driven documents).

Info and important links

• Instructor: Ayaan M. Kazerouni
• Email: ayaank@calpoly.edu
• Office hours: See my homepage
• Canvas
• EdStem forum (see the invite link in Canvas)
• Course schedule (Check this frequently!)

Learning objectives

• Visualization preparation and design. Data collection, wrangling, and choice of abstraction to be presented in a visualization.
• Visualization idioms and design guidelines. Making effective use of visual channels like position, size, and colour in common graph types like scatterplots and barcharts as well as more “unusual” ones, like this, rooted in empirical evidence from disciplines like graphic design and perception.
• Interactive visualization. Visualizations don’t always answer questions; sometimes they help you discover them. Interactivity is key to this exploratory process.
• Visualization evaluation processes. Faced with a visualization, created by ourselves or others, how should we go about evaluating it?
• Visualization implementation tools. We’ll use Vega-Lite, a grammar of interactive graphics, to create most of the visualizations in this class, and will also explore D3 (data-driven documents) for building more custom graphics and Tableau for rapid GUI-based exploratory visualization.
• (Non-)Deceptive visualization. We will learn how people and organizations lie with visualization, and how not to do it ourselves.

Assignments

The course will involve roughly 1.5-weekly assignments that exercise what we talk about in class, and a 3-part final project, worked on in teams. The Class participation portion of the grade will be based on completion of in-class activities and discussions, and attendance on important class days (such as prototype walkthroughs).

The grade breakdown is as follows:

• Class participation (10%)
• Assignments (60%), made up of:
  • Assignment 1: Visualization Curation and Analysis (5%)
  • Assignment 2: Data wrangling with JavaScript (5%)
  • Assignment 3: Expository Visualization (15%)
  • Assignment 4: Interactive visualization (15%)
    • + Peer review (5%)
  • Assignment 5: Ethical and deceptive visualization (10%)
  • Assignment 6: Practice with D3 (5%)¹
• Project (30%), in 3 parts:
  • Part 1: Initial proposal (5%)
  • Part 2: Prototype (10%)
  • Part 3: Final interactive deliverable (15%)

At the end of the quarter, I will round UP your final numerical score²and turn that into a letter grade using the following grading scale:

• A >= 93
• A– >= 90
• B+ >= 87
• B >= 83
• B– >= 80
• C+ >= 77
• C >= 73
• C– >= 70
• D+ >= 67
• D >= 63
• D– >= 60
• F < 60

Resources

There is no official textbook for the course, but we will frequently refer to material from the following sources, generously shared publicly by the authors listed below.

• Visualization Curriculum, a set of notebooks from Jeffrey Heer, Dominik Moritz, Jake VanderPlas, and Brock Craft.
• Visualization Analysis and Design, a graduate-level text book by Tamara Munzner. The linked page points to per-chapter summaries on YouTube.

Additionally, you will frequently refer to the following online documentation:

• JavaScript API reference (Mozilla Developer Network)
• Observable Notebooks documentation
• Arquero API reference and Notebook collection
• Vega-Lite documentation and the Vega-Lite JS API

Finally, each class day links to readings/resources for that day.

Classroom conduct and climate

Academic honesty

Work you turn in must be your own. Although I encourage you to have lively discussions with one another, all work you hand in must be your own work, unless otherwise specified. Programs will be compared using software that can reliably detect similarities in source code. Evidence that your program or parts of your program are plagiarized from another student or an unapproved source will be taken seriously. At minimum, you will receive a 0 for the assignment, and potentially also an F in the class and report filed with the Office of Student Rights and Responsibilities.

You have a number of resources at your disposal to help you succeed in this course (your peers, myself, online sources), and I am usually willing to work with you on flexible deadlines. If you feel you need to plagiarize in order to succeed, know that you almost certainly have other options. Just come talk to me!

Using AI in this course³

✅ You MAY use AI (ChatGPT, etc.) to help you program or implement visualizations. Prompts like: Why isn’t this code showing the data? How do I increase the size of points in this plot? How do I extend the x-axis using Vega-Lite? What does this error mean? Show me an example of… Those are all okay! But if you choose to use AI, there are two things you must know:

1. You must state that you used it in a comment in your code (I used ChatGPT to help with…)
2. You are responsible for any mistakes that it makes. It will make mistakes or mislead you on occasion. You can’t blame the AI if you get something wrong.

🛑 You MAY NOT use AI to help you make design decisions, make critiques, or generate writing about visualizations. Why? There is a lot of advice out there that is just flat out wrong with respect to years of visualization research. There is also a lot of advice that ignores the context of diverse communities who need to understand data (disability, access to technology, education, etc.). AI is likely going to amplify some of that bad advice, and we shouldn’t be complicit in it. We need to be careful and critical about our designs. So using ChatGPT (or similar programs) here is not permitted.

✅ You MAY use AI to help you polish writing. Some AI tools like Grammarly can help students find grammatical or clarity errors in their writing. That is perfectly fine. The key difference is creation (not okay) vs. refinement (okay). Again, you are responsible for any mistakes or even more serious issues of plagiarism that are possible when using AI.

Classroom climate

All members of this class are expected to contribute to a respectful, welcoming, and inclusive environment for everyone. I expect us to strive to build a community in which:

• We are not code snobs. We do not assume knowledge or imply there are things that somebody should know.
• After our own work is complete, we support one another’s learning by sharing our expertise generously if invited to do so.
• We consistently make the effort to actively recognise and validate multiple types of contributions to a positive classroom environment.
• We strive to contribute meaningfully to group work.

Course schedule

This is a tentative course schedule. I expect to update it frequently as the quarter progresses.

Assignments will appear in Canvas with deadlines. If deadlines in Canvas conflict with those listed here, the Canvas deadlines take precedence.

The READINGS/RESOURCES column contains links to items that you are expected to read or watch outside of class.

• 🎥 Videos about data visualization related to the day’s topic.
• 📜 Readings, which may be papers or online articles.

Additionally, it links to the following resources meant as reference material:

• 💻 Slides and 📊 Notebooks that I present in class.
• Documentation for the various tools we’ll use.

Acknowledgements

This course’s materials are adapted from those shared publicly by Jeffrey Heer, Jon Froehlich, Tamara Munzner, and Evan Peck.