Как мы сделали редизайн интернет-магазина на 90 экранов за 2,5 недели

Кто клиент

Промышленная группа «Векпром» — один из крупнейших поставщиков станков и промышленного оборудования в России. В ассортименте более 50 000 наименований, склады площадью свыше 15 000 м² и единственный в стране демонстрационный зал оборудования. Сайт компании должен был отражать масштаб бизнеса и обеспечивать удобный подбор и покупку техники. Но за год работы с двумя подрядчиками и нескольких миллионов рублей проект не был завершен.

Компания обратилась к нам, в Tiqum, с задачей: разработать новый дизайн сайта с акцентом на UX и современный UI. Мы приняли вызов — выполнить всю работу за 2,5 недели. За этот срок мы спроектировали 21 уникальную страницу с адаптивами (всего около 90 экранов), подготовили UI-кит и полностью переосмыслили пользовательские сценарии.

От аналитики к решению

Первым этапом стало исследование: мы изучили поведение пользователей в B2B и B2C e-commerce, проанализировали десятки отраслевых и универсальных интернет-магазинов, составили таблицу паттернов и оформили референсы в мудборд. Это позволило создать логичную структуру сайта, где каждый шаг пользователя — понятен, а навигация не требует объяснений.

Удобная навигация — с первого клика

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

Страница товара — как рабочий инструмент

Карточка товара в B2B-сегменте — это не просто фото и цена. Мы спроектировали страницу, способную отразить:

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

Интерфейс решен через вертикальные табы: слева — разделы, справа — скроллируемый контент. Это позволило упростить восприятие и избежать перегрузки. Также мы добавили триггеры доверия: доставка, гарантия, сервис, оплата — каждый с кратким описанием, чтобы снять частые опасения клиентов.

Поиск и фильтрация — просто и понятно

При таком объеме каталога поиск — критически важен. Мы реализовали его в шапке и внутри категорий. Фильтр отображает выбранные параметры в верхней части страницы и позволяет их оперативно менять. Такой подход делает навигацию по 50 000+ товарам быстрой и интуитивной.

Масштабируемость и UI-кит

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

Мобильный приоритет

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