Step inside. See every angle.
The task
We wanted to show how an online shop can convey the feeling of visiting a boutique. The space needed its own character, with products visitors could examine up close. Both exploration and selection had to work with a mouse and keyboard as well as touch controls on a phone.
The solution
We developed Maison Éline as our own demo concept: a light-filled 3D salon with three zones, interactive product models and a separate catalogue. Visitors can walk freely, change the atmosphere, select a colour and size and follow a sample ordering process.
We created the interior, models, interface and motion as one browser-based experience.
A custom interior with three distinct zones
The salon, leather-goods area and atelier share one space with display cabinets, a central table and collection displays. Marble surfaces, metal accents, glass, textiles and modelled flowers establish the boutique’s light palette.
Geometry and materials were developed for real-time rendering with Three.js and WebGL.
Free exploration on desktop and mobile
On desktop, visitors move with WASD, arrow keys or scrolling and look around with the mouse. On a phone, an analogue joystick handles movement while a separate gesture controls the view.
We added smooth acceleration and stopping, furniture collisions and transitions to the three zones that route around furnishings. Free-look and fullscreen modes complete the controls.
Changing light and atmosphere
Three modes show the boutique in daylight, at sunset and in the evening. An automatic cycle blends between them, changing sunlight, shadows and interior lighting. The skylight and reflections contribute to the sense of depth.
A progress screen tracks loading and opens the space automatically once textures and the first frame are ready.
A collection with interactive 360° views
We created six sample products: two bags, a dress, a jacket, perfume and earrings, with 16 colour variants in total. Each model can be rotated, zoomed and viewed from different angles. The product window brings together colour and size selection, details and adding to the shopping bag.
The catalogue filters bags, clothing and accessories; clothing includes a size guide.
Shopping bag and demo order
The selected colour and size are kept in the shopping bag alongside quantities and the total in euros. Local storage preserves the selection after reloading. An order review and demo confirmation show the complete user journey.
The concept does not accept real payments, transmit orders or require personal or card details.