The journey started in late April 2023, when the project was first pitched. After much discussion, a date was set for a video shoot in late June at the Singapore Sports Institute, as well as an interview with Shanti Pereira, 27, and her coach Luis Cunha at the ST office. The team worked tirelessly for three months to produce the interactive, with the article published on Sept 18.

ST Digital Graphics interns Andrea Wong, Ang Kai Yan, Chan Jia Ying and Ng Min Min sat down with Hannah Ong, digital graphics journalist and project lead for this piece, to find out more.

Why did the team decide to do an interactive feature on Pereira, even before her stunning performance in the 2023 Asian Games?

The idea for this feature was originally pitched by Rohit Brijnath from the sports desk. At that point, Pereira had already broken multiple records, and her main goal was to work towards the Asian Games. She would be a rising star to watch, so we decided that it would be good to start preparing an interactive feature on her that would be published right before the 2023 Asian Games.

What was it like to work with Pereira in the flesh?

She was very respectful and engaging, and it was an absolute pleasure working with her. Meeting someone so young and yet so accomplished as her, however, was an eye-opening experience, and it did make me question my life choices just a little bit, especially because we’re quite close in age.

How was the visual aspect of the article planned and executed?

The sports, video and digital graphics teams discussed in detail what we wanted to do for each of our projects, and coordinated accordingly.

Video timetable for Pereira’s shoot

On our end, we wanted to have Pereira explain to the camera and readers the change in her technique, and also show how she does it, as immersing readers in the science (and art!) behind Pereira’s sprint was integral for reader engagement. Through a combination of slow-motion footage and annotations provided by coach Cunha, we were able to provide readers with a deep understanding of the biomechanics behind Pereira's improvement.

Biomechanical annotations on a whiteboard
Biomechanical annotations in the published article

How were the video shots planned for this project?

We planned for a mix of panning, tracking and fixed shots - we weren’t confident that we would be able to keep up with the speed in which Pereira would be sprinting, so we wanted to be sure that we could capture everything we needed from different angles. A test shoot was also done beforehand with a stand-in for Pereira in order to ensure that everything would go smoothly on the day of filming.

Planning of camera angles with Lego pieces
The day of the shoot

The team also had to take into consideration the different devices that readers would use to view the article, and carefully think of ways to optimise the viewing experience for both mobile and desktop readers, in order to best tell the story effectively.

Optimised for mobile devices

What other challenges did the video team face?

Aside from planning for optimal visual quality, the team also had to consider environmental factors during the shoot. We were worried that it might rain, but thankfully, it was a sunny day. To prevent the cameras from overheating at midday, umbrellas were used to shade the equipment from direct sunlight.

The day of the shoot

Did the team have to acquire any special equipment?

Initially, we thought we might have to rent special slow-motion cameras to get the effect we wanted, but fortunately, the video team was able to keep costs low by utilising existing equipment.

A glimpse at the planning process in the earlier stages of the project

What strategies did the team use to make the article engaging to readers?

In collaboration with the video team, the design team played a pivotal role in determining the article's angle and overall direction.

Pereira wore a bright pink top to the video shoot, and digital graphics designer Lee Pei Jie thought it would be nice to go along with the same colour motif. The deliberate use of pink throughout the article also celebrated Pereira as a female athlete, and emphasised her resilience and determination in her sporting journey. Pink is also infrequently used in news sports articles, which made this colour scheme stand out.

Pereira happened to wear a bright pink top for the studio shoot!

The design team decided to follow through with this colour scheme throughout the storyboarding process.

Other design considerations were also carefully made to maintain audience engagement, such as shorter timings for talking head segments.

The header graphic also played an important role in drawing readers’ attention. The idea was for Pereira to sprint towards the camera, and burst through the article headers before stepping off slightly to the side.

Intro header drafts and test runs with an understudy
Behind the scenes of how the header was filmed
The final video header used in the project

We also decided early on that we wanted to incorporate Cunha’s focus on data and biomechanics into the piece. This was done in two different ways.

First, we printed frames from various parts of the sprint when we did the video shoot with Pereira and got Cunha to annotate, by hand, certain key techniques that he looks out for when training her.

We then recreated this in the article with the help of motion graphic designer Alexis Gabrielle and producer Azim Azman from the video team who animated these points in After Effects and exported the clip as a video, while data visualisation developer intern Zsigmond Poh used code to have the HTML text annotations (like “Head below waist” and “Knee-driven” in the example below) track on the page itself. This was accompanied by scrolly text boxes which further elaborated how these tiny details played a part in helping Pereira go faster.

In doing so, we wanted to give readers a look at the sport through the lens of sports science and biomechanics, and break it down like how Pereira and Cunha would - methodologically and systematically.

Text annotation on the page

Second, we asked Cunha to share with us some of the data he has collected on Pereira, such as flight time for each of her feet and stride length. We incorporated this data in the form of charts, to help readers visualise what it is used for - this was done with the help of data visualisation journalist intern Young Zhan Heng and data visualisation editor Rebecca Pazos. This was instrumental in allowing readers to understand the detail that Cunha goes into to refine the techniques that contribute to Pereira’s success.

Records of Pereira’s running data from coach Cunha
Translating of data during the storyboarding process

We also had an interactive portion where readers could guess by how much Pereira’s stride length has improved since 2017, which was coded by data visualisation developer Alex Lim.

Interactive quiz for readers to guess the improvement in Pereira’s stride length

What were some memorable moments during the shoot?

When we rewatched the video footage after each take, we were amazed at Pereira’s power and running form.

But both Pereira and Cunha would quickly identify minor technical aspects for improvement, such as her starting position and hand-scooping technique, which were almost imperceptible to the untrained eye.

This was when we got to see how dedicated and serious they are to the sport, and how they constantly strive for improvement, despite already being at the top of their game.

Were there any special interactions with Pereira?

Sports desk reporter Rohit, who pitched this story, got to race against Pereira! The video ended up being included in the article.

Sports journalist Rohit attempting to race with Pereira

As for the rest of us, we did not get to enjoy the luxury of hanging around with Pereira after the shoot as her schedule was very tight. We did provide refreshments for her during the shoot. At Singapore Sports Institute, she had a vanilla latte from Starbucks, and at the ST office, she had a Teh C from Toast Box!

How has the entire experience seeing this project from start to finish been like for the team?

It was a massive undertaking that involved a lot of planning and many different departments working together, which makes it all the more satisfying to have been able to pull this off.

There were also some technical issues in putting so many videos up on the webpage – it resulted in long loading times. So we had to find a way to compress and optimise all the videos on the page, yet still ensure that video quality would not be compromised, especially as we had some amazing motion graphics done by the video team. In the end, I think we managed to find a good balance between the two.

There was a lot of pressure as all eyes were on Pereira at this point, and we wanted to do our best to meet those expectations. Overall, I’m glad to have been able to work on this project with so many people across different desks, as well as with Pereira and Cunha, and we are quite proud of what we have made!

Read it here.