Vsesmart.ru · Корзина и чекаут Онлайн-магазин гаджетов
и устройств умного дома
Проект был направлен
на оптимизацию клиентского сценария на этапе формирования корзины и процесса оформления заказа в мобильном и десктопном продукте (PWA), чтобы повысить конверсию и снизить отток клиентов на критическом этапе покупки.

Моя роль:
UX/UI дизайн, проектирование пользовательских сценариев, интерактивное прототипирование, обновление компонентов корзины, UX-тестирование, сопровождение разработки.

Домены:
eCommerce · B2C · Retail
vse-smart-mobile-case 1
Корзина в продакшене Мобильное приложение 0.4
image
image 157
Понимание задачи
Ситуация До редизайна 77% пользователей покидали сайт на этапе корзины/оформления заказа, что значительно снижало конверсию и выручку.
Задача Создать понятный путь от корзины до оплаты, в котором пользователю:
  • легко ориентироваться в содержимом корзины,
  • не терять контекст при переходе к доставке,
  • переходы между шагами четко выстроены.
Проблемы Бизнеса:
  • Слишком высокий процент отказов на этапе оформления заказа (77%)
  • Низкая конверсия в покупку.
  • Неразвитая система сопровождения корзины.
Пользователей:
• Перегруженный интерфейс корзины.
• Неочевидный блок выбора доставки.
• Отсутствие чёткого пути к оплате.
Шаг оформления заказа
image
Аудитория Покупатели Vsesmart.ru:
  • Энтузиасты умного дома — ищут новинки
    и вдохновение в технологиях автоматизации.
  • Рационалисты — ценят пользу и удобство.
  • Скептики — требуют убедительного
    UX/информации об автоматизации дома.
  • Молодая аудитория — ожидает простой
    и современный интерфейс.
Моя роль Senior Product Designer:
Проектирование UX/UI корзины, создание сценариев и flows, интерактивное прототипирование web/mobile, UX-тесты, работа с метриками, дизайн-система и взаимодействие с dev/PM.
Цели Бизнес-цели:
• Снизить отток пользователей на этапе чекаута.
• Повысить конверсию в покупку.
• Увеличить добавления в корзину и Retention.

Пользовательские цели:
• Упростить путь оформления заказа.
• Минимизировать визуальный шум.
• Сделать ключевые шаги очевидными и прозрачными.
Критерии успешности
Снижение Bounce Rate:
с 77% → ≤ 62%

Рост конверсии оформления заказа:
с 44% → ≥ 74%

Увеличение Retention Rate:
+85% за квартал

Увеличение добавлений в корзину:
+43%

Рост конверсии добавления в корзину:
+22%
Шаг выбора оплаты
image
image 156
Исследование
и контекст
Что нужно пользователю продукта на самом деле?
Анализ текущей корзины и работы пользователей, UX-коридорки и качественные интервью помогли выявить болевые точки на пути к покупке.
Основная цель исследования: Понять, где пользователи теряют мотивацию на этапе корзины/оформления заказа, какие сценарии повторяются и какую информацию им действительно важно видеть на каждом шаге.
Инсайт: Ключевые боли пользователей были связаны с:
  • перегрузкой интерфейса корзины;
  • непрозрачным выбором способа доставки;
  • отсутствием чётких признаков прогресса в оформлении заказа.
image 148
Мобильная версия
в разработке
Пожалуйста, откройте проект
с компьютера для полного
просмотра кейса
В продакшене Версия 2.2
Оформление-Корзины
image 156
Понимание задачи
Ситуация До редизайна 77% пользователей покидали сайт на этапе корзины/оформления заказа, что значительно снижало конверсию и выручку. Помимо оттока пользователей на этапе оформления заказа была низкая конверсия и низкий retention rate.
Задача Создать понятный путь от корзины до оплаты, в котором пользователю:
  • легко ориентироваться в содержимом корзины,
  • не терять контекст при переходе к доставке,
  • переходы между шагами четко выстроены.
Проблемы Бизнеса:
  • Слишком высокий процент отказов на этапе оформления заказа (77%)
  • Низкая конверсия в покупку.
  • Неразвитая система сопровождения корзины.
