Timeline Storyteller

From Visualization Design Space to Deployment
Matthew Brehmer · mabrehme [at] microsoft.com · @mattbrehmer

Postdoctoral Researcher, Microsoft Research
The University of Calgary Data Empowerment Speaker Series · June 18, 2018 · slides: mattbrehmer.github.io/talks/uc180618/

The Data-Driven Storytelling Team


The Microsoft Data Journalism Program

Produce visually expressive timeline narratives in the browser or in Microsoft Power BI. By Matthew Brehmer, Bongshin Lee, and Nathalie Henry Riche
with David Tittsworth, Kate Lytvynets, Darren Edge, and Christopher White.

Common visual representations of time:

Linear Radial Spiral Calendar Curve Timelines Revisited: A Design Space and Considerations for Expressive Storytelling · Brehmer, Lee, Bach, Riche, & Munzner. · IEEE TVCG 2017 · timelinesrevisited.github.io
Image: Joseph Priestley (1765)
Image: Joseph Priestley (1765)
Image: flickr/shenghunglin
Image: LadyofHats (Wikimedia Commons)
Image: flickr/46704958@N07
Image: flickr/studiocurve
See "How to make history dates stick" by Mark Twain in Harper's Monthly Magazine (1914).

What is a Timeline For?

What happened when?

In what sequence did the events occur?
How long did the events last?
How long between event A and event B?
Did A and B co-occur?
When did A and B occur relative to event C?

The Careers of U.S. Open Golf Champions

Images: (Wikimedia Commons): Dustin Johnson; R: Jim Furyk

The Careers of U.S. Open Golf Champions

Data source: Wikipedia. This data is also featured in this demo video.

Timeline Design Choices in Timeline Storyteller

Linear Radial Spiral Calendar Curve
Chronological Relative Logarithmic Sequential
Unified Faceted Segmented

Expressive Storytelling With Timeline Storyteller

Choice of representations and time scales
Incrementally reveal, hide, highlight, and annotate
Support for chronological or non-chronological narratives
Export, share, and present

The History of the UK National Trust

Timeline Storyteller in the keynote of the 2017 Microsoft Data Insights Summit

Usage Promotion


  • Power BI version: 14K+ downloads, 2K unique monthly users, 35K+ YouTube views, 30+ tech news / blog posts, several community-produced tutorials.
  • Web version: 223 cases where authors opted into sharing their unique exported content with us.
  • Storytelling contest: 7 entries, 1 winner, 1 honorable mention.

Contest Honorable Mention

Tropical Cyclones by Manga Solutions

Contest Winner

TV Network Ratings by Pragmatic Works


  • Design Space Coverage: Datasets spanning topics, sizes, and time spans; while linear chronological timelines dominate, all other design choices were represented.
  • Privacy & Data Retention: Timelines often reveal personal biographical information; discontinued logging of content exported from web version in Feburary 2018.
  • Scalability: Limited to coarse metrics about usage of Power BI version; reliance on other channels of communication (e.g., email, community forum, Github issues).

Possible Next Steps

  • Reccomendations: Given a dataset, recommend points in the design space, recommend annotations.
  • Complete Storytelling Lifecycle: Do people want to use Timeline Storyteller for data analysis?
  • Studying Expressivity at Scale: How can we study expressive information design with deployed tools? How do we assess the quality of content that people produce?

Summary: Timeline Storyteller

Different combinations of timeline representation and scale
communicate different aspects of the data.

Animated transitions, highlighting, and annotation
incrementally reveal and connect narrative points.
open-source tool for web & Power BI
mabrehme@microsoft.com · mattbrehmer.github.io · @mattbrehmer

slides: mattbrehmer.github.io/talks/uc180618/


20 purposeful, interpretable, & generalizable
timeline designs at timelinesrevisited.github.io

Our process: Phase 1

Collect and categorize 145 timelines and timeline tools.
Sources included Cartographies of Time (Rosenberg & Grafton),
Visualization of Time-Oriented Data (Aigner et al.), Making Timelines (Groeger), ...

Our process: Phase 2

Validate with 118 additional timelines (263 total).
Sources included visual.ly, the Kantar IIB Showcase, massvis.mit.edu, ...

Implement points in the design space with
28 representative datasets.

Survey data and dataset index can be found at timelinesrevisited.github.io

Other Timeline Tools: Timeglider

© (2010) Mnemograph LLC: timeglider.com

Other Timeline Tools: Timeline.JS

© (2013) Northwestern University Knight Lab: Timeline.JS