3D-конфігуратор авто
Технології:
- Three.js
- Vue.js
Інтерфейс конфігуратора схожий на комп’ютерну гру – у користувача є модель автомобіля, яку можна обертати та апгрейдити на свій смак. Як точок персоналізації ми вибрали два основні елементи: колір кузова та стиль дисків. Усі зміни вносяться в один клік та миттєво відображаються на моделі.
Щоб оцінити зміни в різних умовах, ми надали користувачеві можливість відчиняти та зачиняти двері автомобіля, перемикати зовнішнє освітлення з денного на нічне та вмикати/вимикати фари.
Також конфігуратор дозволяє оглянути салон автомобіля перемістившись на сидіння водія – після кліка на відповідний пункт меню, камера плавно переміщається всередину 3D-моделі, а користувачу відкривається можливість огляду у форматі 360 °.
Для розробки проєкту було задіяно лише два інструменти:
#Three.js – JavaScript-бібліотеку для роботи з 3D-графікою в браузері.
#Vue.js – фреймворк для розробки інтерфейсів користувача.
- Three.js
- Vue.js
Інтерфейс конфігуратора схожий на комп’ютерну гру – у користувача є модель автомобіля, яку можна обертати та апгрейдити на свій смак. Як точок персоналізації ми вибрали два основні елементи: колір кузова та стиль дисків. Усі зміни вносяться в один клік та миттєво відображаються на моделі.
Щоб оцінити зміни в різних умовах, ми надали користувачеві можливість відчиняти та зачиняти двері автомобіля, перемикати зовнішнє освітлення з денного на нічне та вмикати/вимикати фари.
Також конфігуратор дозволяє оглянути салон автомобіля перемістившись на сидіння водія – після кліка на відповідний пункт меню, камера плавно переміщається всередину 3D-моделі, а користувачу відкривається можливість огляду у форматі 360 °.
Для розробки проєкту було задіяно лише два інструменти:
#Three.js – JavaScript-бібліотеку для роботи з 3D-графікою в браузері.
#Vue.js – фреймворк для розробки інтерфейсів користувача.