All Readings

First, reading over the course web (at least the stuff on the Getting Started (Start Here!) page) is an important part of the required readings. It’s a big part of the “What is this class and how does it work?” learning goal.

Second, the assignment descriptions and weekly reading lists really are readings themselves. I will relay content, and give some context for things you will read and do.

For the actual “content” readings.. The main goal here is to give you a sense of what visualization is. I want you to get some different perspectives, so you can form your own. This is the learning goal.

I’ve picked four things - one from me, two from textbooks, and some blog postings.

Note: in most weeks, the readings are divided to be read in relationship to the lectures. This week, everything is for the end of the week since it’s a short week.

Some of these are from textbooks (see the Books)). A secondary goal is to introduce you to the people you’ll be learning from this semester (including me!). I recommend reading things in this order.

1. My 1 - What Is Visualization and How do We Do It? page which echoes the introductory lecture.

   This will give you a sense of where I am coming from, and where we are going to.

   The What Is This Class and Why? is also an important part of this, but you should have read that already (it was required as part of the “first” thing up top).

   The other pages connected to this are also required reading: 2 - What does this Visualization make Easy to See? and 3 - A Simple Example: 4 Design Moves on a Table.

2. What we talk about when we talk about Visualization (Chapter 1 of The Truthful Art) (theTruthfulArtCh1.pdf 5.7mb) This will be your first exposure to Alberto Cairo’s books. These are discussed at Cairo: The Truthful Art and The Functional Art. A great place to start the class.

   For a great (but optional) introduction to Cairo’s style and philosophy, read the “Introduction” (which is before Chapter 1) (theTruthfulArtCh0.pdf 7.7mb).

3. What’s Vis? (Chapter 1 from Munzner’s Visualization Analysis & Design) (Munzner-01-Intro.pdf 0.3mb)

   This is the main textbook of the class, and is important to get the main ideas.

4. Two Blog Postings by Robert Kosara: What is Visualization? A Definition and The Many Names of Visualization.

   Read these to get a viewpoint different than mine. Robert is a visualization researcher at Tableau (and in academia before that).

Read formatted page...

The main readings are intended to give you a sense of why we do visualization, and why we bother to try to do it correctly. This “Why Visualize” question leads to the how. This week, we’ll also introduce the concept of critique - since it is such an important tool for design.

If you haven’t done the first week’s readings, please do them first.

The first part of the readings look at the “Why Vis” question from the “what can a visualization do” perspective. What are the reasons why we would choose to make a visualization?

The second part of “why” is “why does it work” or “why might a visualization be better than something else.” This gets at the perceptual and cognitive foundations. In the past, we did some readings in the second week to explore those. But it was a bit much - I’ll list them as optional at the end, but we’ll come back to those topics.

The second part of the readings talk about design process and critique. This is much more immediately practical: we will be doing a lot of critique in class.

This week, we’ll also talk about critique and redesign practice, since it is a primary tool we will use to learn about visualization. There are readings about that.

We’ll discuss “Why Vis” on Monday - so please do the first set of readings before lecture on Monday the 13th. We’ll discuss critique on Wednesday, so please read the critique readings before lecture on Wednesday the 15th.

I am listing the readings in the order that I suggest that you read them. So some optional readings come before the required ones.

Why Vis (Readings for Monday 9/13)

1. (optional) Why Visualize: From Information to Wisdom (Preface and Chapter 1 of The Functional Art) (online at publisher) (theFunctionalArtCh1.pdf 7.8mb)

   This is a great introduction to thinking about data presentation from a journalist’s perspective, with Cairo’s great use of examples, clarity, and connection to a bigger picture. It’s optional since it’s a little off topic (it’s more about Data Journalism), and a little redundant with the other Cairo readings. But it might feel weird to start with Chapter 3 (which is required, next).

2. The Beauty Paradox (Chapter 3 of Cairo’s The Functional Art) (theFunctionalArtCh3.pdf 11.4mb)

   This chapter gets into the philosophy of evaluation. Cairo has an interesting (and non-academic) perspective. We’re reading this now (rather than when we get to evaluation) because it’s good food for thought, and it has a good discussion of Tufte, so you’re prepared when you read him next.

3. Graphical Excellence (Chapter 1 of Tufte’s The Visual Display of Quantitative Information) (1-VDQI-1-GraphicalExcellence.pdf 33.8mb)

   Tufte’s fame, style and personality can get in the way of his message (see my discussion). Cairo (above on the list) will help us understand that. But, there’s no denying that Tufte has had influence - and there is a lot to learn from him.

   Once thing to note with Tufte: he makes his points through critique of examples. His conclusions don’t always follow, but he has nice examples. This chapter is Tufte at his best: good examples showing that visualization can work. Below, we’ll see Tufte at his worst.

And a strong recommendation for the optional readings below… I will talk about them in class (so you might read them after I mention them). Even just read the first few pages (the list of 12 points) of the Ware Chapter The Dance of Meaning (Chapter 9 of Visual Thinking for Design) (Ware-9-Meaning.pdf 2.7mb).

Critique and an Extra Why Vis Reading (for Wednesday 9/15)

We will be talking about how to critique and practicing critique in class. Usually, we just critique – but one of my goals in this class is to teach people to do it more effectively. These readings will hopefully give you some things to think about, although ultimately, I think it just takes practice.

