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 into “readings for Tuesday” and “readings for Friday” (to go along with lectures and discussions). 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.

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).

The topic for this week’s readings is Abstraction - especially data abstraction.

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. 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.

4. 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.

Optional

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. 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.

3. 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.

4. 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 isa 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.

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.

Short version:

1. For Tuesday’s online discussion posting, read about some visualization toolkit of your choosing
2. For Friday’s posting (probably after the guest lecture), read about D3 and Vega-Lite, and look at a Vega-Lite tutorial
3. Strongly recommended: read about Draco, since it is a glimpse of the future

Note that this “readings” list is part of the reading itself. Even the The Week in Vis 05 (Mon, Sep 28-Fri, Oct 2): Implementation (class-content) is content.

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.

To add to the specialness of the week: we’ll have a Guest Lecturer, Prof. Dominik Moritz from CMU. Dominik was a central part of several of the systems/toolkits we’ll learn about and will be able to give us a good perspectives on the basic ideas and rationales for various systems.

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 (e.g., 80% of the class said they’ve used matplotlib), 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 strongly 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.

The first 3 things are required. The Munzner chapters are fairly short.

This year, reading 3 is required and reading 4 is optional. In the past I had it the other way around.

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).

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).

Reading 4 is optional, but I strongly recommend at least skimming through it as it provides many examples, and many different things you might consider in choosing a scalability solution.

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.

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).

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.

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.

This week, you’ll be attending the Vis Conference virtually Attending the Vis Conference (IEEE Vis 2020) Virtually.

The instructions on how to attend ( Details about IEEE Vis 2020 for Class) will give you instructions on what to watch and read. The focus is on watching (although, all of the papers are available).

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.

In preparation for our guest on Friday, you are required to watch a talk that he gave at the Open Vis Conference in 2018. I put it last because it is connected with the end of the week, it could fit in either before or after the other readings.

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.

If reading 3 chapters of Ware is too much, I would say Chapter 3 is the least important of all of the readings.

1. Visual Queries (Chapter 1 of Visual Thinking for Design) (Ware-1-VisualQueries.pdf 2.5mb)

2. What We Can Easily See (Chapter 2 of Visual Thinking for Design) (Ware-2-EasilySee.pdf 2.1mb)

3. Structuring Two Dimensional Space (Chapter 3 of Visual Thinking for Design) (Ware-3-StructuringSpace.pdf 2.6mb)

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

   Cairo’s non-scientific take on visual cognition.

5. 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.

6. 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.

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

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.

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)

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

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)