One video of a prototype can. An entire brand, built from it.
A headless Shopify storefront for a new electrolyte brand - with every product render and lifestyle image on it generated from a single video of the prototype cans.
- Client
- Octolyte
- Sector
- E-Commerce
- Timeline
- 3 weeks
- Platform
- Headless Shopify + SvelteKit
What was in the way
Octolyte had three prototype cans, a launch date and no photography. A conventional route meant a studio day for the product shots, then a separate lifestyle shoot with models, locations and a crew - weeks of lead time and a five-figure bill before a single page could be designed.
What we did about it
They sent us one video of the cans turning under a desk lamp. We pulled the label artwork, geometry and lighting out of it and rebuilt the range as clean product renders, then used those to generate a full lifestyle library - running tracks, cafés, coastlines, skateparks. The storefront was designed around the imagery as it was produced, not retrofitted to whatever a shoot happened to deliver.
What it took to build
Everything you can see started as one video.
No studio. No photographer. No model release forms. One handheld video of three prototype cans, filmed on a desk under a lamp.
From that we rebuilt each can as a clean product render - accurate label artwork, correct proportions, consistent lighting across the range - and then art directed the full lifestyle library around them: running tracks, cafés, coastlines, skateparks.
The advantage is not only cost. When the flavour lineup changes, the imagery is regenerated in an afternoon rather than re-shot next quarter.
One phone video of three prototype cans
20+ product renders and lifestyle images
Every image the brand launched with.
Product renders, lifestyle scenes and social crops - one consistent visual language across the range, ready before the storefront went live.
Every decision on this page had a reason.
Hover a marker - or pick one from the list - to see why it's there.
Designed on a phone screen first.
Roughly two thirds of Octolyte's visitors arrive on mobile. Every layout decision was made there and then scaled up - not the other way round.
Tablet
Desktop
Mobile
The kit the whole site is built from.
Colour, type and spacing defined once, then reused everywhere - which is why new pages take hours instead of days.
Brief to live in 3 weeks.
- 01
Teardown
Week 1Pulled label artwork, can geometry and lighting from the prototype video.
- 02
Renders
Week 1–2Rebuilt all three flavours as consistent product shots, signed off before any design work.
- 03
Library
Week 2Generated the lifestyle set - track, café, coast, skatepark - from the approved renders.
- 04
Build
Week 3Headless Shopify storefront designed around the imagery and shipped.
What Octolyte actually got.
- Headless Shopify storefront built in SvelteKit
- Full product render set for the three-flavour range
- Lifestyle image library for web and social
- Flavour-coded design system
- Collection, product and cart flows
- Instagram feed and stockist sections
- Multi-currency and region support
- Art direction and image generation pipeline
Let's talk about your project
Tell us what you are trying to fix. We will tell you straight whether we can help, and what it would take.
Creating exceptional digital experiences that drive results and inspire action.