← All work

Modelo

Redesigning the home for America's top selling beer

Brand,  Web Design

The Modelo site looked like it was at least 10 years old when we kicked the project off. The beer had risen to be the top selling beer in the US yet lacked the digital presence of a brand at its level.

View the live site ↗
Modelo PDP page Modelo blog template emphasizing modelo merch

A culture defining brand

The team at Modelo is ambitious, wanting to elevate the brand to the highest standards. This brand is to be a culture creating brand — it will shape conversations, change minds, and lead the aesthetic trends of the future. And while (realistically) a brewery website is never going to revolutionize our society, the story it tells can influence it. And that's what we set out to do.

The brand has always been raw and real and we wanted this site to be just as down to earth as its roots. So, by leveraging their growing library of gritty photography we put people first and foremost in the site design. Glossy photoshop images were replaced by textured photography.

Keeping graphical elements to a minimum we made use of a collage aesthetic to pull into the more maximalist side of their brand without losing that authentic feel.

Modelo product pages featuring Especial and seasonal varieties with rich lifestyle photography Modelo brand collaboration page — Kappa Modelo featuring cultural crossover campaign imagery

The web design

To enhance responsiveness, we introduced a fluid typography system based in CSS clamp functionality allowing text to be large and bold without concern of awkward line wrapping. The grid itself is large at desktop sizes making use of the full screen and fits comfortably on a mobile screen.

This complex, layered design was wrapped in a design system of modules, components and primitives allowing Constellation's developers to quickly adjust layouts while maintaining consistency across the site.