Biotherm
From skincare to scientific storytelling, an immersive 3D experience designed to reveal not just what the product does, but why and how it works
Year
2024Technology
WebGL - Vue.jsRole
Concept Development, Art Direction, 3D, Motion, UX DesignAwards
FWA of the Day
CHALLENGE
How do you make skincare science engaging?
Launching Active Recovery Body Milk meant communicating a sophisticated formula without overwhelming users with technical information.
The challenge was to transform scientific credibility into an experience that felt intuitive, immersive and easy to understand, while remaining accessible across every device.
Start with the science.
Turn it into discovery.
Rather than presenting product claims through a traditional landing page, we built an interactive visual website where every scroll reveals another layer of the formula.
Scientific ingredients, product benefits and practical applications are woven together through storytelling, allowing users to understand the product by exploring it.
Every interaction reinforces the same message: innovation is easier to trust when you can visualise it.
Make every ingredient meaningful
The experience was built around detailed 3D visualization and purposeful interaction.
Precise animations, realistic materials and interactive sequences explain how the active ingredients work and why they matter. Instead of simplifying the science, the experience makes it easier to navigate.
The interface was intentionally designed to remain clean, focused and effortless, allowing the product to take center stage.
Built to educate.
Designed to captivate.
The result is an immersive WebGL experience that combines product storytelling with scientific visualization.
As users progress through the journey, they discover the formula, understand its benefits and connect each ingredient to real-world results. Visual storytelling transforms technical information into an engaging experience without sacrificing clarity.
The platform becomes more than a product launch. It becomes a tool for education, engagement and brand storytelling.
ONE EXPERIENCE, EVERY SCREEN
Whether experienced on desktop, tablet or mobile, the experience maintains the same clarity and visual impact.
Every interaction, animation and piece of content adapts seamlessly across devices, ensuring users can discover the product with the same fluidity wherever they are.
One story. Every screen.
Concept, direction, craft
We built the experience around one simple idea: transforming skincare science into an story that anyone can understand
Creative & art direction
A clean, premium visual language balancing scientific precision with Biotherm's modern and refreshing identity, creating confidence through simplicity
3D direction & production
Detailed real-time 3D product visualization, showcasing the formula, active ingredients and textures with cinematic quality optimized for the web
Interactive & UX design
A guided exploration that lets users naturally discover ingredients, benefits and product innovation through intuitive interactions instead of static content
Technical direction
A WebGL experience built with Vue.js, optimized for responsive performance across desktop, tablet and mobile without compromising visual quality
Our Partner
Development was executed in partnership with Bright