Field note / motion graphics / motion design / information design
Designing Motion for Data Visualization
How I use animation to add meaning and clarity to data visualizations rather than just making them move.
- Published
- Dec 27, 2019
- Length
- 3 min read / 520 words
- Topics
- motion graphics, motion design, information design
Data visualization motion is one of the areas where animation is most often applied gratuitously and least often applied thoughtfully. Charts growing from zero, bars animating in sequence, pie slices spinning into place — these are standard behaviors that have become so familiar they've stopped communicating anything.
Motion in data visualization should answer a question: what does seeing this data change over time tell us that seeing it static doesn't?
When Motion Adds Information
Motion adds genuine value to data visualization in specific cases:
Showing change over time: If the data is temporal — how a value changes over a period — showing it as an animation that moves through time is a natural and powerful choice. The motion is a metaphor for the time passing.
Showing the data being built: When the audience needs to understand that data is the result of accumulation — votes being counted, results being compiled, a total being reached — building the chart through animation reflects the actual process.
Drawing attention to specific values: A chart where the data changes to highlight one specific value — a bar that separates from the others, a line that moves to a different position — uses motion to direct focus in a way that color or size alone can't.
Comparison over multiple states: Animating between two chart states (before and after, baseline and comparison) can make the difference between them more legible than showing them side by side.
When Motion Adds Nothing
Motion doesn't add value when it's applied to a static dataset just to make it look dynamic. A bar chart that grows from zero on entrance tells the viewer nothing about the data that the final static chart doesn't tell them — the animation is theater, not communication.
In fact, entrance animations on charts can reduce comprehension — they make the viewer wait for the data to reveal itself instead of presenting it immediately.
The Transition Is the Information
When I animate a chart that shows a change in data — a value increasing, a comparison shifting — the transition itself needs to be legible. The viewer needs to track where each data element starts and where it ends. This requires deliberate attention to the path and pacing of each element during the transition.
Staggering transitions — animating elements one at a time rather than simultaneously — makes individual changes easier to track. Giving each element time to resolve before the next begins allows the viewer to follow the story.
Designing for Context
Data visualization motion almost always lives in a specific context: a presentation, a video essay, a broadcast segment, a digital publication. Each context has different requirements for pace, duration, and level of detail in animation.
A chart in a live presentation needs to be simple and fast — the presenter is narrating, and the animation is a visual aid, not the main event. A chart in a video essay can be more elaborate — the animation is part of the storytelling.