Syllabus

Scott Spencer https://ssp3nc3r.github.io (Columbia University)https://sps.columbia.edu/faculty/scott-spencer
2021-11-30

1 Lectures with discussion

1.1 Course overview: data analyses, visualization, narrative

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.

1.1.1 Resources

1.2 Data types; coordinate systems; visual encodings; the grammar of graphics

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.

1.2.1 Resources

1.3 Encoding with color; design principles; comparing encoded data

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.

1.3.1 Resources

1.4 From exploring to explaining: data-ink maximization; annotations; information hierarchy

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.

1.4.1 Resources

1.5 Elements of writing

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.

1.5.1 Resources

1.6 Numeracy in narratives — composition and layout

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.

1.6.1 Resources

1.7 Communicating context, uncertainty, and variation

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.

1.7.1 Resources

1.8 Effective business writing with audience analysis

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.

1.8.1 Resources

1.9 Foundations of interactive design

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.

1.9.1 Resources

1.10 Technologies and tools of interactive data-driven, visual design

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.

1.10.1 Resources

1.11 Interactive documents and multi-modal communications

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.

1.11.1 Resources

1.12 Processes of user-centered, content design — critiquing and pair-wise prototyping

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.

1.12.1 Resources

1.13 Group presentations

2 Individual assignments

Find individual assignments in the menu bar at the top.

Homework 1 — graphics

Homework 2 — graphics

Homework 3 — writing

Homework 4 — graphics

3 Group project

Find group project deliverables in the menu bar at the top.

Proposal

Interactive communication

Multimodal communication

