Обращаемся к свету: как мы сделали онлайн-каталог в формате «светового ателье» для бренда Световые Технологии

Обращаемся к свету: как мы сделали онлайн-каталог в формате «светового ателье» для бренда Световые Технологии

Световые Технологии — крупнейший производитель и поставщик современных светотехнических решений с 25-летней историей, лидер на рынке профессионального освещения в России и странах СНГ.

С момента запуска первого производства в 1998 году компания разрабатывает комфортное освещение и светотехнические решения для городской инфраструктуры (автомагистрали, больницы, парки), образовательных и спортивных учреждений (школы и детские сады, университеты, стадионы, ледовые арены и горнолыжные трассы), промышленных предприятий (склады, производственные помещения в аграрной, энергетической, лесной и тяжелой промышленности), отелей и гостиниц, АЗС и судостроительной отрасли.

К 25-летнему юбилею бренда Световые Технологии обратились к АЭРО за редизайном онлайн-каталога и обновлению визуальной концепции компании. Девиз Световых Технологий – уверенность в решении. Это транслирует и обновленное цифровое пространство компании – комфортные решения, удобство использования, ответственность и профессионализм в каждом взаимодействии с брендом.

Задачи

Перед АЭРО стояли следующие задачи:

  • Полностью обновить визуальную концепцию бренда в онлайн-пространстве для закрытия потребностей широкой аудитории компании;
  • Внедрить продуктовый подход и помочь бренду выстроить продуктовые бизнес-процессы внутри компании;
  • Усовершенствовать пользовательский опыт с учетом множества запросов от разных сегмента аудитории;
  • Обновить IT-архитектуру сайта и обеспечить вывод информации из учетной системы (НСИ) в режиме реального времени;
  • Запустить проект в сжатые сроки к 25-летнему юбилею бренда.

Продуктовая концепция

Онлайн-каталог Световых Технологий, в некотором роде, необычный проект для АЭРО. На сайте пользователи не совершают прямых покупок, а используют его как рекомендательный ресурс и источник необходимых материалов для проектирования светотехнических решений. При этом базу аудитории составляют представители креативной индустрии – дизайнеры света и проектировщики интерьеров, архитекторы – а значит, важно учитывать, что онлайн-каталог для них во многом служит и источником вдохновения.

Изучив потребности пользователей и мировые практики, команда АЭРО пришла к концепции «бутик-ателье» световых решений, где несмотря на большое количество технологических деталей фокус делается на свет и его восприятие в разрезе каждого конкретного светильника. Особенность бренда в том, что Световые Технологии не просто продают световые приборы, а проектируют полноценные решения для крупных компаний в разных сферах с учетом дизайна, расчета освещенности и моделирования помещений с пересечением зон освещенности, нормативных и эстетических требований.

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

Разработка продуктовой концепции бренда выстроена на глубоких предпроектных исследованиях и опыте использования сайта самими пользователями. В ходе глубинных интервью АЭРО выделили основные болевые точки аудитории Световых Технологий:

– неудобная навигация по сайту с широким ассортиментом из более чем 9 тысяч осветительных решений;

– сложность подбора схожей по характеристикам продукции, взамен вышедшей из производства;

– отсутствие четкой структуры сайта;

– нехватка 3D-моделей товаров для бесшовного использования в дизайн и светотехническом проектировании.

Дизайн концепция

Свет – это то, с чем мы постоянно сталкиваемся, но практически никогда этого не замечаем.

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

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

АЭРО разработало дизайн нового цифрового каталога Световых Технологий, который позволяет пользователям почувствовать пространство и глубину, важность света для архитектурных решений и личных ощущений тех, кто ими пользуется.

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

Обращаемся к свету: как мы сделали онлайн-каталог в формате «светового ателье» для бренда Световые Технологии

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

Для каждого раздела появилось сквозное решение — боковое меню (сайдбар) с дополнительной информацией о серии товара и смежными разделами. Все продукты, необходимые в рамках одной задачи, мы постарались сделать на расстоянии 1-2 кликов, чтобы пользователю не приходилось каждый раз обращаться к поиску и работа с сайтом происходила нативно.

Каталог

В ходе UX-исследования пользователи отмечали неудобство каталога — при просмотре товаров по каждому сегменту приходилось скроллить вниз. Теперь же продукция и категории отображаются плиткой, что позволяет охватить одновременно больше товаров на странице.

Обращаемся к свету: как мы сделали онлайн-каталог в формате «светового ателье» для бренда Световые Технологии

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

Обращаемся к свету: как мы сделали онлайн-каталог в формате «светового ателье» для бренда Световые Технологии

Калькулятор освещенности

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

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

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

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

Обращаемся к свету: как мы сделали онлайн-каталог в формате «светового ателье» для бренда Световые Технологии

Архитектура

Поскольку основным запросом клиента было сочетание скорости разработки и оптимального финансового ресурса, АЭРО приняли решение выстроить IT-ландшафт на монолитной архитектуре. Такая комбинация позволила соблюсти сроки релиза проекта к юбилею компании благодаря скорости развертки на Битрикс, сохранив весь необходимый функционал благодаря точечному использованию микросервисов. Управление контентом осуществляется с помощью коробочной панели администратора Битрикса, а интеграция с клиентской НСИ на RabbitMQ отвечает за интеграцию и связь с шиной данных, дополнительные коннекторы обеспечивают frontend на React с использованием серверного рендеринга (SSR), backend разработан на PHP. Также во время разработки было выполнено 2 интеграции — с НСИ (системой с нормативно-справочной информацией), где содержались все документы по продукции, и с Битрикс24 для управления формами обратной связи.

Результаты

Благодаря слаженной работе команд АЭРО и Световых Технологий нам удалось выполнить проект в полном объеме и в рамках заложенного бюджета. От первичной аналитики до запуска MVP ушло 6 месяцев и заказчик смог презентовать обновленный сайт на 25-летии компании.

«Одним из этапов реализации стратегии цифрового развития нашей компании стало внедрение нового корпоративного веб-сайта. Учитывая сложность интеграции с внутренними системами хранения данных, специфические запросы целевой аудитории продукта и уже имеющийся опыт неудачного внедрения, этот процесс представлял собой непростую задачу. Отдавая себе отчет в важности данного проекта, мы подошли к выбору команды разработчиков со всей ответственностью, тщательно изучив рекомендации и портфолио потенциальных партнеров. Команда АЭРО нас не подвела!»
Нелли Шульга, руководитель ИТ-проектов в Световых Технологиях.

Что было сделано

  • Структура. Полностью переработали структуру сайта с учетом потребностей ЦА и современных трендов UI/UX, а также привязали каталог к новой структуре;
  • IT-стек. Внедрили новый стек технологий, обеспечивающий стабильную и обновляемую систему с доступной поддержкой и базой для дальнейшего развития;
  • Настройки. Обеспечили гибкость настроек разделов для наглядного отображения информации без привлечения разработчиков. Сократилась скорость изменения шаблона и стоимость поддержки в части настроек. Настроили 30 шаблонов под каждый тип продукции и 30 шаблонов по фильтрам;
  • Дизайн. Разработали новую дизайн-концепцию, отвечающая современным трендам, стандартам корпоративного стиля и отраслевой специфике. Всего 44 макета страниц для desktop и 88 страниц для адаптива. Создали качественную mobile-версию сайта.
11
Начать дискуссию