Case study · Probiotic tea

Divini: the can is the homepage

Divini brews probiotic tea in Scottsdale, Arizona. I built their store around the can itself: a 3D model that turns, tilts and crosses the screen as you scroll. It is running on this page. Scroll and see.

Brand: Divini, Scottsdale AZ
Design: Devalok
Built with: Next.js, Shopify, Three.js
Scope: 3D homepage, store, events
Timeline: Sep 2024 to Sep 2025

01 / 06
This is the can. Scroll it.
The same model, lighting and poses I built for Divini’s homepage, running live on this page. Each section of their site had its own pose. Scroll, and the can moves between them.
Scroll to turn the can
02 / 06
The brief
Divini makes probiotic tea, and the can is the brand. The homepage had to sell it the way you meet it: in your hand, turning it over, reading the label.
03 / 06
One can, three layouts
A single 3D can lit by an HDR sky, with a pose for each of the nine homepage sections, and a separate set for desktop, tablet and mobile, so it never sits on the words.
04 / 06
Made to load
The can’s textures are compressed and served from a CDN. A splash screen counts up while the can and its lighting load, so nobody sees half a can.
05 / 06
The store behind it
Shopify runs the shop: collections, products, cart, accounts and reviews. Around it, a map of every stockist and a calendar of community events.
06 / 06
Sep 2024 to Sep 2025
A year of building for Divini, from the first render of the can to the last fix.

The brief

Divini is a probiotic tea from Scottsdale, Arizona, made by Scoby Drinks. Four ingredients: herbs, honey, fruit and tea.

I built their site from September 2024 and kept building for a year: the 3D homepage first, then the store, the stockist map and the events calendar.

What I built

The can, in 3D
A real-time model of the can with HDR lighting, posed for every homepage section and every screen size. Scroll moves it; it never just spins.
A splash that means something
An animated preloader that counts the real loading progress of the model and its lighting, then hands over to the can.
A store on Shopify
Collections, product pages with reviews, cart, sign-up and accounts, on Divini’s own Shopify.
Find Divini
Every stockist on a map and in a list, with address and opening hours, so the next can is never far.
Community and events
A calendar of tastings and events that Divini runs from Shopify, with a date picker to jump between months.
Their story, told properly
Our story and Why Divini pages, with the four ingredients and the people behind the brew.