Пользователей:
• Перегруженный интерфейс корзины.
• Неочевидный блок выбора доставки.
• Отсутствие чёткого пути к оплате.
Аудитория Покупатели Vsesmart.ru:
  • Энтузиасты умного дома — ищут новинки
    и вдохновение в технологиях автоматизации.
  • Рационалисты — ценят пользу и удобство.
  • Скептики — требуют убедительного
    UX/информации об автоматизации дома.
  • Молодая аудитория — ожидает простой
    и современный интерфейс.
Моя роль Senior Product Designer:
Проектирование UX/UI корзины, создание сценариев и flows, интерактивное прототипирование web/mobile, UX-тесты, работа с метриками, дизайн-система и взаимодействие с dev/PM.
Цели Бизнес-цели:
• Снизить отток пользователей на этапе чекаута.
• Повысить конверсию в покупку.
• Увеличить добавления в корзину и Retention.

Пользовательские цели:
• Упростить путь оформления заказа.
• Минимизировать визуальный шум.
• Сделать ключевые шаги очевидными и прозрачными.
Критерии успешности
Снижение Bounce Rate: с 77% → ≤ 62%

Рост конверсии оформления заказа: с 44% → ≥ 74%

Увеличение Retention Rate: +85% за квартал

Увеличение добавлений в корзину: +43%

Рост конверсии добавления в корзину: +22%
image 156
Исследование и контекст Чтобы понять, где именно клиенты теряют мотивацию и почему не доходят до завершения покупки, на этапе discovery я начал с анализа текущего состояния корзины и оформления заказа.
Проведенные исследования:
  • Анализ клиентского поведения на этапе корзины и checkout по данным Яндекс.Метрики.
  • Изучение ключевых точек выхода и отказов в воронке оформления заказа.
  • UX-коридорные тесты и качественные интервью с клиентами для выявления болей и сомнений.
  • Анализ текущего интерфейса корзины с точки зрения когнитивной нагрузки и визуальной иерархии.
Основная цель исследования: Понять:
  • на каких шагах пользователи чаще всего теряют уверенность;
  • какие сценарии повторяются;
  • какую информацию пользователям действительно важно видеть в корзине и при оформлении заказа.
Ключевые инсайты: В ходе исследования стало очевидно, что основные проблемы связаны с:
  • перегруженной визуальной структурой корзины;
  • неочевидным выбором способа доставки;
  • отсутствием чёткого ощущения прогресса оформления заказа;
  • недостаточно явным отображением итоговой стоимости и выгод.
Эти инсайты легли в основу формулировки продуктовых и UX-гипотез для следующего этапа.
image 148
image 175
Гипотезы
Гипотеза 1 Когда пользователь просматривает товары
и добавляет их в корзину, ему важно быстро понять итоговую стоимость с доставкой
и скидками, чтобы принять решение
о покупке без сомнений.
Гипотеза 2 Когда пользователь возвращается в корзину спустя некоторое время, ему важно увидеть сохранённые товары и актуальные цены,
чтобы не собирать корзину заново
и
не терять интерес к покупке.
Гипотеза 3 Когда пользователь оформляет заказ, ему важно выбрать удобный способ доставки и оплаты
в несколько шагов,
чтобы завершить покупку
без стресса и лишних действий
.
Гипотеза 4 Когда пользователь видит ошибки
(нет товара, неверный адрес, карта
не прошла),
ему важно получить понятные подсказки, чтобы быстро исправить проблему
и не отказаться от покупки.
Гипотеза 5 Когда пользователь сомневается в товаре,
ему важно легко открыть карточку
и
сравнить характеристики, чтобы принять решение и не покинуть корзину.
Гипотеза 6 Когда у пользователя в корзине появляется акция или скидка, ему важно увидеть выгоду сразу, чтобы почувствовать ценность
и
увеличить вероятность покупки.
Сравнительный анализ Провёл анализ существующих решений на рынке (российского и зарубежного), чтобы посмотреть, как конкуренты решают похожие задачи: корзины и оформление заказа в eCommerce.

