Vitra: Flagship Furniture Configurator
During my time at Build in Amsterdam, we were entrusted with building a flagship configurator for Vitra’s entire furniture lineup. While doing so, we not only improved the digital shopping experience at every step but also set the stage for a playful yet elegant new UI language for Vitra.com.
If you'd like to share our work publicly, we kindly request that you tag us visibly on the platform.
This ensures proper attribution, which is important in the creative space for recognizing the
effort and creativity involved. Including our website or account handle helps maintain transparency
and supports the ethical sharing of content.
CONFIGURATOR
The new configurator lives on every PDP of Vitra.com and serves as the flagships within Vitras digital Universe.
DESIGN AT SCALE
Vitra sells more than 640 different products from over 28 categorys. We designed a system that dynamically adapts to each use case.
Outcomes
Ø Annual Users
4.8m
Product Categories
28+
Configurable Products
645
If you'd like to share our work publicly, we kindly request that you tag us visibly on the platform.
This ensures proper attribution, which is important in the creative space for recognizing the
effort and creativity involved. Including my website or account handle helps maintain transparency
and supports the ethical sharing of content.
DESIGN SYSTEM
We not only improved the shopping experience at every step but also set the stage for a playful yet elegant new UI language for Vitra.com.
ACCESSIBLE FILTERING
To help users decide on a Fabric we designed a playful yet accessible filtering system.
ANIMATION
We strategically use animation to give the users a sense of space within the configurator.
DYNAMIC MODAL
To make the configurator accessible while not overloading it with UI Elements we build a dynamic modal for actions.
CUSTOM ICONOGRAPHY
We designed a playful Icon family for the Vitra Platform to let users quickly scan product features.
COMPARISON TOOL
We noticed that users have a hard time deciding between similar fabrics. To help them make an informed decicion from home we build a comparison tool within the configurator.
3D VIEWPORT
To give the user visual feedback on the adjustments he makes we use horizontal scrolling on mobile devices to make space for the 3D Model.
AUTO ROTATE
We let the 3D Model auto rotate from the start so that the users subconsciously start grabbing and interacting with it.
3D MANUAL
We noticed that the 3D View also can be used to explain how the product works. This lead us to also build a manual that is integrated within the PDP.