Lessons from "Storytelling with data" by Cole Nussbaumer
Academics have (unfortunately) been known to be quite terrible sometimes at presenting their findings. Yet presentation skills are game-changing with regards to how the audience will listen to your talk. So having dug into data visualization a bit, here are some of the lessons I retrained from “Storytelling with data” by Cole Nussbaumer (which I highly recommend).
How to focus the audience’s attention?
The audience has about 3–8 seconds of attention, during which time we decide whether to continue to look at what is in front of us or direct our attention to something else.
Remove clutter
“Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.” Antoine de Saint-Exupéry, Airman’s Odyssey
Following Gestalt principles of visual perception, are perceived as a group objects with:
Proximity (physically close)
Similarity (similar in colour, shape, size, orientation, etc.)
Enclosure (physically enclosed with lines or background colour, etc.)
Closure (fitting a recognizable shape, even if parts are missing -ie: dashed)
Continuity (similar to closure)
Connection (physically connected)
$\Rightarrow$ The mind naturally creates logic from visual cues. So remove anything that take up space and mental load but doesn’t add information.
Exploit position on page
Without visual cues, we typically start at the top left of our visual and do zigzagging “z’s” with our eyes across the page.
$\Rightarrow$ Put important things at the top
Use preemptive attributes
Example of preemptive attributes (taken from "Storytelling with data" by Cole Nussbaumer).
$\Rightarrow$ Draw the attention quickly to a specific area
$\Rightarrow$ Create a visual hierarchy of information $\rightarrow$ gives explicit instruction on how to process information
Note: Be mindful that highlighting one point can make other points less visible.
Some design concepts
Good design fades in the background and gets un-noticed.
Well‐designed objects are easy to interpret and understand.
Affordance
Make it obvious how the product is to be used.
Accessibility
Make it usable/understandale by people of diverse abilities (ie: varying technical skills).
If there is a conclusion you want your audience to reach, state it in words.
Annotate important or interesting points directly on graph.
Aesthetics: Ensuring visual order
More aesthetic designs seem easier to use than less aesthetic designs. Aesthetically pleasing visuals increases audience’s tolerance to design issues.
Creating a sense of visual organization using:
Colour (have a strategic use of contrast)
Alignment
White space (preserve white space)
Acceptance
An effective design must be accepted by its intended audience.
A practical guide to preparing presentations
Telling a story
1. Capture big idea
What do you need audience to know?
2. Write headline to create the story flow
Each headline should be the title of a slide.
3. Repeat message
Tell audience what you’re going to tell them: Add a summary with each bullet corresponding to a headline in order
Tell audience: The content of the slides
Summarize what you just told them: Repeat main points in conclusion
4. Self‐reinforce all information
On each given slide (title should connect with content, text with visuals)
Improving the visuals
1. Select appropriate visual
Simple text for one or two numbers
Table to communicate to mixed audience with different interests (across rows)
Line graphs for continous data Note: Avoid secondary axes in graphs. Instead label directly data with values (to emphasize specific numberss), or pull apart vertically to create new axis (to emphasize general trend).
Bar graphs for categorical data
2. Eliminate clutter (only keep the data):
Remove chart borders, gridlines, data markers and text (title and legend)
Change background (x & y‐axis lines, labels) colour to grey $\rightarrow$ Colour stands out more against grey than black
Use pre-emptive attributes to draw attention to specific points in the data supporting claim.
Use colour sparingly and consistently $\rightarrow$ Same colour layout across avoids confusion
4. Improve accessibility
Use simple text (easy to read) to make graph title
Add axis titles
Be colour-blind friendly Note: Blue and orange alternative for green and red for most colour-blind people.
5. Improve aesthetics
Align elements (right or left -justified). ie: align title, legend, vertical y‐axis title at the top left $\rightarrow$ audience knows how to read the graph before getting to the data
Avoid diagonal element
Preserve white space ie: for bar graphs, bar width should be greater than white space between the bars