In our first discussion, we will learn about our collective background and experiences. Then, we will introduce course objectives, structure, deliverables, and tools. Finally, we will consider benefits of storytelling and communication in applied analytics, and briefly introduce workflow and software (e.g., R and Python) for the visualization component of the course.
Data visualization is the presentation of data as graphical encodings. In this discussion, we will introduce a purpose for data visuals. Then, we consider various components and ways of thinking about their construction, including use of coordinate systems, data encodings, the grammar of graphics. Once we consider the basics of these components, we will practice identifying and using them while exploring data related to our class example case study.
Spencer, “Data in Wonderland,” secs. 2–2.1.2.3.
Jacques Bertin, Semiology of Graphics: Diagrams Networks Maps (Redlands: ESRI Press, 2010).
Christian Leborg, Visual Grammar (Princeton Architectural Press, 2004).
Scott Spencer, “Demonstration of Layers in Graphics” (Columbia University., March 2020).
Edward R. Tufte, The Visual Display of Quantitative Information, Second (Graphics Press, 2001).
Hadley Wickham, “A Layered Grammar of Graphics,” Journal of Computational and Graphical Statistics 19, no. 1 (January 2010): 3–28, https://doi.org/10.1198/jcgs.2009.07098.
Leland Wilkinson, The Grammar of Graphics, Second (Springer, 2005).
Continuing our discussion on visual channels for encoding, this session we will focus on three channels of color: hue, chroma (saturation), and luminance. Then, we consider empirical studies on the effectiveness in using encodings and their limitations. Third, we will consider elements of design we can use for our data graphics. Finally, we will practice these concepts.
So far, we’ve been concerned with understanding tools and language for mapping or encoding data to visual channels of graphics. In this discussion, we’ll begin to shift our focus from exploring data with graphics to explaining those graphics. Specifically, we consider our audience in redesigning exploratory graphics for purposes of communication, discuss how to address complexity of graphics for an audience, and begin to more substantially consider graphics as driving a narrative. We’ll begin with annotating graphics, and creating a hierarchy of information.
Annotated graphics sometimes stand-alone. But graphics can also benefit from, and add value to, written narrative. Here, we will explore elements of writing, work through example memos as a means of communicating an idea for a data analytics project to an analytics executive. As a group exercise, we will revise an analytics proposal writeup for a new audience.
In a multimodal document, tables and data-driven graphics can add context and illustrate the text, and vice versa. Here, we begin to draw from prior discussions in both data graphics and written narrative. We will consider how to apply visual design to a multi-component document containing text and data, and integrate text and visual information.
We will discuss how layout design and typography can work together to integrate visuals with narrative content, and will enable a deeper exploration of data-driven visual design.
Spencer, “Data in Wonderland,” sec. 1.4.
Matthew Butterick, “Butterick’s Practical Typography” (https://practicaltypography.com/, 2018).
Jane E. Miller, “Organizing Data in Tables and Charts: Different Criteria for Different Tasks,” Teaching Statistics 29, no. 3 (August 2007): 98–101, https://doi.org/10.1111/j.1467-9639.2007.00275.x.
We’ve discussed the importance of comparison and context, whether communicating with words, visual encodings of data, or both. We’ll discuss combining graphics together and within a larger narrative to communicate context, uncertainty, and variation.
We will continue discussing the elements of effective business writing for a particular audience and purpose, and learn about the role of revision and getting feedback on your writing.
Spencer, “Data in Wonderland,” secs. 1.2–1.3.
Daniel Kahneman, Thinking, Fast and Slow (Farrar, Straus and Giroux, 2013).
Joshua B. Miller and Andrew Gelman, “Laplace’s Theories of Cognitive Illusions, Heuristics and Biases,” Statistical Science 35, no. 2 (May 2020): 159–70, https://doi.org/10.1214/19-STS696; Joshua B. Miller and Andrew Gelman, “Rejoinder: Laplace’s Theories of Cognitive Illusions, Heuristics and Biases,” Statistical Science 35, no. 2 (May 2020): 175–77, https://doi.org/10.1214/20-STS779.
In our discussion, we consider the foundations of modern user interaction in the context of data-driven, visuals and narratives. Such interactions may include scrolling, overview, zoom, filter, details-on-demand, relation, history, extraction; brushing and linking; hovering; clicking; selecting; and gestures. Part of allowing interaction results in authors having less control over the intended narrative and, thus, may think about interaction as giving the audience some level of co-creation in the narrative.
Spencer, “Data in Wonderland,” secs. 3–3.1.
Fred Hohman et al., “Communicating with Interactive Articles,” Distill 5, no. 9 (September 2020): 10.23915/distill.00028, https://doi.org/10.23915/distill.00028.
Jessica Hullman and Andrew Gelman, “Designing for Interactive Exploratory Data Analysis Requires Theories of Graphical Inference,” Harvard Data Science Review, no. 3.3 (July 2021), https://doi.org/10.1162/99608f92.3ab8a587.
Jessica Hullman and Andrew Gelman, “Challenges in Incorporating Exploratory Data Analysis into Statistical Workflow,” Harvard Data Science Review, July 2021, https://doi.org/10.1162/99608f92.9d108ee6.
B. Shneiderman, “The Eyes Have It: A Task by Data Type Taxonomy for Information Visualizations,” in Proceedings 1996 IEEE Symposium on Visual Languages (Boulder, CO, USA: IEEE Comput. Soc. Press, 1996), 336–43, https://doi.org/10.1109/VL.1996.545307.
Jeffrey Heer and Ben Shneiderman, “Interactive Dynamics for Visual Analysis: A Taxonomy of Tools That Support the Fluent and Flexible Use of Visualizations,” Queue 10, no. 2 (February 2012): 30–55, https://doi.org/10.1145/2133416.2146416.
Interactivity is inherently technology dependent. We discuss modern approaches to interactivity as related to data-driven, visual graphics and narratives. As such, we will introduce a modern technology stack that includes html
, css
, svg
, and javascript
, within which technologies like d3.js
(a javascript library) and processing
operate. Most award-winning interactive graphics, especially from leading news organizations, use this stack.
But we can enable interactivity through interfaces, too, from R
and Python
interactive and markdown notebooks and code, to htmlwidgets
, Shiny
, and plotly
. Then, we have drag-and-drop alternatives like Lyra2
or Tableau
. While Tableau
is functionally much more limited, a use-case for Tableau may be, for example, when a client has a license for it, wants basic interactivity for someone else to setup the visual with interactive options. The range of tools is becoming ever larger. More generally, knowing a range of tools will help us not only build our own interactive graphics, but will also help us work with specialists of these technologies.
From our discussions of the principles and tools of interactivity with data graphics, and ways we can give them organization, we begin considering how to include these tools and concepts to guide our audience in our communications. How should be think about organizing interactive graphics? Would a “dashboard” or “scrollytelling” be useful? Does it depend on our audience and their goals? How should we guide our readers both through the graphics and in their use of interactivity? Consider the ideas and examples from our readings.
Spencer, “Data in Wonderland,” secs. 3.2–3.3.
Tominski and Schumann, Interactive Visual Data Analysis, sec. 4.
Joe Attardi, Modern CSS: Master the Key Concepts of CSS for Modern Web Development, 2020.
Jon Duckett, HTML & CSS, Design and Build Websites (Wiley, 2011).
David Gohel and Panagiotis Skintzos, Ggiraph: Make ’Ggplot2’ Graphics Interactive, Manual, 2021.
S. McKenna et al., “Visual Narrative Flow: Exploring Factors Shaping Data Visualization Story Reading Experiences,” Computer Graphics Forum 36, no. 3 (June 2017): 377–87, https://doi.org/10.1111/cgf.13195.
Pascal Schneiders, “What Remains in Mind? Effectiveness and Efficiency of Explainers at Conveying Information,” Media and Communication 8, no. 1 (March 2020): 218–31, https://doi.org/10.17645/mac.v8i1.2507.
Ramnath Vaidyanathan et al., Htmlwidgets: HTML Widgets for r, Manual, 2020.
In this lecture, we’ll continue discussing interactive communication. First, we’ll peek inside the tech of scrollytelling as a form of communication. Then, we’ll consider how to adjust our communications when we combine verbal with the visual, like in presentations.
Now, for the last few weeks, we’ve been working hard to learn an entire stack of technologies that, taken together, enable interactivity in our communications. And this builds on all the best practices we’ve already been diligently practicing. I’m certain that the last couple of weeks has been a challenge to become more proficient with these tools, and that’s made it an accomplishment just to get these things working, much less creating all kinds of different views. In this discussion, we will consider how to help one another through user-centered, content design, and pairwise prototyping.
Find individual assignments in the menu bar at the top.
Find group project deliverables in the menu bar at the top.