Gaming on Avalanche

Product Website UX/UI Design Frontend CMS

Context

Creating Community - driven Website

Avalanche is a community-driven platform for developers, content creators, and gamers. We set out to create a central hub for these groups, even though we had a very limited time frame. Embracing the challenge, we delivered a website that truly represents Avalanche's dedication to its community and vision for the future of gaming.

client:

location:

sector:

year:

timing:

Avalanche

Singapore

gaming

2024

2-3 months

context

Showcasing Excellence

The website needed to be top-tier of gaming presentation, showcasing the best of gaming design. It had to represent Avalanche as a brand, highlight their portfolio of games, and showcase the community in a way that motivates other developers and gamers to join.

CREATION PROCESS

CREATIVE CONCEPT

Our starting block was A dynamic representation of Avalanche, featuring its distinctive colors, sleek animations, and great accessibility.

avalanche

Creation process

Meeting the Challenge

Our biggest challenge was delivering this cutting-edge website in time for the Game Developers Conference (GDC) in San Francisco on March 18, 2024. The GDC is a major event in the gaming industry, where professionals from around the world gather to exchange ideas, showcase new technologies, and set the trends for the coming year. This date was crucial because the conference was an investment, and the website was a prime opportunity for the client to maximize its value. Given that we started the initial work just two months before the GDC, this was one of our fastest projects from design to delivery.

Creation process

Overcoming the Obstacles

We had very limited information about the client's brand—basically just their logo, font, colors, shape, and gaming assets. We turned these minimal assets into a versatile design element that appears throughout the website in various forms. We utilized the gaming assets to create collages for the hero image, modifying and refining them as needed. Their brand color, red, became the main color of the website. To give both developers and the client a clear vision of how the website should function, we animated the homepage. For pages lacking assets,

we created a 3D coin with a simple animation to bring the page to life, which also interacts with the scrolling. Finally, we ensured the website was fully optimized for mobile devices. Precise communication was key, focusing on the essential elements necessary for the project’s progress. We weren’t picky about the brand assets. We took the brand shape, logo, and gaming character to create more uses for all of them, developing derivatives like patterns, textures, and components.

BEHIND THE SCENES

CUSTOMIZABLE CONTENT

The entire website boasts fully customizable content thanks to the Contentful CMS and delivers lightweight HTML to the client thanks to Astro. The content side of things isn't unusual, but for a site as complex as Avalanche's not something always expected. With this architecture the site can manage high volume of content like new games, posts, or educational material and with elegant integration of Contentful on an Astro framework, it’s all possible if ever needed.

BEHIND THE SCENES

Light HTML for All Users

For this project, we chose the Astro framework because the site is a content - driven experience that relies on fast performance and sustainable build times. While all this is true, we primarily chose Astro because it is nearly vanilla, making it easily understandable and transferable to the client, whose developers can seamlessly work with it. Moreover, Astro offers the potential to expand with React, providing reactivity, 3D capabilities (using the R3F library), and form handling. The result is a high - performing website that still looks awesome.