The Fast & The Furious: Formula 1

Visualization at 200 miles per hour.

Aritro Paul
VisUMD

--

by Aritro Paul, Purva Mundlye and Sonica Kulkarni

Photo by Nico Baum on Unsplash

One of motorsport’s most widely followed racing events — Formula 1 or F1 — has been around since 1950. Since its inception, many teams or constructors and drivers have contributed to the popularity and success of the sport. F1 being a highly data-driven sport combined with it being around for over 70 years has resulted in us having a lot of data. Our love for the sport and this presence of massive data drove us to visualize bits of this sport’s rich history and key features. Our goal was to not only engage existing F1 fans but also intrigue and invite new fans or casual viewers through our visualizations.

Our Process

Our Process

We started our process by identifying potential datasets. We found a quite robust dataset on Kaggle containing constructor, driver, results, and lap times data. We also found an API containing similar data called Ergast Developer API that could come in handy for our purpose.

Literature Review

Because the sport is popular, data-driven, and well documented, many people have created some truly amazing visualizations. The next thing we did was to look at these visualizations and study their purpose, process, and outcome. We reviewed 3 academic papers and 9 visualizations/dashboards/websites to understand the way people approach F1 visualizations, and further identify pockets where we could create visualizations to convey a story. People have focused on different parts of the sport to really convey a story. Some visualizations focused on multiple features whereas others went deeper into a single one. Since they were trying to visualize a story, a lot of the visualizations had some beautiful graphic design features in addition to or combined with the visualizations. We found out that while some visualizations took the technical route, such visualizations and displaying a lot of technical data might overwhelm our target audience as some of them might not know the ins and out’s of the sport well enough. So, balancing that with enough data to develop a narrative was very crucial for us.

Through our literature review, we noticed that there are multiple aspects of the sport that could be visualized like constructors, drivers, and even circuits. As we wanted to give an overview of the sport, we thought it best to create separate visualizations focusing on each of these aspects.

Sketches

Best Constructors over the years: We felt that constructors are an integral part of the sport with some constructors like Ferrari, Mclaren being around since its inception. Although there are constructor championships for each season, we chose to focus on the number of races each team has won. We chose to do so because we wanted to showcase the data on a micro-level where you understand how many races a constructor has dominated.

Rough Sketches and Iterations — Constructor Competition

The Mika Häkkinen vs. Michael Schumacher Rivalry: One simply can’t discuss F1 history without mentioning seven-time world champion Michael Schumacher. But, not a lot of people know that there was another driver on the grid that challenged Schumacher during some of his best years. As there were multiple ways in which we could compare the two drivers, we settles on creating four different visualizations to show their rivalry.

First, we showed how many world championships each driver has won in a span of 10 years. Although Schumacher did go on to win more championships after Häkkinen left the sport, we thought it was unfair to include that data.

Next, we went into the nitty-gritty of the sport to show some technical statistics of average grid position, the number of pole positions, DNFs (Did Not Finish), laps completed and laps led. Since there were so many parameters, we thought it best to use a radar chart to compare them simultaneously in one glance.

Then, we tried to show each of the drivers year-wise statistics. This included their number of points, race wins and championship wins in each of the seasons they were together on the track. This not only conveyed each of the drivers’ progress throughout the season but also allowed for a comparison between their statistics and progress. While we initially thought of a stacked bar graph for each driver, we ended up combining their Y-axis to provide a better comparison.

Lastly, we compiled their season-wise results, as in, in what position they finished each season on the grid. The idea of using a line chart for this was finalized because it showed driver progress and let users compare their results easily. There is a small gap in Schumacher’s line because he was disqualified during the 1997 world driver’s championship for causing a crash. And although he was allowed to keep his points and wins from the races, he was ultimately disqualified from the championship standings.

Rough Sketches and Iterations — Schumacher vs Hakinnen

Laptimes: Finally, we chose to shed a light on the different circuits that F1 races on. These circuits are an integral part of the sport and are often times shadowed by other aspects of the sport. We decided to add on the fastest lap times set on F1’s five most popular circuits in the Turbo-Hybrid era (2014–2019). We aimed at conveying two things through this visualization, the beauty of a circuit and the speed of cars.

