Интерфейс конфигуратора похож на компьютерную игру — у пользователя есть модель автомобиля, которую можно вращать и апгрейдить на свой вкус. В качестве точек персонализации мы выбрали два основных элемента: цвет кузова и стиль дисков. Все изменения вносятся в один клик и мгновенно отображаются на модели.

Чтобы оценить изменения в разных условиях, мы предоставили пользователю возможность открывать и закрывать двери автомобиля, переключать внешнее освещениие с дневного на ночное и включать/выключать фары.

Также конфигуратор позволяет осмотреть салон автомобиля переместившись на водительское сидение — после клика на соответствующий пункт меню, камера плавно перемещается вовнутрь 3D-модели, а пользователю открывается возможность обзора в формате 360°.

Для разработки проекта были задействовали только два инструмента: 

• Three.js — JavaScript-библиотеку для работы с 3D-графикой в браузере.
• Vue.js — фреймворк для разработки пользовательских интерфейсов.

Для чего нужны конфигураторы

Возможность самостоятельно регулировать внешний вид продукта позволит вашим клиентам создавать идеальные для себя образы, а значит — они с большей вероятностью останутся удовлетворены полученным результатом. Соответственно, это конвертируется в выгоды для вашей компании:

• Повышение лояльности и доверия к бренду.
• Снижение маркетинговых расходов.
• Увеличение конкурентоспособности.
• Повышение конверсии.

Кроме того, исследование Deloitte показывает, что клиенты готовы платить на 20% больше за персонализированные товары. Это означает, что вы также сможете повысить средний чек путем увеличения стоимости товаров.

3D-конфигураторы — это инновационный и многофункциональный инструмент, который полностью меняет подход к продаже товаров. Но eCommerce лишь один из вариантов их использования. Они также будут полезны в большинстве других сфер, включая производство технологичных продуктов, маркетинг и геймдев.