Cover for the App

Southampton FC: AR Kit

Bringing Southampton FC's new football kit to life with AR content triggered by markers on the jersey.

Bringing Southampton FC's new football kit to life with AR content triggered by markers on the jersey.

Southampton F.C's AR Kit is a WebAR mobile experience and world-first AR-integrated football shirt that can be brought to life to unlock special Saints content.

The web app prompts users to search for hidden digital markers on the physical jersey that each reveal exclusive memories from the club, with the final marker giving access to the ultimate fan experience – an AR model of Southampton captain James Ward-Prowse showing off his impressive keepy-uppy skills right in their living room. Finding all four hidden triggers unlocks the 360º AR Portal with up-close footage of the players on the pitch.

Our team used 8th Wall to track and map the AR experience to the markers on the new football shirt. We also made use of the device’s motion sensors to track and position the 3D models of Ward-Prowse and the 360º AR Pitch Portal. The AR experience was seamlessly integrated with a React/NextJS frontend containing crafted UI animations for a richer user experience. At some points, both WebGL and HTML animations were integrated and triggered at the same time in a transparent way for the end-user.

This was an especially fun project that blended the digital world with the physical one and brought fans closer to what they love: their favorite team and their favorite players.

Featured screenshot
Featured screenshot
Featured screenshot
Featured screenshot
Featured screenshot