Albers, Josef. Interaction of Color. Yale University Press, 2006.
Anderson, E. W., K. C. Potter, L. E. Matzen, J. F. Shepherd, G. A. Preston, and C. T. Silva. “A User Study of Visualization Effectiveness Using EEG and Cognitive Load.” Computer Graphics Forum 30, no. 3 (June 2011): 791–800.
Anscombe, F J. “Graphs in Statistical Analysis.” The American Statistician 27, no. 1 (February 1973): 17–21.
Arslan, Engin. Learn Javascript with P5.js: Coding for Visual Learners. New York, NY: Springer Science+Business Media, 2018.
Attardi, Joe. Modern CSS: Master the Key Concepts of CSS for Modern Web Development, 2020.
Bayles, David, and Ted Orland. Art & Fear. Observations on the Perils (and Rewards) of Artmaking. The Image Continuum, 1993.
Bellamy-Royds, Amelia, Kurt Cagle, and Dudley Storey. Using SVG with Css3 and Html5 : Vector Graphics for Web Design. O’Reilly, 2018.
Berinato, Scott. “Data Science & the Art of Persuasion.” Harvard Business Review, December 2018, 1–13.
Bertin, Jacques. Semiology of Graphics: Diagrams Networks Maps. Redlands: ESRI Press, 2010.
Booth, Wayne C, Gregory G Columb, Joseph M Williams, Joseph Bizup, and William T Fitzgerald. “Revising Style: Telling Your Story Clearly.” In The Craft of Research, Fourth. University of Chicago Press, 2016.
Boronine, Alexei. “Color Spaces for Human Beings.” HSLuv.org, March 2012.
Brady, Chris, Mike Forde, and Simon Chadwick. “Why Your Company Needs Data Translators.” MIT Sloan Management Review, March 2017, 1–6.
Bremer, Nadieh. Data Sketches A Journey of Imagination,Exploration, and Beautiful Data Visualizations. Milton, UNITED KINGDOM: A K Peters/CRC Press, 2021.
Butterick, Matthew. “Butterick’s Practical Typography.” https://practicaltypography.com/, 2018.
Caldeira, Joao, Alex Fout, Aniket Kesari, Raesetje Sefala, Joe Walsh, and Katy Dupre. “Improving Traffic Safety Through Video Analysis: Pulse Lab Jakarta.” Data Science for Social Good, 2018.
Caldeira, Joao, Alex Fout, Aniket Kesari, Raesetje Sefala, Joseph Walsh, Katy Dupre, Muhammad Rizal Khaefi, et al. “Improving Traffic Safety Through Video Analysis in Jakarta, Indonesia.” In Nd Conference on Neural Information Processing Systems NeurIPS, 1–5, 2018.
Chu, Tony. “Animation, Pacing, and Exposition.” OpenVis Conf 2016, May 2016.
Cleveland, William S, and Robert McGill. “Graphical Perception: The Visual Decoding of Quantitative Information on Graphical Displays of Data.” Journal of the Royal Statistical Society. Series A 150, no. 3 (1987): 192–229.
———. “Graphical Perception: Theory, Experimentation, and Application to the Development of Graphical Methods.” Journal of the American Statistical Association 79, no. 387 (September 1984): 531–54.
Doumont, Jean-Luc. “Effective Oral Presentations.” In Trees, Maps, and Theorems, 85–119. Effective Communication for Rational Minds. Principiæ, 2009.
———. “Effective Written Documents.” In Trees, Maps, and Theorems. Effective Communication for Rational Minds. Principiæ, 2009.
———. “Fundamentals.” In Trees, Maps, and Theorems. Effective Communication for Rational Minds. Principiæ, 2009.
Duckett, Jon. HTML & CSS. Design and Build Websites. Wiley, 2011.
Duckett, Jon, Gilles Ruppert, and Jack Moore. JavaScript & jQuery: Interactive Front-End Web Development. Indianapolis, IN: Wiley, 2014.
Fay, Colin, Vincent Guyader, Sebastien Rochette, and Girard Cervan. Engineering Production-Grade Shiny Apps. First edition. R Series. Boca Raton: CRC Press, 2021.
Gohel, David, and Panagiotis Skintzos. Ggiraph: Make ’Ggplot2’ Graphics Interactive. Manual, 2021.
Harris, Robert L. Information Graphics: A Comprehensive Illustrated Reference. New York: Oxford University Press, 1999.
Heer, Jeffrey, and Michael Bostock. “Crowdsourcing Graphical Perception: Using Mechanical Turk to Assess Visualization Design.” In Proceedings of the Sigchi Conference on Human Factors in Computing Systems, 203–12, 2010.
Heer, Jeffrey, 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.
Hohman, Fred, Matthew Conlen, Jeffrey Heer, and Duen Chau. “Communicating with Interactive Articles.” Distill 5, no. 9 (September 2020): 10.23915/distill.00028. https://doi.org/10.23915/distill.00028.
Hullman, Jessica, 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.
———. “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.
Janert, Philipp K. D3 for the Impatient: Interactive Graphics for Programmers and Scientists. First edition. Sebastopol, CA: O’Reilly Media, Inc, 2019.
Kahneman, Daniel. Thinking, Fast and Slow. Farrar, Straus and Giroux, 2013.
Kay, Matthew. Ggdist: Visualizations of Distributions and Uncertainty. Manual, 2021. https://doi.org/10.5281/zenodo.3879620.
Kelleher, John D, and Brendan Tierney. “What Are Data, and What Is a Data Set?” In Data Science. MIT Press, 2018.
Knaflic, Cole Nussbaumer. Storytelling with Data: Let’s Practice! Hoboken, New Jersey: John Wiley & Sons, Inc, 2019.
Ko, Amy J. “Design Methods: What Design Is and How to Do It.” Book. https://faculty.washington.edu/ajko/books/design-methods/, September 2020.
Koponen, Juuso, and Jonatan Hildén. Data Visualization Handbook. First. Finland: Aalto Art Books, 2019.
Leborg, Christian. Visual Grammar. Princeton Architectural Press, 2004.
Lupi, Giorgia. “Beautiful Reasons. Towards New Aesthetics for Data Narratives.” Medium. Accurat In Sight, January 2016.
———. DATA HUMANISM: The Revolution Will Be Visualized.” Print 70, no. 3 (2016): 76–85.
———. “Learning to See: Visual Inspirations and Data Visualization.” Medium. Accurat In Sight, January 2016.
———. “Sketching with Data Opens the Mind’s Eye.” Medium. Accurat In Sight, February 2016.
———. “The Architecture of a Data Visualization: Multilayered Storytelling Through "Info-Spatial" Compositions,” February 2015.
Maynard-Atem, Louise, and Ben Ludford. “The Rise of the Data Translator.” Impact 2020, no. 1 (January 2020): 12–14. https://doi.org/10.1080/2058802X.2020.1735794.
McKenna, S., N. Henry Riche, B. Lee, J. Boy, and M. Meyer. “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.
Meeks, Elijah. D3.js in Action. Second. Manning, 2018.
Meirelles, Isabel. Design for Information. An Introduction to the Histories, Theories, and Best Practices Behind Effective Information Visualizations. Rockport, 2013.
Miller, Jane E. “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.
———. “Seven Basic Principles.” In The Chicago Guide to Writing about Multivariate Analysis, Second edition., 13–33. Chicago Guides to Writing, Editing, and Publishing. Chicago: University of Chicago Press, 2013.
———. The Chicago Guide to Writing about Multivariate Analysis. Second edition. Chicago Guides to Writing, Editing, and Publishing. Chicago: University of Chicago Press, 2013.
Miller, Joshua B., 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.
———. “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.
Müller-Brockmann, Josef. Grid Systems in Graphic Design. A Visual Communication Manual for Graphic Designers, Typographers, and Three Dimensional Designers. ARTHUR NIGGLI LTD., 1996.
Murray, Scott. Interactive Data Visualization for the Web. Second. An Introduction to Designing with D3. O’Reilly, 2017.
Natario, Elaina, and Russell Goldenberg. “Easier Scrollytelling with Position Sticky.” The Pudding, June 2018.
Rahlf, Thomas. Data Visualization with R 111 Examples. S.l.: Springer Nature, 2019.
Reas, Casey, and Ben Fry. Processing A Programming Handbook for Visual Designers and Artists. Second. The MIT Press, 2014.
Richards, Sarah. Content Design. Content Design London., 2017.
Rost, Lisa Charlotte. “Complexity for the Experts; Simplicity for Everyone Else.” Lisa Charlotte Rost, February 2019.
Schneiders, Pascal. “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.
Schwabish, Jonathan. Better Presentations: A Guide for Scholars, Researchers, and Wonks. Columbia University Press, 2016.
Sharot, Tali. “(Priors) Does Evidence Change Beliefs?” In The Influential Mind. What the Brain Reveals about Our Power to Change Others. Henry Holt and Company, 2017.
Shneiderman, B. “The Eyes Have It: A Task by Data Type Taxonomy for Information Visualizations.” In Proceedings 1996 IEEE Symposium on Visual Languages, 336–43. Boulder, CO, USA: IEEE Comput. Soc. Press, 1996. https://doi.org/10.1109/VL.1996.545307.
Sievert, Carson. Interactive Web-Based Data Visualization with R, Plotly, and Shiny. Boca Raton, FL: CRC Press, Taylor and Francis Group, 2020.
Spencer, Scott. “Approximating the Components of Lupi’s Nobels, No Degrees.” P( Ssp3nc3r | Columbian ), March 2019.
———. “Data in Wonderland.” https://ssp3nc3r.github.io/data_in_wonderland, 2021.
———. “Demonstration of Layers in Graphics.” Columbia University., March 2020.
———. HSLuv: An R Package to Convert HSLuv Colorspace to RGB and Hex.” P( Ssp3nc3r | Columbian ), March 2020.
Storr, Will. Science of Storytelling. New York, NY: Abrams Books, 2020.
Tominski, Christian, and Heidrun Schumann. Interactive Visual Data Analysis. First. Boca Raton: CRC Press, 2020.
Tufte, Edward. “The Future of Data Science.” Seattle, Washington, 2016.
Tufte, Edward R. “Smarter Presentations and Shorter Meetings.” In Seeing with Fresh Eyes: Meaning, Space, Data, Truth, 151–61. Cheshire, Conn.: Graphics Press, 2020.
Tufte, Edward R. “Aesthetics and Technique in Data Graphical Design.” In The Visual Display of Quantitative Information, 176–90. Graphics Press, 2001.
———. Envisioning Information. Graphics Press, 1990.
———. “The Cognitive Style of PowerPoint: Pitching Out Corrupts Within.” In Beautiful Evidence. Graphics Press, 2006.
———. The Visual Display of Quantitative Information. Second. Graphics Press, 2001.
———. Visual Explanations. Images and Quantities, Evidence and Narrative. Graphics Press, 1997.
Vaidyanathan, Ramnath, Yihui Xie, JJ Allaire, Joe Cheng, Carson Sievert, and Kenton Russell. Htmlwidgets: HTML Widgets for r. Manual, 2020.
Ware, Colin. Information Visualization: Perception for Design. Fourth. Philadelphia: Elsevier, Inc, 2020.
Wickham, Hadley. “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.
———. “Create Elegant Data Visualisations Using the Grammar of Graphics Ggplot2.” https://ggplot2.tidyverse.org/, n.d.
Wickham, Hadley, Danielle Navarro, and Thomas Lin. Ggplot2: Elegant Graphics for Data Analysis. Third. Springer, 2021.
Wilke, C. Fundamentals of Data Visualization: A Primer on Making Informative and Compelling Figures. First edition. Sebastopol, CA: O’Reilly Media, 2019.
Wilkinson, Leland. The Grammar of Graphics. Second. Springer, 2005.
Yi, Ji Soo, youn ah Kang, John T Stasko, and Julie A Jacko. “Toward a Deeper Understanding of the Role of Interaction in Information Visualization.” IEEE 13, no. 6 (November 2007): 1224–31.
Zetlin, Minda. “What Is a Chief Analytics Officer? The Exec Who Turns Data into Decisions.” CIO, November 2017.
Zinsser, William. “The Lead and the Ending.” In On Writing Well, Sixth. The Classic Guide to Writing Nonfiction. Harper Resource, 2001.

References