UX улучшения для вас

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

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

• Из-за чего некоторые пользователи могут столкнутся с проблемами при успешной оплате на вашем веб-сайте?
• Что побуждает их совершать покупки?
• Что может вызвать разочарование у новых или постоянных покупателей?
• Не перегружаете ли вы поле оформления заказа лишними уточнениями??!

Если клиент решил сделать покупку с вашего сайта, дерзайте! Вы должны максимально упростить ему работу.

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

Краткое описание проекта

Клиент в основном сталкивался с проблемой низких показателей конверсии на своем существующем веб-сайте электронной торговли, где он продавал книги и другие канцелярские товары в США и Канаде.

Примечание. В этом примере я не собираюсь охватывать весь UX в области электронной коммерции. Я буду решать проблемы, с которыми сталкиваются пользователи после того, как они выбрали и добавили свой продукт в корзину для покупки.

Существующие проблемы на сайте

На сайте было две основные проблемы:

1. Высокий процент выпадения: были случаи, когда пользователи выпадали со страницы корзины на страницу доставки. После чего следовало перебрасывание пользователей со страницы доставки на страницу оплаты, что приводило к низкому коэффициенту конверсии.
2. Излишняя озабоченность в отношении безопасности платежей: не было никаких гарантий безопасности оплаты на веб-сайте. Ничто не могло гарантировать, что деньги клиента находятся в безопасности и отправляются через безопасный платежный шлюз.

Исследования: подробное раскрытие проблем

Я наблюдал за аналитическими данными, которые владелец магазина собирал у своих пользователей. Важно было понять, ПОЧЕМУ эти проблемы существуют на сайте.

С чего я начал?

1. Я начал с эвристического анализа всех страниц, которые пользователь должен пройти, чтобы завершить оформление заказа. Это было сделано для выявления проблем во время оформления заказа, расчёта количества кликов, необходимых для размещения заказа и выявления потенциальных проблем с удобством использования.
2. Я провёл некоторый конкурентный анализ, чтобы понять общие тенденции быстрого оформления заказа.
3. Провел многократные собеседования с заинтересованными сторонами, которые напрямую общались с клиентами, чтобы понять проблемы, с которыми они сталкиваются в текущем процессе оформления заказа.

Хорошо, теперь давайте погрузимся в UX улучшения.

Страница корзины

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

Чтобы сделать новую страницу более полной, я добавил на неё ещё 2 функции. Во-первых, функция регистрации, позволяющая охватить новых пользователей, которые хотят зарегистрироваться на вашем сайте. Во-вторых — это функция восстановления пароля .

Страница доставки

В старом дизайне у страницы доставки было 2 основных проблемы:

1. Форма доставки была очень длинной, пользователям приходилось тратить уйму времени, для заполнения всех деталей, касающихся доставки.
2. Сводка заказа размещалась как внизу, так и вверху страницы. Это создало некоторую избыточность информации для пользователей.

Подобный контент может быть объединён, чтобы не вводить пользователя в ступор.

Решение: Форма адреса доставки была сокращена, сохранив достаточное количество деталей для успешной доставки. Например: поле с названием организации было пропущено, так как оно здесь необязательно.

Я объединил промежуточный и финальный результаты заказа в правой части страницы. Это не только экономит место, но и объединяет связанную информацию вместе.

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

Я также трансформировал индикатор прогресса, чтобы лучше оптимизировать пространство и дать визуальные подсказки пользователю по завершению определённых шагов.

Страница оплаты

1. Придерживаясь макета страницы доставки, я также поддерживал согласованность интерфейса и на странице оплаты.
2. Я добавил функцию безопасного сохранения карты для более быстрой проверки, когда пользователи будут возвращаться за очередной покупкой.

Просмотр заказа

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

Решение: я перенёс ввод / выбор промокода на страницу корзины, как и упоминал ранее.

Если пользователи хотят обновить информацию о доставке или оплате, они могут сделать это, используя опцию редактирования, представленную на странице.