To cover the Paris Olympics, The Times developed a series of data-driven, quick-turnaround visualizations of every swimming and running event to offer readers on social media instant recaps of these competitions. The team built a custom suite of software to render miniature 3-D animations within seconds based on live event data from the Olympics. The system was designed for speed, allowing for nearly real-time visual coverage. The animations were an original way to capture the drama of some of the biggest Olympic moments and were well suited for a social media audience.
Here’s how it worked. When a race finished, a Node.js app built by the team transformed Olympic results data into a series of original 3-D animations rendered by JavaScript in the browser. The team, watching the Olympics in real time, used a bespoke authoring tool created for this project to immediately review the animation for accuracy and generate a series of video outputs from the rendering. Meanwhile, editors would write snappy headlines to pair with the videos to help frame the story of the event. Within minutes, the team had videos for several different platforms ready to publish.
The Times developed this system in the weeks leading up to the Olympics. For swimming, they studied and modeled the four different strokes used by swimmers in the various events. They refined the sequences of dives, kick turns and relay events to best replicate the feeling of the real swimmers. The running events required a combination of realistic animation sequences and clever camera work to capture the turns of the Olympic track. The team chose lo-fi characters to maintain quick rendering performance and to lean into offering something that felt new in a competitive coverage area. Composers worked with the graphics team to produce a matching original soundtrack and data-triggered sound effects to add momentum and polish to the visualizations.
