Dior Stars is an effect available globally that immerses users in a night sky featuring figures from Pietro Ruffo's artwork.
By interacting with the scene, users transform these constellations into the iconic Dior products Sauvage, J'Adore, or Miss Dior,
while dispersing stars across the environment through touch gestures on their device.
As the main and lead creative technologist on Dior Stars, I oversaw the production from start to finish, from storyboarding to development.
I developed exclusive glass shader effects and post-processing effects for many key visual elements, while making sure it was mobile-friendly and performant.
Product Reveal Transitions
The defining feature of the Dior Stars is the product reveal/disappear transitions, which went through several rounds of experimentation and design to get just right.
Our first attempt was a custom dissolve animation that gave us control over the extraneous details and visually matched how the filigrees
(the ornate, intricate patterns) looked —but ultimately, it still felt too distracting as a transition.
To synchronize with the client's vision, we opted for a simple fade-in/fade-out of each of the main elements: the product materials, the constellations, and the filigrees.
Glass Shader Innovation
We combined Fresnel effects with custom glass shaders using multiple layers of render passes to simulate glass in real-time rendering with reflection and refraction faithfully.
This combination helped create a differing reflectance on the surface of each product depending on the angle from which the viewer stood.