Моё хобби — шахматы.
Если вы захотите сыграть, ищите меня на chess.com и lichess.org под ником alex_yakovleva
Редизайн интернет-магазина
Westcar
Оптовый интернет-магазин автозапчастей для грузовых и легковых автомобилей, микроавтобусов, автобусов и тягачей
- КонтекстСайт устарел визуально и технически: покупателям было сложно искать и оформлять заказы, компания теряла часть клиентов, а менеджеры тратили время на ручную обработку заявок.
- ЗадачиТребовалось создать современный, понятный и функциональный интернет-магазин, который повышает доверие к компании, облегчает закупки и снижает нагрузку на сотрудников.
- Основные проблемы• устаревший визуал
• некорректность информации и неактуальность базы каталога
• плохая адаптивность сайта под мобильные
• нет акцентов на ключевых действиях
• неудобный функционал каталога и поиск
• ограниченный функционал личного кабинета - Моя рольНа проекте я выступала UX/UI-дизайнером: анализировала проблемы текущего сайта, предлагала решения и отрабатывала их вместе с продакт-менеджером и разработкой. Свои дизайн-решения презентовала и аргументировала напрямую заказчику.
Скрин главной страницы до/после
Для просмотра дизайна передвигайте бегунок ← →
Исследование
Проблемы и ожидания пользователей
Внутри аудитории выделили 3 основные роли, которые по-разному взаимодействуют с сайтом:
Все они сходятся в общих задачах:
На старом сайте это вызывало сложности — отсюда набор проблем, которые были решены в редизайне.
- закупщики СТО,
- менеджеры по снабжению,
- мастера/механики.
Все они сходятся в общих задачах:
- быстро найти нужную запчасть,
- оформить заказ без лишних шагов,
- контролировать финансы и заказы через личный кабинет.
На старом сайте это вызывало сложности — отсюда набор проблем, которые были решены в редизайне.
Конкурентный анализ
- ЗадачаПроанализировать крупных игроков рынка и понять, какие практики реально работают для пользователей, а какие решения создают барьеры.
- ЦельНайти баланс между «чистым e-commerce» и специализированным B2B-каталогом автозапчастей. Выделить референсы для редизайна: как должен выглядеть личный кабинет, поиск и каталог, что обязательно учитывать в мобильной версии.
- Результаты• Большинство конкурентов ограничивают функционал для неавторизованных пользователей. В редизайне я сделала акцент на доступности поиска и каталога сразу, без обязательной регистрации.
• У Автопитер удачный баланс визуала и функциоанльности, удобная фильтрация и качественная мобильная версия. Эти приёмы стали для меня ключевыми визуальными и функциональными референсами.
• Fixparts и Автоконтинент подтвердили важность личного кабинета в B2B-сегменте: там сосредоточен основной функционал. Но навигация и адаптивность у конкурентов реализованы слабо, поэтому я уделила особое внимание структуре и мобильной версии ЛК.
• Armtek показал хороший e-commerce подход, но их оптовый сайт выглядит значительно слабее розничного. В своём решении я сделала акцент именно на удобстве оптового заказа, чтобы не повторить эту ошибку.
Дизайн
Главная страница
В старом сайте фактически не было полноценной главной страницы: она состояла из хаотичных баннеров и бокового меню каталога.
Я собрала структурированную страницу, которая задала визуальный и смысловой стиль для всего сайта — чистый, системный, с понятными точками входа для пользователя.
В мобильной версии было решено сделать навигацию по основным разделам в виде таб-бара.
Я собрала структурированную страницу, которая задала визуальный и смысловой стиль для всего сайта — чистый, системный, с понятными точками входа для пользователя.
В мобильной версии было решено сделать навигацию по основным разделам в виде таб-бара.
Поиск
В B2B-сегменте пользователи редко переходят в категории каталога — они почти всегда ищут конкретную деталь по артикулу или VIN. Поэтому мы отказались от стандартного e-commerce каталога и сделали акцент на универсальной поисковой строке.
Корзина и оформление заказа
Корзина реализована по-разному для авторизованных и новых пользователей.
Для авторизованных добавлен функционал работы с несколькими договорами: можно перенести товары из одной корзины в другую в рамках одного контрагента. Это экономит время закупщика и позволяет работать с незавершёнными заказами, не теряя данных.
Для неавторизованных оформление доступно только после регистрации. Это помогает компании собирать базу клиентов и работать только с юридическими лицами.
Для авторизованных добавлен функционал работы с несколькими договорами: можно перенести товары из одной корзины в другую в рамках одного контрагента. Это экономит время закупщика и позволяет работать с незавершёнными заказами, не теряя данных.
Для неавторизованных оформление доступно только после регистрации. Это помогает компании собирать базу клиентов и работать только с юридическими лицами.
Корзина авторизованного пользователя
Корзина неавторизованного пользователя + Регистрация
Личный кабинет
В B2B-сегменте личный кабинет — это центр работы: заказы, финансы, договоры. На старом сайте он был перегружен, с путаницей в навигации и без адаптации под разные устройства.
В редизайне я выстроила структуру заново: убрала лишнее, добавила прозрачность по заказам и финансам, сохранив функционал в адаптивной версии для удобства работы в любых условиях.
В редизайне я выстроила структуру заново: убрала лишнее, добавила прозрачность по заказам и финансам, сохранив функционал в адаптивной версии для удобства работы в любых условиях.
Результаты
Разработана полноценная главная страница с фокусом на преимуществах компании и понятной структурой, что усилило доверие клиентов и улучшило первое впечатление о сервисе
Вместо громоздкого каталога внедрён универсальный поиск по артикулу, VIN и названию детали — пользователи находят нужный товар быстрее, без лишней навигации
Реализована «умная» корзина для авторизованного пользователя: поддержка нескольких договоров и возможность перемещать товары между ними
Добавлен блок финансовой информации в хедере (лимиты, кредиты, долги), что позволило клиентам оперативно контролировать взаиморасчёты без переходов в личный кабинет
Полностью переработан личный кабинет — история заказов, статусы и финансовые данные теперь собраны в одном интерфейсе, что сократило время на поиск нужной информации
Сайт стал полностью адаптивным, удобным для работы с планшетов и смартфонов
Визуальная система и навигация приведены к единому стилю — интерфейс стал современным, чистым и интуитивным
Вместо громоздкого каталога внедрён универсальный поиск по артикулу, VIN и названию детали — пользователи находят нужный товар быстрее, без лишней навигации
Реализована «умная» корзина для авторизованного пользователя: поддержка нескольких договоров и возможность перемещать товары между ними
Добавлен блок финансовой информации в хедере (лимиты, кредиты, долги), что позволило клиентам оперативно контролировать взаиморасчёты без переходов в личный кабинет
Полностью переработан личный кабинет — история заказов, статусы и финансовые данные теперь собраны в одном интерфейсе, что сократило время на поиск нужной информации
Сайт стал полностью адаптивным, удобным для работы с планшетов и смартфонов
Визуальная система и навигация приведены к единому стилю — интерфейс стал современным, чистым и интуитивным
*принадлежит корпорации Meta, которая признана в РФ экстремистской
Какой проект хотите посмотреть дальше?
