Разработка интерфейса корзины для интернет-магазина компании mr.Doors

сделать корзину интернет магазина
Описание проекта

Mr.Doors – это крупная российская мебельная компания с 25-летней историей, производящая мебель для жилых помещений, офисов и медицинских учреждений. Компания изготавливает мебель на заказ и предлагает готовые решения, подобные тем, что предлагает IKEA. В начале 2023 года Mr.Doors запустила интернет-магазин готовой мебели.

Проблематика

Основные проблемы, с которыми сталкивались пользователи интернет-магазина Mr.Doors, включали:

  • Запутанная и сложная форма заказа товара
  • Невозможность добавить сопутствующие товары в корзину
  • Сложный доступ к информации о доставке и оплате
оформление корзины интернет магазина
Цель проекта
  • Увеличить конверсию покупок за счет снижения количества брошенных корзин
  • Увеличить средний чек за счет добавления функционала сопутствующих товаров
  • Повысить удовлетворенность клиентов и укрепить имидж компании как удобного и надежного поставщика мебели
Метрики
  • Измерение процента посетителей, добавивших товары в корзину, от общего числа посетителей сайта
  • Конверсия оформления заказа: Оценка процента пользователей, успешно завершивших оформление заказа, от общего числа посетителей, добавивших товары в корзину
  • Средний чек заказа: Измерение средней суммы покупок одного пользователя
  • Количество брошенных корзин: Оценка количества корзин, которые были начаты, но не завершены
  • Уровень удовлетворенности пользователей
  • Время заполнения формы заказа
Процесс работы

Моя работа над обновлением интерфейса корзины интернет-магазина Mr.Doors была основана на тщательном и систематическом подходе.

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

Этапы, которые прошел проект:

  • Сбор данных и анализ: Я начала со сбора данных по старой версии корзины и тщательного анализа ее функционала и пользовательского опыта. Это позволило понять сильные и слабые стороны существующего дизайна.
  • Идентификация проблем: На основе собранных данных выявлены основные проблемы, с которыми сталкивались пользователи. Это позволило сосредоточиться на ключевых аспектах, требующих улучшений.
  • Формулирование гипотез: Я разработала гипотезы и концепции улучшений, основываясь на данных анализа и лучших практиках в области пользовательского интерфейса и опыта.
  • Создана новая дизайн-концепция для проверки гипотез
  • Тестирование и оптимизация: Мы провели тестирование обновленного интерфейса, чтобы убедиться в его эффективности и удобстве для пользователей.
сделать корзину интернет магазина
Обновленная страница корзины
сделать корзину интернет магазина
Оформление заказа
оформление корзины интернет магазина
Типографика и цвета

Выбор цветов и шрифта обусловлен текущим брендбуком компании 

оформление корзины интернет магазина
Адаптивная сетка

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

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

Также учтены особенности взаимодействия с мобильными устройствами, такие как:

  • Крупные и удобные для нажатия элементы: Все кнопки и поля ввода адаптированы под размер пальцев для предотвращения случайных нажатий.
  • Минимизация ввода текста: Использование автозаполнения, выпадающих списков и других способов уменьшения необходимости ручного ввода текста.
сделать корзину интернет магазина
Аналитика

На каждом этапе работы были использованы соответствующие методы тестирования, чтобы получить достоверные результаты и сделать обоснованные выводы.

Проедено A/B-тестирование, сравнивались текущая форма заказа с упрощенной версией. Упрощенная форма показала увеличение конверсии на 10.7%, сокращение среднего времени заполнения формы на 8.9% и уменьшение количества брошенных корзин

Проведн когортный анализ до и после внедрения кнопки "Добавить в корзину" для сопутствующих товаров в корзине. Новая функциональность позволила увеличить количество добавленных сопутствующих товаров на 28%, повысить средний чек заказа на 11%.

Проведено тестирование удобства использования (usability testing), предложив пользователям выполнить задачи, связанные с поиском информации о доставке и оплате. Результаты: Время на поиск информации сократилось, количество ошибок уменьшилось на 25%, а пользовательская удовлетворённость достигла уровня 4.5 из 5.

Результат

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

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

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