Rough Sketches and Iterations — Best Lap Times

Beta Release

For the Beta release, we started building our website. The website was built with NextJS and used a combination of custom charts and Charts.js. The custom charts were still static, and the ChartsJS charts had minimal interactive elements. We originally planned to use D3js, however we had trouble integrating it and building the sort of custom visualizations we were aiming for. The data was processed, cleaned, and imported into the charts, and were served via files/directly. The goal was to provide a simple, clean way to see and visualize Formula1 data.

We found a few bugs and wanted to fix them for our final release. Some of them included:

  1. We needed to add short descriptions to visualizations and give some context.
  2. We felt like we could do a more effective visualization than the radar chart for the rivalry.
  3. We needed to add proper descriptive axes for context.
  4. The colors needed to be cleaned up for better legibility on certain charts.

Peer Evaluation

To get feedback on our visualizations, we conducted peer evaluations, which involved three sessions. The first session was with a fellow classmate, whereas the remaining 2 were with our friends. In the first and third sessions, the participants knew nothing about Formula One racing, whereas in the second session, the participant had a vague idea about F1 racing. The first session was a general session where we did not ask any specific questions. Whereas for the second and third sessions we asked the following questions and asked the participants to answer these questions by referencing our visualization:

  1. How many races did Schumacher win in ‘94?
  2. Find best lap times for Monaco Circuit in 2018.
  3. Find the second-best constructor
  4. Who was the best among Michael and Mika? Consider all parameters (1991–2001)

We observed that in general, the participants said that they needed a little bit of context to understand what was going on in the visualizations. The colors needed to be changed to differentiate between various margins to clearly understand the visualization. The axes needed to be named appropriately. They had not been named currently which was confusing all the users. The font size also needed to be increased for the radar chart because the information was not very visible. The radar chart was also not very clear and users did not understand what was going on there.

Final Release

The final release consisted of the final website with all the changes made based on the feedback we got from our peers. Due to the problems we faced while building the charts with D3 and Charts, we tried out a ton of different options like Vega and Recharts, we had to resolve by using SVGs and CSS. To simplify things, we used tailwind css, allowing us to quickly write CSS and actually just worry about visuals. We completed the lap times module by adding all the visualizations for the five different tracks we chose across multiple years from 2014 to 2019. We also changed the colors to make the visualizations more clear and also added descriptions for each module to give some context to the person viewing the visualization. So even if the person is not an F1 geek, they would understand what was going on in the visualizations. We also added descriptive axis names to make the visualizations more clear. You can now visit the website here.

Our Visualization Website

Takeaways

On completing our visualizations,, our major objective questions and inferences were crystal clear. Our viewers could quickly determine and interpret the visualizations, and we also found some extra information from the visualizations.

From the lap times visualization, we can clearly see that every year, the fastest time on the circuit. would lessen, and this would probably be from the competition in the drivers, and cars being built better by the constructors. Another interesting point we saw was that a lot of the top drivers remained at the top, consistently boasting of top lap times every year, on different circuits. Similarly, for the constructors, Ferrari was ahead with a huge margin of wins (55) with McLaren in second place, who also had another huge margin (59 wins) with Mercedes in third place. We also got an in depth look at Schumacher’s and Häkkinen’s rivalry, and even though Schumacher dominated most of it, there was a very intense battle from 1998–2000.

Building the website was a fun task, and we face a lot of problems, considering that support for custom visualizations is still very poor, if you’re not using the same line/bar/area/pie charts. All in all, we were able to provide a rich viewing experience to F1 and non-F1 fans, and were able to see how excited and interested they were in our data.

Future Scope

Our future scope and work would be to improve a lot upon the custom charts, and probably with a lot of time and effort, we will be able to make them visually appealing, animating and interactive, showcasing much more data than we are showing right now. Also since the comparison of Schumacher and Häkkinen was a major hit, we would also want to be able to extend this feature and be able to compare any 2 drivers in history, and draw fascinating conclusions we weren’t able to before. The data is constant and available, and this would be a very interesting milestone for this project.

--

--