Loading ...

Responses by 14islands.

Background: Goals is an inclusive football game where everyone can play together. The site’s target audience is diverse, comprising players of all abilities and backgrounds. Our goal with the site was to create a branded experience to ultimately attract players to football and give them the game they deserve.

Design core: The design draws inspiration from the real world of football and its culture, which helps the site focus on the technical aspects of the game. We developed a graphical style, playing with shapes, colors, contrast and motion to make the site feel alive. The impactful, bold and playful style creates excitement.

Favorite details: We made a visually striking website to showcase the game’s art direction. Goals is about how football feels, so smooth motion was key for the site. We crafted parallax scroll animations to make the site feel alive and deep, giving viewers the feeling that they’re on the football field playing the game.

Challenges: Telling the story of a new inclusive football game and making the story compelling to a broader audience than is usual for sports. Goals is a fast-paced football game that is fun to play. People can start playing without any experience and master it as they evolve. The game itself is still evolving and subject to changes. We created an adaptable, flexible and updatable site while making an excellent online experience.

New lessons: We learned to create a bespoke experience with a fully reusable component library behind the scenes. It’s not visible to users, but striving for that balance was a big challenge. Creating a component library taught us how to use designs effectively as a communication tool between designers and developers. We had to think ahead about the technical rules to help developers while pushing for creativity. It was like solving a puzzle.

Navigation structure: Since Goals is developing the game in close connection with its community, explaining it deeply with logical details was necessary. We broke the content into groups and organized it from the user’s perspective to tell a compelling story with details while creating excitement around the game. The homepage gives users an overview, and each page offers an ability to dive deeper into each aspect of the game.

Technology: The site was made with React, Next.js, WebGL, three.js and react-three-fiber, and Sanity for the CMS. To simplify content management and provide a scalable solution to support growth, Goals will manage the site’s visuals and copy for years into the future.

playgoals.com

Browse Projects

Click on an image to view more from each project
X

With a free Commarts account, you can enjoy 50% more free content
Create an Account
Get a subscription and have unlimited access
Subscribe
Already a subscriber or have a Commarts account?
Sign In
X

Get a subscription and have unlimited access
Subscribe
Already a subscriber?
Sign In