UXPUB

UXPUB - спільнота з 4,132 дизайнерів та креативних фахівців

Місце для обміну досвідом та дискусій навколо індустрії

Зареєструватися Увійти
Cover image for Серьезные ошибки UX, мешающие продажам
Редакція
Редакція

Опубліковано

Серьезные ошибки UX, мешающие продажам

#ux

Найдите и исправьте их с помощью этого руководства.

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

И электронная и мобильная коммерция находятся на подъеме, поскольку доступ к портативным устройствам становится все проще и проще. Об этом свидетельствуют следующие факты:

  • Сейчас примерно 4 из 5 американцев совершают покупки в Интернете, при этом более половины из них делают это с помощью мобильных устройств.
  • Вероятность, что пользователи, получившие отрицательный опыт использования вашего мобильного магазина снова, что-то купят у вас снижается на 62%.

В этой статье я покажу наиболее распространенные ошибки UX, которые встретила на веб-сайтах.

Всегда показывайте количество товаров в корзине. Сообщите пользователю, что внутри что-то есть

Корзина не показывает количество добавленного в нее товара

Мне понравился товар, поэтому я нажала кнопку «Добавить в корзину». А потом… бац… ничего не происходит. Нет фидбека. Иконка тележки ничего не показывает – просто находится в правом верхнем углу и не говорит мне, что на самом деле внутри нее что-то есть. «Был ли добавлен продукт? А может его нельзя купить? Стоит ли мне попробовать еще раз?». Я подумала, что это какая-то ошибка... и нажимала кнопку «добавить» снова, и снова, и снова... и, когда я наконец зашла в корзину, чтобы проверить ее, там был мой товар в количестве 10 штук.

Вывод: убедитесь, что в корзине отображается количество добавленных товаров, сразу после того, как пользователь нажал кнопку.

Сложно редактировать список покупок

Я хотела изменить количество товара (например, я случайно дважды нажала кнопку «Добавить в корзину»). Но нет простого способа сделать это. Закончилось тем, что мне пришлось удалить товар из корзины, и не было другого способа добавить его снова, кроме как заново искать его в каталоге. Я разозлилась и покинула сайт, не купив товар.

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

Слева: это невозможно прочитать. Справа: улучшена контрастность и читабельность

Кошмар с кнопками транзакций и призыва к действию

У этих элементов есть две основные проблемы.

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

Зачем тогда вообще его там размещать? Его не видно. Пользователи просто проигнорируют его. Конверсия с этих кнопок близка к нулю.

Вторая проблема: во время оформления заказа всего две кнопки: «Вернуться» и «Перейти к оплате», которые выглядят ОДИНАКОВО. С какой стати? Разве вы не хотите, чтобы ваши клиенты что-то покупали?

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

Слишком много всего происходит

Бывает, когда буквально все на сайте магазина кричит «ПОКУПАЙ МЕНЯ», «ПОСМОТРИ НА МЕНЯ», «НАЖМИ СЮДА». Это вызывает у меня чувство тревоги. Я не знаю, на чем сосредоточиться. Я чувствую себя подавленной и потерянной. Я вижу, вашему магазину есть что предложить, но хочу ли я узнать подробности? Скорее всего, нет. Прощайте.

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

Не скрывайте цену – из-за этого вы будете казаться неискренним

Цена скрыта

Знаю, знаю. Есть роскошные магазины, которые не показывают цены на товары, потому что это их маркетинговая стратегия (например, Chanel – мне нравятся их сумки и аксессуары, но цена всегда будет сюрпризом, для них все сводиться к опыту шоппинга в бутиках).

Но иногда и в обычных магазинах не указана цена. Или ее еле видно. Зачем так делать? Если мне нужна цена, я буду искать ее, несмотря на то, что вы скрываете ее от своих клиентов. Это очень раздражающий темный паттерн, и пользователи всегда жалуются на него.

Вывод: не скрывайте цену товара. Сделайте ее видимой и доступной.

Смена языка скрыта или невозможна

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

Вывод: убедитесь, что у магазина есть ​​английская версия (она может быть полезна для пользователя, даже если магазин не доставляет товары по всему миру). Поместите опцию переключения языка в легкодоступном / заметном месте.

Эти модальные и всплывающие окна выведут из себя любого пользователя

Важные элементы скрыты под модальными или всплывающими окнами

В основном это встречается в мобильных версиях магазинов, и меня это всегда поражает. Кто-нибудь вообще проверяет эти интернет-магазины, как они выглядят и работают на разных мобильных устройствах? Им может помочь контроль качества… Несколько реальных примеров:

  • Модальное окно «Политика cookie-файлов» или другой всплывающий элемент закрывает главную кнопку призыва к действию или покупки.
  • Всплывающие окна с предложением подписаться на новостную рассылку перекрывают призывы к действию, и их сложно закрыть.
  • «Чат-бот» или предложения «Я могу вам помочь?» перекрывают призыв к действию или часть навигации

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

Слева: слишком много странных, непонятных паттернов. Справа – проще по форме и понятнее

Непонятная навигация

Здесь также две проблемы:

  • Не которые категории скрыты под фотографиями или иконками и недостаточно заметны.
  • Навигация спроектирована в очень нестандартной креативной манере, и пользователю сложно понять и использовать ее.

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

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

Дизайн: HYPE4 (https://dribbble.com/dianahype4)

Чем проще и удобнее будет опыт, тем лучше. Процесс покупки должен быть максимально приятным и быстрым. Сообщите пользователю о его выборе. Не скрывайте важную информацию. Сделайте навигацию простой и понятной, чтобы пользователь не задумывался ни секунды. Лучше всего использовать широко известные паттерны. А если вы добавляете новые функции, всегда проверяйте, как они выглядят и работают как на компьютере, так и на мобильном устройстве.


Перевод статьи uxdesign.cc

Обговорення (0)