FEVER

Abstract visualisations of the goals scored in the 2022 World Cup.

Each match is represented by a sphere, with the first half at the top and the second at the bottom. The goals are plotted along the equator, acting as anchors for inclined cross sections, which are drawn as arcs.

We had a lot of goals to draw — 198 to be precise, including penalty shootouts — so we created a custom tool for the task. It's a 3D editor where we can draw splines anchor by anchor. The splines are then decorated with styles from a predefined list. Each trajectory can be composed of multiple splines and each spline can have multiple styles, giving us flexibility for a lot of variations.

While preparing the designs, we studied all the 32 teams participating in the World Cup. We sampled colours from their home and away kits and also looked for iconography surrounding the teams, such as badges and other symbols embroidered to their jerseys. 

These were also used as decorative styles around the ball trajectories, animated with a custom glitch shader.

Here's a 60" compilation with some of my favorite visualisations:

Awwwards Blog - CASE STUDY: FEVER