Gradient is the world's first gradually reducing alcohol pack, bringing together multiple strengths of vodka soda in one box.
Because Gradient was a completely new product category, we needed to find a way to explain the way the product worked through a dynamic website.
Various site structures were explored during UX ideation, all focused on unique and engaging ways to tell the story of the product.
The final UX contained the site on a single landing page. The main content section focused on a fixed can in the centre of the page that spun as the user scrolled, dynamically transitioning through the different strengths in the box. The spinning can visually expressed the unique experience of using the product while allowing additional information to appear as the user scrolled.
The final design featured three separate colour themes for each flavour, which was selectable via the flavours menu. The dot pattern reacted by expanding under the user’s mouse or finger, giving the entire site an interactive feel.
As the user scrolled to the last section of the page, the fixed can slid into the product box with all five strengths.
The spinning can was developed with webGL, which enabled lower page sizes and allowed us to create the same interactive experience on mobile.
ClientGradient Vodka Soda
ADMark Rowe
DevBradley Gill