1. Understanding Critique (Chapter 1 of Discussing Design by Adam Conor and Aaron Irizarry, O’Reilly Books, 2015). Chapter available online as a sampler from the publisher. (pp. 7-25, 18 pages)

   This is part of a whole book on how to critique productively.

2. Visual Statistical Thinking (Chapter 2 from Tufte’s Visual Explanations (pages 26-53; 27 pages). (3-VE-2-Visual-Statistical-Thinking.pdf 25.1mb)

   This used to be part of “Why Vis” - you visualize because it might save lives. Except that Tufte’s critiques are problematic. So an equally important lesson is how not to do critique.

   This is Tufte at his worst. He describes two historical examples. The point is historical examples where visualization could have saved lives (John Snow’s map of the London Cholera Epidemic and The Challenger Disaster). However, his oversimplification of the role of visualization in these situations makes his points forceful, but incorrect to the point of being unethical.

   The reading on redesign (below) will help us see his flawed critique practice. For (optional) interesting takes on how wrong he was (including the ethics issues) see Kosara’s blog and a more technical analysis by some engineering ethics writers (paper) (conference presentation). There’s also a great Freakanomics podcast that talks about the Challenger disaster (weblink) and makes it clear that a visualization wouldn’t have helped - no matter what Tufte tells Congress.

   But let this be a cautionary tale… critique and redesign are great tools for learning. But don’t forget that we have the benefit of knowing the answers. Hindsight makes a lot of things easier.

3. Design and Redesign ( Medium posting by Fernanda Viegas and Martin Wattenberg)

   The authors are two well known visualization researcher/practitioners who have worked together for years (they are now at Google). They use examples and explanations to show how critique and redesign can be an effective tool, and give advice on how to do it well.

   The reading has a great critique of Tufte’s Challenger chapter (above) that shows why it is not good criticism, and that his redesign isn’t good practice either. And they will give you advice on how to do it well.

   Unfortunately, they also give you some of the examples I like to use in class for practice. I guess I need to find new ones.

Optional for Now

These two readings are a crash course in the perceptual and cognitive foundations in visualization. They are important. But they are so important that adding them to this week is too much. So read them now if you’re curious - we’ll come back to them soon.

1. (optional for now) The Dance of Meaning (Chapter 9 of Visual Thinking for Design) (Ware-9-Meaning.pdf 2.7mb)

   Yes, we’re reading the last chapter first. It’s basically a summary of the book, followed by the implications - which makes it a pretty self-contained introduction to the perceptual motivations of visualization. It points out some things about how we see, and then tells us how that can help us make effective visualizations. It’s an unusual, informal book (see the discussion), we’ll read more of it later in the semester.

2. (optional for now) Information Visualization (The first 17 pages of the Introduction to “Information Visualization: Using Visualization to Think” by Card, Mackinlay, and Schneiderman) (01-InfoVis-CardMackinlaySchneid-Chap1.pdf 77.4mb).

   This is a 1999 book that consists of this intro, and a bunch of seminal papers. The examples are old, but the main points are timeless. It is the best thing I know of that gets at Vis from the cognitive science perspective. The rest of the chapter (past page 17) is good too, but more redundant with other things we’ll read – so it’s optional. Although, every time I go back to it, I am amazed how good this is - despite being old. The authors are the founders of the field.

   The section “How Visualization Amplifies Cognition” (starting on page 15), with Table 1.3 is particularly important. It really gets at why visualizations help us do things.

Read formatted page...

The topic for this week’s readings is Abstraction. There are a bunch of readings here, but its an important topic, and you need to see different ways to think about task abstraction because no one approach is sufficient. You need to use all of them.

Reading 1 is a historical introduction to abstractions (task and data). Readings 2 and 3 get at data abstraction. Readings 4,5 and 6 are three different ways to look at task abstraction. Each differently useful.

Yes, this is a big reading. But I don’t know what to cut. This is good practice for reading for the gist, rather than the details.

1. The eyes have it: a task by data type taxonomy for information visualizations. Ben Shneiderman, Proceedings of the 1996 IEEE Symposium on Visual Languages (pp. 336–343). (doi) (web pdf)

   This is a classic. Possibly one of the most influencial papers in the field. It’s old, and newer things are far more extensive. And the field has moved on from 1996 in many ways. But the initial thinking of abstracting data and task separately, and suggesting what those abstractions might be, really started here. The information seeking mantra is a classic notion. This paper is dated enough that it can be hard to read - but it is short.

2. What: Data Abstraction (Chapter 2 from Munzner’s Visualization Analysis and Design) (Munzner-02-DataAbstraction.pdf 1.1mb)

   A fairly dry description of the types of data. Don’t worry about trying to remember all the terms - you can always look them up when you encounter them again.

   Despite it’s length, the chapter skips a key concept: level of measurement for scales. You might have learned this in a stats class, but please understand the difference between “scale types” (nominal, ordinal, interval, ratio). Usable Stats has a simple introduction.

3. Forms and Functions (Chapter 2 of The Functional Art) (theFunctionalArtCh2.pdf 8.2mb).

   Cairo’s thinking about “the shape of data” is another way to think about data abstraction in a less academic way.

4. Why: Task Abstraction (Chapter 3 from Munzner’s Visualization Analysis and Design) (Munzner-03-TaskAbstraction.pdf 0.4mb)

   Figuring out how to think about tasks is important. This chapter (and the research paper it is derived from) focuses too much on trying to put every task in a neat organization. What’s important is to think about tasks. This is one way to do it, and it will help you learn to think about tasks. Don’t get too bogged down in all of her categories.

   We’re reading the book chapter, not the paper. If you’re going to work in the field, you might want to look at the paper A Multi-Level Typology of Abstract Visualization Tasks by Brehmer and Munzner, IEEE InfoVis 2013. The chapter is better, although the paper is notable for its extensive references and careful use of the terminology. If you want to read one paper, I recommend the Schulz et. al paper below for contrast.

5. Schulz, H.-J., Nocke, T., Heitzler, M., & Schumann, H. (2013). A Design Space of Visualization Tasks. IEEE Transactions on Visualization and Computer Graphics, 19(12), 2366–2375. (doi) (web pdf)

   This paper takes a quite different approach to Munzner in thinking about tasks. It came out at the same time as the paper behind the book chapter. It was literally in the same session of the conference. I actually find this to be a more useful way to think about task - it’s not as encyclopedic, but that’s a feature.

6. Amar, Eagan and Stasko. Low-Level Components of Analytic Activity in Information Visualization. InfoVis 2005. pdf doi

   An important paper because it tried to break down “analysis work” into low enough level tasks that can be named, and therefore designed for and evaluated. It is not a encyclopedic as things that come later - but that is a feature. In practice, we need to describe our task, well enough that we can design to address it. Having an encyclopedic taxonomy is useful for many reasons (it provides a vocabulary, a way to see similarities and differences, …). But its not the only thing.

   There is a more recent paper that basically takes this taxonomy and uses it to organization the perceptual science behind visualization. A Survey of Perception-Based Visualization Studies by Task gives a concise overview of Amar, Eagan & Stasko - and then uses it to organize the literature of perceptual studies to connect them to these tasks. You can look at that paper instead of the original (I was tempted to use it as a replacement), but the survey part does get a bit long.

Optional

Two optional papers. One shows the application of abstraction, while the second gives a more specific taxonomy.

1. Mackinlay, J., Hanrahan, P., & Stolte, C. (2007). Show me: automatic presentation for visual analysis. IEEE Transactions on Visualization and Computer Graphics, 13(6), 1137–44. (DOI) (pdf)

   This is a research paper, but it’s an unusual one. It’s easy to dismiss this paper as marketing for Tableau - but it really does give a sense of how good abstractions can help in choosing appropriate visualizations. It is timely, since Tableau will come up in class.

2. Sarikaya, A. and Gleicher, M. Scatterplots: Tasks, Data, and Designs. IEEE Transactions on Visualization and Computer Graphics, 24(1) — Jan 2018 . (web page)

   An recent paper that Alper (a former student) and I wrote. It focuses on a specific (but ubiquitous) kind of visualization, but thinks through the tasks and shows how thinking about the data properties and tasks helps suggest designs. I like this paper, but I am biased.

Read formatted page...

This week, the topic is Encodings. The Visual channels to which we can map data. These can be thought of as the building blocks from which visualizations are constructed. We’ll read about different encodings, and hopefully get a sense of why you might choose one over the other. And you’ll look at some standard designs and try to understand how they are put together from encodings.

Unfortunately, I don’t have a way to let you read the original source where the idea of basic encodings/visual variables were introduced (see Bertin's Books (Semiology of Graphics)).

The primary readings are three chapters that discuss the different encodings, and a classic paper they all refer to:

1. Marks and Channels (Chapter 5 from Munzner’s Visualization Analysis & Design) (Munzner-05-MarksAndChannels.pdf 0.4mb)

   A nice discussion of the main encodings, with information of how they differ and how to choose.

2. Arrange Tables (Chapter 7 from Munzner’s Visualization Analysis & Design) (Munzner-07-ArrangeTables.pdf 0.6mb)

   Position encodings are extra important and potentially more complex, so they get their own chapter. This chapter is particularly interesting because Munzner shows us how to break down a lot of standard (and some not so standard) charts into basic encodings. (note that we’ve skipped over Chapters 4 and 6 - we’ll come back to these).

3. Basic Principles of Visualization (Chapter 5 of The Truthful Art) (theTruthfulArtCh5.pdf 10.2mb)

   In some ways, this is redundant with Munzner - but I like it as a different perspective, less formal and less academic. It provides some thoughts on how to make practical use of the research literature (which we will look at).

4. Cleveland and McGill. Graphical Perception and Graphical Methods for Analyzing Scientific Data. Science 229(4716), 1985. (online library) (ClevelandMcGill85.pdf 1.3mb)

   This paper is referred to by Munzner, Cairo, and, well, everyone else. It’s the first rigorous attempt to understand how people perform at reading encodings. I think it’s important to see the original paper, so you know what they are talking about.

   There are many more recent papers that continue the tradition of trying to rigorously and empirically determine what works and doesn’t work. It’s become a whole genre. We’ll see more when we talk about evaluation and perception. See Heer&Bostock (optional, below) for a more modern take on this paper.

Optional

5. Crowdsourcing Graphical Perception: Using Mechanical Turk to Assess Visualization Design. Jeffrey Heer, Michael Bostock ACM Human Factors in Computing Systems (CHI), 203–212, 2010 PDF (607.4 KB)

   This paper is interesting since it recreates most of Cleveland and McGill as a Mechanical Turk study, with a much broader population. The presentation is much more modern (and easier to interpret). This could be a replacement for the original.

6. Visual Representation from Semiology of Graphics by Sheelagh Carpendale. Lecture slides/notes.

   A lot of the idea of encodings come from [Bertin](Bertin's Books (Semiology of Graphics)), but it’s too hard to read the original sources. Sheelagh Carpendale (a well known Vis professor) provides a great discussion in her slides that mix modern examples with Bertin.

7. Automating the Design of Graphical Presentations of Relational Information by Jock Mackinlay, ACM Transactions on Graphics, 1986.

   In an amazing 1986 system, Jock Mackinlay tried to automatically create charts from data. One of the key insights was to think about visualizations in terms of the basic encodings, which let him reason about these basic building blocks. His intuitions of what encodings were better/worse for different tasks was the beginning of trying to formalize this. He based this on his intuitions - but experiments show that he wasn’t too far off.

   In 1986 he was systematizing the design of visualizations - he had to have a systematic way to design, since he wanted to do it automatically! His approach is exactly what we are doing: considering visualizations in terms of encodings that can be reasoned about. Amazingly far ahead of its time.

8. Mackinlay, J., Hanrahan, P., & Stolte, C. (2007). Show me: automatic presentation for visual analysis. IEEE Transactions on Visualization and Computer Graphics, 13(6), 1137–44. (DOI) (pdf)

   This is from last week’s optional list. However, it shows how abstraction and encoding can be put together to make a cool system: Tableau. It is timely, since we are using Tableau in class.

Read formatted page...

Short version

1. Watch Dominick Moritz’s Guest Lecture
2. Read about some “high-level” visualization toolkit of your choosing
3. Look at the D3 paper (or some other thing about D3)
4. Go through the first 3 “chapters” of the UW (the other UW) visualization curriculumn.
5. Do some optional reading about something that interests you.

Note that this “readings” list is part of the reading itself.

Longer version

Reading about implementation is hard: everyone is likely to want to use a different tool, and for any tool, the best documentation is a moving target. What I really want to teach you is not any particular tool, but to give you a sense of what’s available and how you might choose amongst them. That’s what we’ll focus on in lecture.

Last year, I had a guest lecturer for this topic: Prof. Dominik Moritz from CMU. Dominik was a central part of several of the systems/toolkits we’ll learn about. He gave an amazing survey that connected the key ideas from class (abstraction and encodings) to a range of implementation choices.

Remote guest lectures were an upside to online pandemic teaching. This year, you just get to watch the video. (in Kaltura Mediaspace)

Readings are a little tricky, since I want you to learn “about” some tools, not necessarily to learn to use the tools (which is what most documentation is about). Also, I’d rather you learned about tools that are relevant to you (e.g., if you’re a Python programmer, it makes more sense to learn about Python toolkits, not just because you are likely to use them, but also you won’t get caught up in the language).

The learning goal is to see how there is a range of options for visualizations, and to get a sense of how you might choose between them:

1. Creating things by hand (literally, with pen and paper, but also figuratively, using manual drawing tools like Illustrator)
2. Standard Interactive Tools (Tableau, Excel, …)
3. High-Level Visualization (data) toolkits - (Matplotlib, plotly, Bokeh, …)
4. Low-Level Visualization (graphics) toolkits (D3, Processing, …)
5. Declaritive Specifications (Vega-Lite, …)

With #4 and #5, I want you to learn about D3 and Vega-Lite because they are useful to help think about the abstractions useful in creating visualizations.

For #1 and #2, there isn’t that much to read. Reading some of the technical papers about Tableau is optional (see optional readings below).

For #3: I’d like you to read over the documentation for some high-level visualization toolkit that you might want to use. I’ll let you pick. If you’re already using something, use this as an opportunity to learn about something new. The goal is not to learn to use this new tool, but to read enough of the basics of the documentation to understand it’s key ideas and abstractions.

If you need some ideas:

• Plot.ly - high level charting API for Python, R and JavaScript
• Bokeh - Python Graphing Library that provides high- and low-level control

You will need to do this reading for the online discussion posting due on Tuesday.

For #4 (low level libraries): I want you to learn about D3 (not necessarily to learn to use D3). Actually using D3 requires being an expert web programmer (see my 2015 rant about how hard it is for students to learn D3). However, it embodies a number of interesting concepts and ideas - and serves as the basis for almost everything else.

To learn about the ideas of D3, the D3 paper is an important starting point. It’s the “academic document” that tries to explain why D3 is what it is, and why it’s a good idea. It’s a weird mix of an academic CS paper with lots of specific implementation details (which are less common in academic CS papers). The paper really is the best way to get the rationale and the key ideas, you just have to skip over a lot of acronyms and buzz-words and JavaScript/Web browser details. It is not a way to learn how to use D3. Read the D3 paper, but don’t worry about the details.

Note: if you want to learn D3, there are lots of resources around the web. My recommendations are out of date.

For #5: I want you to learn about declarative specification approach. Vega-Lite is one that is very interesting, and is a mature enough system that you can use it for real things.

For the reading, I want you to learn about a more research oriented tool (Vega-Lite) that is valuable to learn about because it really illustrates the concepts we emphasize in class. The goal is not for you all to become Vega-Lite users (although you might want to), but to see enough about it that you can appreciate its ideas.

The “reading” for Vega-Lite is to do the first 3 “Chapters” of the UW Visualization Curriculum. (UW is the other UW, not us). It is strongly recommend that you watch the video first (its also linked in chapter 1). Reading the technical paper for Vega-Lite gets at the ideas more directly and is recommended (but optional).

Vega-Lite can either be used from Python (using a binding library called “Altair”), or directly inside of web pages. There are correspondingly, two versions of the curriculum. If you’re a Python programmer, choose the “Altair” version (you can either download the notebook, or run it online in “Colab”). If you prefer JavaScript or aren’t already a Python expert, use the “Obervable” version. There isn’t really any JavaScript programming involved.

Optional

More on Vega-Lite: If you want to learn more about Vega-Lite and declarative approaches, read the paper:

• Arvind Satyanarayan, Dominik Moritz, Kanit Wongsuphasawat, Jeffrey Heer. “ Vega-Lite: A Grammar of Interactive Graphics” IEEE Trans. Visualization & Comp. Graphics (Proc. InfoVis ‘16), 2017

The Future: The Draco system takes Vega-Lite a step farther: automating a lot of the decision making in visualization design by encapsulating design knowledge. See the (award winning) paper.

Read formatted page...

There are 4 required readings. The Munzner chapters are fairly short. The papers are somewhat light, especially since one of them is a survey (read it for the gist).

My comparisons paper (reading 3) generally gives you my thoughts on thinking about visualization in terms of comparison. It is the first place that the framework for thinking about scalability came up. In the paper, it is phrased in terms of comparison, but the ideas are more general (see reading 4). While sections 4 and 5 are the main pieces that deal with scale, I am having you read the whole paper now because I think it is useful in general (and this is the most logical place to put it). I believe that comparison is a generally useful way to think about visualization in general.

Our paper on Summary Visualization (reading 4) is a close up look at the scalability pieces introduced in the comparison paper. It tried to confirm that the three way categorization of scalability strategies from the earlier paper really covers everything we see in practice by doing a large survey. As a survey, it provides a lot of details and examples. It does introduce a fourth category, but mainly because it considers a broader range of things (it distinguishes reducing the number of items and number of dimensions, with comparison the latter is less relevant).

1. (required) Reduce Items and Dimensions (Chapter 13 from Munzner’s Visualization Analysis & Design) (Munzner-13-Reduce.pdf 0.4mb)
2. (required) Embed: Focus+Context (Chapter 14 from Munzner’s Visualization Analysis & Design) (Munzner-14-Embed.pdf 0.5mb)
3. (required) Considerations for Visualizing Comparisons, Michael Gleicher, Info Vis 2017 (TVCG 2018). (web)
4. (optional - but a skim through it is strongly recommended) Design Factors for Summary Visualization in Visual Analytics. Sarikaya, Gleicher and Szafir. (web) - This is a survey of different ways of doing summarization that appear in the visualization literature. There is a lot about how the survey was conducted, but the main thing for class is to see the different categories of summarization and how they interact.

Read formatted page...

Last week, we focused on scaling in the number of items. This week, we’ll talk about what to do when we have too many dimensions.

Unfortunately, we can’t discuss the mathematics and algorithms of dimensionality reduction in class. Which is too bad, since its useful and important and (in my mind) interesting. There are enough other classes that discuss it.

1. (required) High-Dimensional Visualizations. Georges Grinstein, Marjan Trutschl, Urska Cvek. (semantic scholar) (link1)

   This is an old (Circa 2001) paper that I am not sure was actually published at KDD. However, it is a great gallery of old methods for doing “High-Dimensional” (mid-dimensional by modern standards) visualizations. Most of these ideas did not stand the test of time - but it’s amusing to look through the old gallery to get a sense of what people were trying.

2. (required) The Beginner’s Guide to Dimensionality Reduction, by By: Matthew Conlen and Fred Hohman. An Idyll interactive workbook.

   This is a very basic demonstration of the basic concepts of dimensionality reduction. It doesn’t say much about the “real” algorithms, but you should get a rough idea if you haven’t already.

3. (required) How to Use T-SNE Effectively

   I wanted to give you a good foundation on dimensionality reduction. This isn’t it. But… it will make you appreciate why you need to be careful with dimensionality reduction (especially fancy kinds of it).

4. (left off in 2021, but required in the future) Understanding UMAP

   I like this as a way to explain the UMAP algorithm. It is a mix of the details, but also the intuitions. It is less important to understand UMAP, but more to get a sense of what these kinds of algorithms do.

I was going to suggest some optional readings for those of you who want to learn more about dimensionality reduction. There is a lot of great stuff the is visualization specific: techniques for using dimensionality reduction, approaches for user-controlled (supervised) dimensionality reduction, ways to visualize and interpret dimensionality reductions, … But there’s so much I don’t know where to start. If there is some topic that is interesting to you, make a posting on Piazza and I’ll give a recommendation on where to start.

If you’ve had an ML class, you might be wondering “what about X?” (where X is some more modern dimensionality reduction algorithm). Machine learning has made dimensionality reduction a hot topic recently, and there are a plethora of new methods to consider.

There is also a separate question of how to look at dimensionality reduced data. There are no required readings for this.

4. (optional) Julian Stahnke, Marian Dork, Boris Muller, and Andreas Thom. 2015. Probing Projections: Interaction Techniques for Interpreting Arrangements and Errors of Dimensionality Reductions. IEEE transactions on visualization and computer graphics 22, 1 (August 2015), 629–638. DOI: https://doi.org/10.1109/TVCG.2015.2467717

   This focuses on more basic dimensionality reductions (PCA), but it gets at many of the issues.

5. (optional) Florian Heimerl and Michael Gleicher. 2018. Interactive Analysis of Word Vector Embeddings. Computer Graphics Forum 37, 3 (June 2018), 253–265. DOI: https://doi.org/10.1111/cgf.13417 (online version)

   While this is specific to Word Vector Embeddings, I like it because it tries to get away from the “default” scatterplot designs.

6. [1]Florian Heimerl, Christoph Kralj, Torsten Möller, and Michael Gleicher. 2020. embComp: Visual Interactive Comparison of Vector Embeddings. IEEE Transactions on Visualization and Computer Graphics preprint, (December 2020). DOI: https://doi.org/10.1109/TVCG.2020.3045918 (online version)

   A recent paper I am quite proud of - dealing with the challenges of comparing embeddings. Again, a lesson here are the choices in how to do things other than scatterplots.

Read formatted page...

This week, you’ll be attending the Vis Conference virtually. Your assignment is to read the schedule and list of papers, look at the titles and abstracts, and to glance over a few papers.

Read more…

Interaction is one of those things that is best experienced, rather than read about. The readings will give you a lot of examples, and help to give you a framework for organizing your thinking around interaction. The optional reading is a really useful way to think about the tradeoffs in using interaction.

The first reading is a survey paper that provides a good way to organize many of the interactions we see in visualization, and provides lots of good examples.

1. (required) Interactive dynamics for visual analysis. Heer, J., & Shneiderman, B. (2012). Communications of the ACM, 55(4), 45. (pdf) (doi)

2. (required) Maniplate View (Chapter 11 from Munzner’s Visualization Analysis & Design) (Munzner-11-ManipulateView.pdf 0.5mb)

3. (required) Facet into Multiple Views (Chapter 12 from Munzner’s Visualization Analysis & Design) (Munzner-12-FacetMultipleViews.pdf 1.0mb)

   This isn’t specific to interaction, but it fits better here than anywhere else.

Optional (but highly recommended)

• Lam, H. (2008). A Framework of Interaction Costs in Information Visualization. IEEE Transactions on Visualization and Computer Graphics, 14(6), 1149–1156. (doi). (pdf link to Heidi’s page)

  I’ll use this paper to frame the discussion in class. It provides a good “why not add interaction” point of view.

Read formatted page...

Human vision is complex and fascinating (to me). Understanding it is beyond the scope of the class, but hopefully, you can learn some basics and see how it connects to visualization design. It’s so hard to pick just a small set of readings. I admit that this list starts to get long.

The most important “reading” is to watch a Steve Franconeri talk. He gave a virtual lecture on campus earlier this year, but the content is basically from the talk that he gave at the Open Vis Conference in 2018. This video is required.

1. Steve Franconeri. Thinking with Data Visualizations, Fast and Slow, Open Vis Conference Talk, 2018 (via YouTube).

The readings aren’t as plentiful as they might seem: the Ware and Cairo chapters are fairly light, and get the key points across (you don’t need as much of the details). You don’t need to read the Healy and Enns paper - just look at the demos. The 39 studies in 30 minutes posting is totally skimmable - it’s a 30 minute talk, but you can get the key ideas quickly.

The main readings are the Ware chapters, since it’s a good introduction to the basics of perception, and its impact on design. Chapter 6 of Cairo is useful because it considers “higher level” perceptual issues. I also include Cairo Chapter 5 (as optional) because it’s redundant with Ware, but it’s fun to see his (less scientific) take on it. And look at Chris Healy’s web page to get a sense of pre-attentive effects.

In prior years, I made #2 here a requirement early in the semester. This semester it was optional, multiple times. If you haven’t read it already…

2. The Dance of Meaning (Chapter 9 of Visual Thinking for Design) (Ware-9-Meaning.pdf 2.7mb)

   Yes, we’re reading the last chapter first. It’s basically a summary of the book, followed by the implications - which makes it a pretty self-contained introduction to the perceptual motivations of visualization. It points out some things about how we see, and then tells us how that can help us make effective visualizations. It’s an unusual, informal book (see the discussion), we’ll read more of it later in the semester.

After that, you should read more of Ware. If reading 3 chapters of Ware is too much, I would say Chapter 3 is the least important of all of the readings.

3. Visual Queries (Chapter 1 of Visual Thinking for Design) (Ware-1-VisualQueries.pdf 2.5mb)
4. What We Can Easily See (Chapter 2 of Visual Thinking for Design) (Ware-2-EasilySee.pdf 2.1mb)
5. (optional, but recommended) Structuring Two Dimensional Space (Chapter 3 of Visual Thinking for Design) (Ware-3-StructuringSpace.pdf 2.6mb)

After Ware and Franconeri, you might be interested in Cairo’s non-scientific take on visual cognition. Below in the optional section you can find his non-scientific take on perception.

6. Visualizing for the Mind (Chapter 6 of The Functional Art) (theFunctionalArtCh6.pdf 8.1mb)

Note for this next one: You can just look at the pictures and demos. Actually, this one is kindof optional since I will show most of the things in class.

7. (somewhat optional) Look at the pre-attention demos and pictures in the old version of Chris Healey’s web survey of perceptual principles for vis. The paper (optional, below) is much better in terms of explaining things - but it’s too much to require as reading.

This one is worth a skim. Yes, this list is getting long. But its so hard to cut.

8. 39 Studies about human perception in 30 minutes. By Kennedy Elliot. Medium Posting.

   This gives you the punch line of 39 different perception studies very quickly. What’s great about this is that it gets at “what can we learn from design from each of this.” While understanding the experiments is interesting (especially if you are a researcher trying to design new experiments), the basic takeaway is often what you need to influence design.

Perception: Optional

Perceptual science is a whole field, so we’re just touching the surface. Even just the beginnings of what is relevant to visualization. It’s hard for me not to require these…

• The Eye and Visual Brain (Chapter 5 of The Functional Art) (theFunctionalArtCh5.pdf 5.4mb) Optional - Cairo’s take on it. More based on his experience as a designer.

• Healey, C. G., & Enns, J. T. (2012). Attention and Visual Memory in Visualization and Computer Graphics. IEEE Transactions on Visualization and Computer Graphics, 18(7), 1170–1188. (pdf) (doi)

  This is a good survey of basic perception stuff that is useful for vis. In this past, this was required reading. Warning: this survey is a little dense, but it gets the concepts across with examples. Don’t worry about the theory so much. Get a sense of what the visual system does (through the figures, and the descriptions of the phenomena), and skip over the theories of how it does it (unless you’re interested). There is an older, online version as Chris Healy’s web survey which has lots of cool pre-attention demos. But the text in the paper is much better, and the paper includes more things.

• Franconeri, S. L. (2013). The Nature and Status of Visual Resources. In D. Reisberg (Ed.), The Oxford Handbook of Cognitive Psychology (pp. 1–16). Oxford University Press. (pdf) (doi)

  This is a survey, similar to Healey and Enns above, but written more from the psychology side. The first part, where he characterizes the various kinds of limitations on our visual system is something I’ve found really valuable. The latter parts, where he discusses some of the current theories for why these limitations happen is interesting (to me), but less directly relevant to visualization (since it is mainly trying to explain limits that we need to work around). I think these explanations may lead to new ideas for visualization – but its less direct of a path.

• Albers, D., Correll, M., Gleicher, M., & Franconeri, S. (2014). Ensemble Processing of Color and Shape: Beyond Mean Judgments. Journal of Vision, 14(10), 1056–1056. (paper page) (doi)

  We (Steve, myself, and some of our students) have written a survey paper on some other things the visual system can do (and why it can matter for vis). We call it “visual aggregation” and in psychology they call it “ensemble encoding.” It might be useful to skim through for the pictures and diagrams. I will talk about this stuff (at least the work that we did) in class.

Read formatted page...

Color is a surprisingly complex topic - and the complexities of perception and display have real impact on how we use it for Vis. There is some redundancy in these readings, but it’s hard for me to choose which ones are best. It’s probably OK to see it multiple ways. This is actually less reading than I’ve given in the past for the topic (see 2017 Color Readings). And there are so many recent and useful things…

1. Maureen Stone. Expert Color Choices for Presenting Data. (Stone-ColorChoices.pdf 0.3mb) (originally a web article).

   Maureen really is an expert on color. This is a good review of the basics, and then gets into why it’s important to get it right, and how to do it.

2. Color (Chapter 4 of Ware’s Visual Thinking for Design) (Ware-4-Color.pdf 2.8mb)

3. Map Color and Other Channels (Chapter 10 from Munzner’s Visualization Analysis & Design) (Munzner-10-MapColor.pdf 0.4mb)

   Color is really 10-10.3, 10.4 talks about other channels. It’s a good reminder.

4. Borland, D., & Taylor, R. (2007). Rainbow Color Map (Still) Considered Harmful. IEEE Computer Graphics and Applications, 27(2), 14–17. (rainbow-still-considered-harmful.pdf 0.7mb) (doi)

   The rainbow color map is still used (10 years after this paper). Understanding why you shouldn’t use it is a good way to check your understanding of color ramp design. However, there are lots of reasons you should use it (or a variant of it) that are discussed in more modern papers. The key point is to understand the issues.

   A more recent paper (Bujack et. al - optional below) gets at this in a more mathematical way, but it is overkill for class purposes.

5. Danielle Albers Szafir. “ Modeling Color Difference for Visualization Design.” IEEE Transactions on Visualization and Computer Graphics, 2018. In the Proceedings of the 2017 IEEE VIS Conference. (best paper award winner).

   This paper is really practical in that it shows how color science and modeling and be used to tell us what will and won’t work in visualization. It shows the value in careful experimentation and modeling. It’s a good fit because it focuses on color. And she’s my former student.

Color: Optional

We’ll talk about Color Brewer in class, but if you want to know the science about it:

• Cynthia Brewer. Color Use Guidelines for Data Representation. Proceedings of the Section on Statistical Graphics, American Statistical Association, Alexandria VA. pp. 55-60. (web) (Brewer_1999_Color-Use-Guidelines-ASAproc.pdf 1.5mb)

  The actual paper isn’t so important - it’s the guidelines she used in creating Color Brewer, which also tells us how to use it. What is more important is to actually check out ColorBrewer which is a web tool that gives you color maps. Understand how to pick color maps with it, and try to get a sense of why they are good.

  The irony is that this, one of the most important papers about color, wasn’t printed in color!

If you want a little more of how color science and vis come together.

• Bujack, R., Turton, T. L., Samsel, F., Ware, C., Rogers, D. H., & Ahrens, J. (2017). The Good, the Bad, and the Ugly: A Theoretical Framework for the Assessment of Continuous Colormaps. IEEE Transactions on Visualization and Computer Graphics, 24(1 (Proceedings SciVis)). (doi)

  This paper does a serious, deep dive into figuring out what makes a good or bad color ramp and making the intuitions mathematical. You can play with their tool for assessing color ramps.

In case you want a few other perspectives on color…

• Color and Information (Tufte’s Chapter 5 of Envisioning Information) (2-EI-5-ColorandInformation-small.pdf 4.3mb)

  Tufte is famously anti-color, except when he isn’t.

• Here are some postings from a design blog that give a nice tutorial that is a little more design oriented:

  • Color Theory for Designers, Part 1: The Meaning of Color
  • Color Theory for Designers, Part 2: Understanding Concepts and Terminology
  • Color Theory for Designers, Part 3: How to Create Color Schemes

Read formatted page...

There are four required “readings” for graphs (one is a video).

Note that for numbers 2 and 4 I do not expect you to read/watch the whole thing. Just look through it and get an idea of what the main points are.

If you’re interested in the layout algorithms, they are in the optional readings. Fortunately, they are implemented in various toolkits (although, they are interesting).

• Arrange Networks and Trees (Chapter 9 from Munzner’s Visualization Analysis & Design) (Munzner-09-ArrangeNetworks.pdf 0.9mb).

  This will get the basic ideas across.

• Tamara Munzner. 15 Views of a Node-Link Graph: An InfoVis Portfolio, Google TechTalks, Mountain View CA, 6/06. Talk video (Video on YouTube) (slides)

  Tamara Munzner gave a talk that gets across the point that there are many ways to show a graph. It gets the point across that there are lots of design choices and options. Plus, you’ll get a sense of the person behind the book (although, this was long ago). But, sitting through the hour is a bit much – so it’s OK to just watch a little bit and read through the slides.

• TreeVis.net has a huge number of visualizations of trees. Look at the pictures and try to get a sense of how many different ways there are to do this.

  Looking at this will help you get a sense of the range of opportunities.

• Gibson, H., Faith, J., & Vickers, P. (2013). A survey of two-dimensional graph layout techniques for information visualisation. Information Visualization, 12(3–4), 324–357. (doi) (author verson)

  This is an intimidating, long survey. Just skim over it to get a sense of the range of solutions. It is really good at pointing out the basic algorithms.

Optional

There is a lot out there. One good general source for background is the book “Handbook of graph drawing and visualization” - which you can find drafts of the chapters online. In particular, the Chapter on Force-Directed Layout (at least the beginning parts of it) gives a review of the classical algorithms.

• Kobourov, S. (2016). Force-Directed Drawing Algorithms. In Handbook of Graph Drawing (pp. 383–408). (pdf online)

For a modern algorithm for small to medium graphs:

• Dwyer, T. (2009). Scalable, Versatile and Simple Constrained Graph Layout. Computer Graphics Forum, 28(3), 991–998. (pdf) (doi)

  It’s a modern take on graph layout. It considers many aspects about what makes for a good layout, and uses real optimization methods to achieve them. The method gives a sense of the evolution and all the methods that came before it). This might be a little too CS-technical for most people. Don’t worry about the details of the algorithms, but get a sense of the kinds of things the best algorithms try to achieve. In practice, people usually use simpler algorithms (force-directed layout)

I wanted to find a survey paper that covered the more computational aspects (the layout algorithms). I haven’t found one that I like. Instead, I am recommending this paper. Read it to get a sense of what the basic methods are – don’t try to get at all the details and subproblems and … The Gibson survey above (under required) is probably better for the basics.

• von Landesberger, T., Kuijper, A., Schreck, T., Kohlhammer, J., van Wijk, J. J., Fekete, J.-D., & Fellner, D. W. (2011). Visual Analysis of Large Graphs: State-of-the-Art and Future Research Challenges. Computer Graphics Forum, 30(6). doi:10.1111/j.1467-8659.2011.01898.x (official version) (authors’s copy)

Read formatted page...