Сайт-каталог Vympel GmbH

Группа компаний Вымпел уже четвертое десятилетие разрабатывает и производит инновационные измерительные комплексы и системы автоматизации для газовой промышленности.

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

Высокоточное оборудование производства Вымпел не имеет аналогов среди других лабораторий. Более того, использование новейших технологий и современных материалов обеспечивает безопасность эксплуатации самых разнообразных газоанализирующих приборов.

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

Вместе с тем, для составления структуры сайта и формировании общей дизайн-концепции нам потребовался глубокий этап аналитики. В большей степени он базировался на исследовании европейского рынка, ведь именно он является целевой аудиторией сайта.

Онлайн-симулятор Hygrovision Mini состоит из двух областей. Правая область представлена панелью управления. Здесь пользователь может с помощью специального ползунка изменять температуру зеркала для конденсата в большую или меньшую стороны, а также выбрать один из двух режимов освещения. Левая область содержит видео, которое отражает эти изменения. Симулятор помогает наглядно представить принцип работы анализатора, что делает его понятным для пользователя любого уровня подготовки.

В основе дизайн-концепции лежит детальная визуализации оборудования, которое производит компания. Мы разработали 3D-модели каждого из анализаторов и сделали вовлекающую анимацию на главной странице. Сайт учитывает все варианты пользовательского пути — заказать продукцию Вымпел можно как на главной странице, так и в соответствующем разделе. Более того, представлена возможность детального сравнения характеристик оборудования.

Мы также реализовали систему обучающих видеоуроков и создали интерактивный симулятор модели Hygrovision Mini. С их помощью пользователь может поближе познакомиться с продукцией компании и узнать, как настраивать и использовать анализаторы Вымпел.

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

Основным отличием этого проекта от всех прочих стало необычное решение по части внутреннего функционала — использовать 1C-Битрикс со стеком на React.js. От Битрикс остались только ядро и админка, предоставляющие удобные способы хранения информации и настройки логики сайта.

Однако все, что касается фронт части, было изменено. Мы полностью отказались от встроенной системы шаблонов и компонентов — каждая страница представлена уникальными блоками.

Теперь фронт реализован посредством REST API. Для того чтобы информация приходила на фронт в удобном для отображения формате, мы реализовали систему моделей и контроллеров, как и сами API, к которым фронт обращается для получения или передачи информации.

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