5%
10%
15%
20%
25%
30%
35%
40%
45%
50%
55%
60%
65%
70%
75%
80%
85%
90%
95%
100%

Aether 1

Client
Internal Project

Services

Branding
3D
Graphic Design
Motion
UX / UI
Web Design
WebGL
Webflow
Impact
AWWWARDS SOTD
FWA OF THE DAY
CSSDA OF THE DAY
Awwwards Ecommerce Honours

The big  question

How do we deliver an immersive 3d-product experience without compromising on page load times?

The Objective

a proof-of-concept earbud launch where AI chat, 3D WebGL and brand design meet.

Aether 1 became our sandbox: a fictional product used to showcase how OFF+BRAND combines brand storytelling, advanced interactions, and custom AI to build measurable business value on the web. We built a launch site that lets technologists, audiophiles and casual shoppers explore every microscopic detail in real-time 3D, chat with an on-page AI concierge and glide through an endless, cinematic scroll, all while maintaining performance and brand credibility.

Visual direction

To evoke Aether 1’s character we paired a stripped-back, deep palette with soft gradients and generous negative space. The hero scene suspends the buds in weightless light; subtle bullet-time sound-waves echo their acoustic purity. Behind the scenes, our team. Prototyped the form in Midjourney and Figma, aligning every iteration to real-world Apple earbud dimensions for instant believability. Modelled and textured in C4D & Blender, baking ambient-occlusion and custom mat-caps for glass-like reflections that load fast on mobile. Named and unwrapped every mesh for developers, exporting clean .glb files so the hand-off was as smooth as the visuals. The result is a brand language that feels premium, futuristic and refreshingly lightweight.

Chat interface showing a product purchase message stating that earphones can only be bought online with a preorder button, and an option to ask another question.
Close-up of a woman wearing wireless earbuds, with text about micro-drivers highlighting their durability, high frequency, and IP58 dustproof rating.
Close-up of a woman wearing wireless earbuds, with text about micro-drivers highlighting their durability, high frequency, and IP58 dustproof rating.
Close-up of a woman wearing wireless earbuds, with text about micro-drivers highlighting their durability, high frequency, and IP58 dustproof rating.

Focus on Experience

Storytelling drives the build. An infinite Lenis scroll guides visitors through four chapters: Audio Design, Precision Craft, the secret Sub Alphatonic Core, and Seamless Connectivity, each revealed with baked camera paths, GSAP-powered scene swaps and 60 fps WebGL particle fields that even an iPhone SE 2020 can handle. GPGPU flow-fields, fluid-sim cursors and audio-reactive waves turn passive viewing into playful discovery, while a fallback “reduced-motion” route and simplified ray-casting keep the experience inclusive and accessible.

The site has already become a favourite demo tool for sales, (hypothetically) helping convert curiosity into pre-orders in record time.

Collage of dark-themed digital interfaces showcasing wireless earbuds with features like airpods case, exploded parts, and text highlighting 'Sub Alphatonic Power Core' and 'Unrivalled audio quality.'
Open black wireless earbuds case with earbuds inside, titled Aether:1 with tagline Sound Without Boundaries and call to action Ask Aether button.

Focused UX on responsive layouts.

X-ray style close-up of a wireless earbud with text reading 'Aether:1, Sound Without Boundaries' and 'Elevate your senses through timeless resonance'.
build