3d house icon 3d computer icon 3d world icon

AVEC is an NYC-based all-natural mixer with five unique flavors. The web experience features dynamic product templates with 3D modeled scenes that immerse the user in the worlds of each flavor.

Web Design
Development
3D

Upon landing, the user is met with a scene of a cutting board surrounded by the tools and ingredients typically needed to create a high-quality mixed drink. After scrolling, these ingredients and tools slowly fade into a monochromatic background and the AVEC can is brought to the foreground communicating a simplified shift from that to this. Scrolling further, the can locks into place alongside the remaining flavors. Scenes cycle through the different flavors each time the user reaches the home page to highlight the variety.

Mobile web design of 3D rendered Ginger scene for Avec Drinks
Mobile web design of 3D rendered Hibiscus scene for Avec Drinks
Mobile web design of 3D rendered Grapefruit scene for Avec Drinks
Mobile views of various homepage themes
Home experience with scroll-based background blur
3D rendered web design for individual drink flavors
Can locking into place

Dynamic elements take away the predictability of an eCommerce website, thus making it more interesting to explore. While the structure of the eCommerce experience may be familiar in terms of the user flow and site map, things like responsive product templates encourage the user to spend time exploring the collection. These elements also aid in telling the story of the brand in ways that static imagery cannot. Each product page features 3D renders of the product, ingredients, and objects from their primary scene.

Product page web design with 3D rendered scene
Overhead render of Hibiscus & Pomegranate
3D rendered scene of fresh ingredients on product page
Mobile view of product page design for hibiscus flavored drink
Desktop and mobile overhead 3D scenes
Remaining flavors’ 3D product heroes

The collection page peers into the 3D scenes, and differentiates each flavor with strong imagery and color palette. Functional aspects— like the ability to quick-add— drive conversion. The user is also able to navigate to each flavor’s page to learn more.

Collection page design of featured product in 3D scene
Hibiscus & Pomegranate collection page feature
Collection page design with ginger product feature
Collection page design with grapefruit product feature
Mobile and desktop comparison of flavor feature

Each component on the site was 3D modeled and rendered. Because the product was still in production shorlty before launching the site, AVEC was able to work with product content before it was canned. Aside from the functional benefits, 3D imagery also suspends reality in imaginative scenery and increases engagement through surreal landscapes.

3D modeled scene for function beverage website
Ginger scene post-processed
Screenshots from in-progress scenes in Maya
3d modeled scene for functional beverage website
Jalapeno & Blood Orange post-processed
3D modeled scene of natural ingredients for functional beverage website
Hibiscus & Pomegranate post-processed

Related Work

Web Design
Development
3D
Identity
Packaging

Rù is a functional beverage with a contemporary, health-conscious twist on traditional Asian drinks. Each element of the brand is aimed to communicate this updated approach in a way that stays true to the authenticity of its traditonal roots

Moment

Web Design
Development
3D

Moment is a functional beverage based in NYC that was in need of a refresh that communicated the calming, yet energetic nature of their drinks.