Задача:

Разработка конфигуратора и поддержка сайта

Клиент:

Genesis Motors

Виды работ:

Проектирование Axure, дизайн Figma, верстка VUE, программирование 1С-Битрикс.

Технологический стек:

Фронтенд: Vue.js/Vuex/SSR, Node.js
Бэкенд: Yii Framework, REST API

Нами был переосмыслен подход к визуализации и интерактивности интерфейсов.

Обновленный дизайн страниц

Мы освежили дизайн внутренних страниц, переосмыслили интерфейс и добавили в него интерактивности.

Преимущества новой версии конфигуратора

Улучшенный интерфейс

Улучшена визуализация и интерактивность интерфейсов

3D и обзор 360 градусов

Новые разделы Интерьер и Экстерьер теперь в 3D-панорамах 360

Улучшенная навигация

Теперь можно изменить комплектацию автомобиля, посмотреть варианты отделки экстерьера и интерьера без дополнительной навигации, всё на одном экране

Удобство выбора

Выбор вариантов отделки салона стал более наглядным и удобным

Отзывчивость и управление

Мгновенная отзывчивость интерфейса и последующее изменение контента, как будто ты управляешь реальностью

Новая архитектура

В основе архитектуры проекта лежит микросервисная парадигма. Посетитель взаимодействует с Frontend-приложением на Node.js, которое в свою очередь запрашивает требуемые данные из Backend-приложения посредством REST API.

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

Потрясающая отзывчивость

Использование технологии SPA и умного рендеринга Vue позволяет сайту мгновенно реагировать на действия пользователя. Открытие страницы за немыслимые 0,07 секунд при повторном посещении!

Это в 50 раз быстрее!

Преимущества фронтенда на Vue.js

SSR (Server Side Rendering)

Технология сохраняет показатели SEO статичных сайтов и при этом дает возможность в полной мере (без исключений) пользоваться возможностями SPA-приложений.

SPA* и мгновенная реакция на действия пользователя

• При переходе между страницами не требуется полная перерисовка страницы, загружается только новый контент
• Эффективная отрисовка Vue. Фреймворк умеет не просто заменять старый код новым, а использовать существующие элементы DOM для достижения максимальной скорости рендеринга

Современный протокол HTTP/2 и HTTP/2 Server Push

• Мультиплексирование - браузер не выполняет отдельные запросы для передачи каждого файла
• HTTP/2 Server Push - возможность передачи в браузер необходимых ресурсов по инициативе сервера, предзагрузка файлов в фоне
• Обязательность TLS (SSL)
• Ускорение загрузки страниц