Корпоративная платформа КЭАЗ
Разработка и UX/UI-дизайн персонализированной B2B-платформы с каталогом, интеллектуальным поиском и диджитал-айдентикой для лидера электротехнической отрасли
КЭАЗ — российский разработчик и производитель электротехнического оборудования и систем автоматизации
Ранее сайт функционировал как интернет-магазин, тогда как бизнес по своей сути является промышленной корпорацией с комплексными отраслевыми решениями и широкой продуктовой линейкой. Возникло несоответствие между реальным позиционированием компании и тем, как она воспринималась онлайн.
Выход на новые рынки потребовал комплексной трансформации бренд-платформы и переосмысления коммуникации в диджитал.
Контекст и задачи
Разнообразие целевых аудиторий и отраслей применения продукции задали направление работы над проектом.
Цели проекта:
• сместить фокус с отдельных продуктов к уникальным комплексным решениям и проектам по всей России;
• сохранить функциональность сайта для разных категорий целевой аудитории и SEO-трафик в каталоге;
• отразить отрасли применения;
• адаптировать новый фирменный стиль для диджитал;
• показать клиентские сервисы, усилив сервисную составляющую;
• проработать UX и навигацию, пересобрать информационную архитектуру сайта.
Мы сместили позиционирование компании в сторону отраслевой B2B-модели и развили сайт из продуктовой витрины в персонализированную платформу решений, отвечающую на запросы разных аудиторий. Особое внимание уделено представлению клиентских сервисов, улучшению навигации и пользовательского опыта при работе с каталогом.
Аналитика для проектирования B2B-платформы нового поколения
Проект начался с многоступенчатой аналитики и глубокого погружения в контекст заказчика. Анализ метрик старого сайта позволил отметить ключевые проблемные зоны: перегруженность главного экрана, сложность фильтрации и низкий уровень персонализации. Параллельно проведён бенчмаркинг десятков B2B-, сервисных и корпоративных платформ из различных сфер, что позволило выявить основные пользовательские паттерны и лучшие практики для интеграции.
Исследование и матрица потребностей аудитории
На основании выдвинутых гипотез и выявленных проблем мы провели глубинные интервью с 6 ключевыми стейкхолдерами КЭАЗ и 5 пользователями сайта. Это позволило уточнить контекст проекта, целевое состояние сайта, особенности аудитории и её запросы.
Платформа аккумулирует сразу несколько аудиторий, поэтому мы сформировали матрицу потребностей по ключевым сегментам с уникальными требованиями к интерфейсу и сценариям, включающую цели, боли, потребности и набор ключевых действий. Она стала основой для персонализированного проектирования структуры и навигации и позволила выделить основные контентные части, которые должны быть представлены на сайте.
Структура, User Flow и функциональная архитектура
На основе аналитики и матрицы потребностей сформированы гипотезы структуры сайта и ключевые User Flow для всех сегментов, учитывающие реальные сценарии пользователей, бизнес-приоритеты и функциональные роли страниц. Структура соответствует поведению разных аудиторий, исключает дублирование и выстраивает логичную иерархию контента.
Сайт объединяет сервисные разделы — калькуляторы, конфигураторы — с коммерческими и имиджевыми блоками, чтобы каждая из аудиторий могла быстро находить информацию, использовать инструменты и совершать закупки.
Прототипирование
Созданы прототипы более 100 страниц, включая каталоги, карточки продукции и корпоративные разделы. Главная страница, внутренние страницы и личный кабинет прошли юзабилити-тестирование, что позволило уточнить интерфейс и скорректировать UX-логику.
В процессе проектирования учитывались многоаспектная целевая аудитория и бизнес-требования заказчика. Продуманные сценарии входа и последовательность действий сокращают лишние шаги. Каждый элемент обсуждался с командой заказчика и сопоставлялся с результатами аналитики и исследований.
Инженерный дизайн
Фирменный стиль и атрибуты бренда адаптировали и развили в новые элементы диджитал-айдентики, консистентные с основным стилем компании
Концепция построена на балансе визуальной выразительности и функциональности. Умеренная динамика и «воздушность» обеспечивают логичное восприятие контента, подчёркивают технологичность и надёжность с учётом ценностей и миссии компании и отвечают на запрос создания сайта, «который раньше не получилось бы представить в веб-пространстве».
Типографика сочетает техническую строгость и человечность, обеспечивая высокую читаемость и визуальную чистоту интерфейсов. Виджеты и графические заглушки для баннеров, видео и сервисных блоков формируют единую визуальную «красную нить» проекта.
Таким образом, мы нашли баланс между удобством и визуальной выразительностью.
Айдентика
На основе контрформы логотипа создали линейную графику, которая может использоваться в качестве фона обложек, карточек и баннеров, формируя визуальную преемственность и иерархию восприятия. Система кастомизированных иконок включает переработанные изображения и уникальные контуры продукции. Добавили 3D-элементы для передачи ощущения технологичности.
Акцент на продукте
Доработали фотостиль и инфографику и интегрировали их в интерфейс, чтобы продукция оставалась центральным объектом восприятия, а интерфейс — информативным и лёгким.
Профессиональные изображения оборудования прошли ручную обработку, включая цветокоррекцию и работу с фактурами и светом.
Калькуляторы, конфигураторы и профильные сервисные страницы стали рабочими инструментами для инженеров, технологов и монтажников, а пошаговые сценарии, технические схемы, графики и чат-бот учитывают их профессиональные потребности.
Меню и навигация
Исходили из гипотезы, что верхнее мега-меню и боковое меню упрощают навигацию, а хлебные крошки на внутренних страницах помогают пользователям ориентироваться.
Главная страница
Анализ показал, что пользователи активно пользуются поиском по сайту и баннером на первом экране, однако мало внимания уделяют разделам с информацией о компании. Мы сохранили баннеры с актуальной информацией на первом экране, дополнив функционал и расширив возможности поиска.
Каталог
Пользователи разделились на тех, кто искал товары по названию, и тех, кто искал по артикулу, при этом структура каталога была понятна не всем.
Мы акцентировали внимание на поиске как ключевом функционале раздела. Для этого выстроили навигацию по категориям в виде древовидной структуры и переработали карточки товаров, усилив акценты в информации и подчеркнув возможность фильтрации по новинкам.
Многоуровневая фильтрация учитывает взаимосвязанные параметры и адаптирована для наглядности и удобства разных сегментов аудитории.
UI-кит и передача в разработку
Подготовили комплексный UI-кит с адаптивными макетами, типовой структурой блоков, правилами анимаций и подробными комментариями для внешней разработки. Он обеспечивает консистентность, воспроизводимость и масштабируемость интерфейса, минимизируя риски ошибок на этапе вёрстки.
Результат
Мы переосмыслили e‑commerce‑платформу для B2B, превратив её в современную диджитал‑платформу, построенную на данных, реальных сценариях использования продукта и лучших практиках дизайна, с фокусом на опыт, удобство и персонализацию.
Сместив акцент с отдельных товаров на комплексные решения, платформа отражает масштаб компании, объединяет направления бизнеса и предоставляет функционал для разных сегментов аудитории.
Обновлённая структура каталога и отраслевой подход сократили время поиска информации, увеличили глубину просмотра и повысили повторные визиты и вовлечённость пользователей. Платформа стала рабочим инструментом: она объединяет экспертизу, сервисы и профессиональные функции, соединяет коммерческие и имиджевые цели и сохраняет гармоничный баланс между удобством и визуальной эстетикой.