За основу для бенчмаркинга были взяты лучшие практики с сайта
hardclient.ru
Выводы:
  • Обычно корзина реализована через чёткую визуальную иерархию (блок с товарами, чек, подарки).
  • Разделение корзины и выбора способа доставки — распространённый паттерн в успешных магазинах.
  • Многие интерфейсы используют минимализм и акценты только для CTA и важных полей.

Это помогло уточнить паттерны и избежать очевидных UX-ошибок в прототипах.
image 177
image 178
image 193
Снимок экрана 2026-02-09 в 02.49.11 1
image 148
Sitemap и userflow (мобилка) Построена структура экранов корзины и всех связанных потоков (переходы, зависимости,
связи с товарами, доставкой, суммами, бонусами).
Sitemap
image 149
userflow (мобилка)
image 150
Корзина редизайн
Корзина 2.2 1
image 157
Решение
Шаг 1 — Просмотр корзины Первая итерация показала, что пользователи игнорируют блок доставки, расположенный низко
в интерфейсе → было принято решение выносить выбор доставки на отдельный шаг перед оплатой.
Шаг 2 — Выбор способа доставки Добавлен промежуточный экран с выбором способа получения заказа (ПВЗ, самовывоз).
Это улучшило навигацию и уменьшило потерю пользователей.
Шаг 3 — Получение заказа Сервисный UX получения товара. Выявил несколько жалоб от продавцов относительно офлайн точек продаж. Сделал помимо интерфейса советы по улучшению брендинга и взаимодействию
в точках продаж.
Прототипы и макеты Мобильная версия:
Интерактивный прототип на основе переработанных пользовательских путей.
userflow-map
Веб-версия:
Макеты корзины, отдельных шагов оформления, с акцентом на ключевые действия.
korzina-shagi
кейс все 1
image 158
Тестирование После формирования гипотез и первых дизайн-решений
я перешёл к их валидации через UX-тестирование.
  • Для этого были подготовлены интерактивные прототипы корзины
    и оформления заказа (desktop и mobile), которые позволяли
    пройти ключевые пользовательские сценарии от добавления
    товара до подтверждения покупки.
Цель этапа Проверить, насколько предложенные
дизайн-решения корзины и оформления заказа:
  • понятны пользователям без пояснений,
  • помогают уверенно двигаться к покупке,
  • снижают когнитивную нагрузку и количество
    сомнений на ключевых шагах.

Основной фокус — выявить причины потери пользователей на этапе
корзины и оформления заказа и проверить, решают ли их новые сценарии.
Что изменили по итогам тестирования По результатам тестов и анализа обратной связи были приняты следующие решения:
  • Упростили визуальную структуру взаимодействия клиента корзины,
    убрав второстепенные акценты и снизив визуальный шум.
  • Выделили ключевые этапы оформления заказа, чтобы пользователь
    лучше понимал прогресс и следующий шаг.
  • Вынесли выбор способа доставки в отдельный шаг — пользователям стало
    проще ориентироваться и принимать решение.
  • Усилили акцент на итоговой стоимости, скидках и выгоде,
    чтобы снизить сомнения перед покупкой.
  • Увеличили кликабельные зоны и основные элементы
    управления, особенно в мобильной версии.
  • Были предложены уникальные решения
    для устранения легаси внутри команд.
Final-makets
image 159
Результаты за квартал
Bounce rate (отказы): 77% → 62%

Конверсия оформления: 44% →
74%

Добавления в корзину дополнительных товаров
на этапе предпродажи:
+33%

Retention Rate:
+26%
Дизайн-система
Vsesmart.ru
Дизайн-система для eCommerce-продуктов
Проект был направлен на развитие существующего UI-кита
и его расширение до полноценной дизайн-системы
для автоматизации и стандартизации работы дизайнеров, продакт-менеджеров и разработчиков.

Моя роль:
Продуктовый дизайнер. Развитие дизайн-системы, проектирование и унификация компонентов, переход
от стилей к токенам, подготовка документации, внедрение DesignOps-практик и синхронизация с разработкой.

Домены:
Design System · E-commerce · B2C · Web & Mobile
Welcome Section 1