NICAR16: Visualization designed for the human brain

Data visualizations must tell a good story. But even the best stories might get lost in the translation to a chart, infographic, or map and end up in the dreaded WTF Viz hall of fame. In a session called “Information design for the human brain,” BuzzFeed reporter Peter Aldhous and MediaShift metrics editor and curator Allie Kanik highlighted different ways of encoding data and shared their tips and tricks for deciding the appropriate visualization for a given story that can be easily understood by readers.

Understand the perceptual hierarchy of visual cues

“Data visualization is the encoding of data by visual cues,” Aldhous said. “But our brains do not treat those cues equally.” He outlined a spectrum of visual cues in terms of accuracy, with aligned length as the most accurate (think of a bar chart) and color hue as the most generic. In information design, different tasks will call for different moves up and down the perception hierarchy.

Our brains interpret different types of visualizations differently. Length tends to be associated with accuracy (bar charts), while color is less so.

Know the story you want to tell

Knowing the story you want to tell narrows down the options for your visualization. For example, column charts, dot and line charts, and line charts are all good for showing change over time. But each one accentuates different aspects of the story. A line chart shows the rate of change over time, a column chart shows more direct side-by-side comparisons, and a dot and line chart is the best of both worlds because it shows both the trend and allows for comparison of individual years.

Manik explained the importance of understanding the difference between sequential and spatial learning. She used a New York Times graphic to illustrate the use of sound and motion to perceive the proximity of finish times in different Winter Olympic sports. “Sound is understood by the brain in sequence,” Manik said. She also used animated GIFs as examples of conveying information in a sequential and repetitive way for learning and understanding. This is because loops help explain complicated lessons through repetition. (And they’re fun!)

Make compromises

Knowing what you want to illustrate with your data may mean making compromises. Aldhous showed the comparison of several counties regarding immunization in California kindergartens. With 58 counties, a dot-and-line chart is visually chaotic and overwhelming. A drop down the perceptual hierarchy uses color intensity to better represent the percentage of incomplete immunization across the state. In this case, the granular comparison is exchanged for an idea of the overall pattern. What is lost in terms of ease of perception is gained in the overview of the data. But you can get creative with additional graphics and visualizations. “You’re not limited to one visual encoding,” explained Aldhous.

While this image is accurate, it's much more difficult to decipher than the one below.

This graphic includes the same data as the one above, but is much easier to interpret thanks to smart design choices.

Don’t make our minds struggle so much

“Don’t make people’s brains work harder than they have to,” Kanik said. She and Aldhous both emphasized the importance of using color to both fit the data and make the interpretation of that data as automatic as possible. Choosing the right colors not only lightens the burden on readers, but it is also an important issue when designing for accessibility. Using tools like ColorBrewer ensures that your data visualizations also work for colorblind readers.

Keep it simple

While more complex visualizations like box plots may be good for those crunching the numbers and doing the analysis, they are typically too complex for readers. Supporting details and context are crucial for good information design. Annotations can go a long way for forming a story and guiding readers through the key points. Using white space gives time for the brain to process information.

Aldhous recommended sketching and experimenting with different encodings and visualizations in order to test them with different people. “They have to work instantaneously,” he said. He called for a shift from the mentality of “I’ve got this data, what’s the chart” to “I’ve got this data, what’s the story?” Because at the end of the day, the story is in the data.

About the author

Nicole Zhu

Undergraduate Fellow

Interested in visual storytelling and building products for news. Studying computer science and English at Northwestern.

Latest Posts

  • A Google Spreadsheets change affecting TimelineJS users

    Google recently changed something about their Sheets service which is causing many people to run into an error when they are making a new timeline. Note: there should be no impact on existing timelines! After this change, many of you click on the "preview" and get this message: An unexpected error occurred trying to read your spreadsheet data [SyntaxError] Timeline configuration has no events. There is a straightforward work-around, but it requires those of you who have...

    Continue Reading

  • How Americans think and feel about gun violence

    A man killed his wife, then himself. I want you to see his face and learn that he enjoyed fishing with his grandchildren. A small-time drug dealer is shot by two men in a parking lot. I find his Facebook profile and a photo shows him striking a playfully irreverent pose, giving the camera the middle finger. The photo’s comments take a mournful turn after a certain date. “Rest easy bro ???” Gun Memorial runs...

    Continue Reading

  • Software developers interested in journalism: Northwestern and The Washington Post want you!

    Northwestern University and The Washington Post are offering a unique opportunity for two talented software developers interested in applying their programming skills in media and journalism. Here’s the proposition: (1) a full-tuition scholarship to earn a master’s degree in journalism at Northwestern University, followed by (2) a six-month paid internship with The Post’s world-class engineering team, with the possibility of subsequent full-time employment. These opportunities are made possible by the John S. and James L....

    Continue Reading

  • What happened when Gun Memorial let anyone contribute directly to victim profiles

    If you’re reporting local or niche news, there’s a good chance that your audience collectively knows more about the story than you do. That’s especially true for us at Gun Memorial, a small publication with a nationwide mission of covering every American who is shot dead. In our latest, mostly successful, experiment, we let readers add to our stories without editor intervention. This article shares some lessons from that experience. Asking for reader contributions A...

    Continue Reading

  • How conversational interfaces make the internet more accessible for everyone

    This story is part of a series on bringing the journalism we produce to as many people as possible, regardless of language, access to technology, or physical capability. Find the series introduction, as well as a list of published stories here. In 2004, human-computer interaction professor Alan Dix published the third edition of Human-Computer Interaction along with his colleagues, Janet Finley, Gregory Abowd, and Russell Beale. In a chapter called “The Interaction,” the authors wrote...

    Continue Reading

  • Three tools to help you make colorblind-friendly graphics

    This story is part of a series on bringing the journalism we produce to as many people as possible, regardless of language, access to technology, or physical capability. Find the series introduction, as well as a list of published stories here. I am one of the 8% of men of Northern European descent who suffers from red-green colorblindness. Specifically, I have a mild case of protanopia (also called protanomaly), which means that my eyes lack...

    Continue Reading

Storytelling Tools

We build easy-to-use tools that can help you tell better stories.

View More