Goal 50 is an annual award that brings together the world's 50 best male and female players. The players are divided into two 25-strong groups and ranked on their achievements over the previous year. 2019 is also the first year there has been both a male and female list, which we were excited to work on. Chief editors and correspondents from Goal's 42 editions around the world cast their votes based on each candidate's consistency, big-game performances, footballing legacy and success at club and international level.While this has been a long-term annual feature on the Goal.com website, last year was the first time an interactive component had been added to the list and we were extremely proud as an agency to be able to deliver this for Goal.com.In 2019, we were at it again - bringing beautiful interactive elements to the awards. Why not watch the video below to see what we've been up to?
For this year's header section we were given the brief of an infinite scrolling hexagonal grid. Each player would be placed on an individual hexagon made up of a background, half-tone and hand drawn line layers the same way the physical player trophies were constructed. To keep load times down we packed these layers into individual rgb colour channel sprites. WebGL's instanced rendering and distance field functions allowed for smooth scrolling across the grid. Full screen shaders were used for punchy distortion and glitch effects when selecting players.To keep load times down we packed these layers into individual rgb colour channel sprites. WebGL's instanced rendering and distance field functions allowed for smooth scrolling across the grid. Full screen shaders were used for punchy distortion and glitch effects when selecting players.