Work · Food and beverage

ORRA Sparkling Botanical

A drinks collection presented as a directed 3D scene: the visitor sees the range, picks a flavour and inspects the can the way they would in a shop.

View the demoDiscuss a similar project

Concept Concept · authored by Smart Key

Frame from the demo

The brand task

A beverage brand launches three flavours in a new can format. Product photos make the cans look identical and flat; the brand wants the range, the colour coding and the packaging finish to read online, and wants each visitor to leave with a chosen flavour.

Where a brand would use this

Product pages
The 3D view replaces the photo gallery: the shopper turns the can and switches flavours without reloading.
Launch microsites
A scroll story for a new flavour or a limited edition, built from the same model as the shop page.
Distributor and retail decks
A link instead of a PDF: buyers see the range, the format and the shelf look.
Social and print assets
Still renders and short clips come from the same model, so every channel shows the same product.

What the solution consists of

  • Can model built in Blender from the can format specification: body, neck, double seam, lid, tab and rivet as separate parts.
  • Label system from the print files: ink, bare-metal areas and varnish are separate maps, so a new flavour is a new file, not a new model.
  • Web scene in Three.js: scroll-directed chapters, manual rotation, variant switching, mobile composition and a no-3D mode.
  • Variant data from the catalogue: names, colours and links to the shop or enquiry.
  • Still renders from the same model for previews, social cards and devices without WebGL.

What we need from a beverage brand

  • Print files (dielines) for each flavour
  • Can format: standard, sleek or slim, and the tab colour
  • Brand fonts and colour references
  • Links to the shop or the stockist list

Limits of this demo

  • ORRA is a fictional brand. The label text and nutrition values are placeholders, not a real product.
  • There is no cart: the call to action opens an enquiry, it does not sell anything.
  • Condensation, dents and liquid are not simulated; they can be added for a real launch.
  • A real project starts from the brand’s dielines and the can supplier’s format drawing.

Show your product like this

Tell us what you sell and where it should be shown. We reply with a proposed scope.

Discuss a similar project

A ready base for your brand

From a ready 3D example to your website

Base adaptation: $2,000. Extra section: $150. Start with a short request; the detailed brief follows confirmed payment.

Choose your site scope ↗

Choose services

Find out what your project will need

Choose a task and get the scope of work, the list of materials needed and the questions for a cost estimate.

Build my projectDiscuss without the builder