Краснодар

+7 952  830 72 85

Москва

+7 495 134 25 57

Краснодар

+7 952  830 72 85

Москва

+7 495 134 25 57

Важные элементы дизайна приложения для магазина

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

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

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

Навигация

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

Рассмотрим пример наиболее распространенных сценариев при поиске пользователем определенного товара. Например, мужских шорт.

Сценарий 1

  • в меню пользователь выбирает мужской раздел;

  • в фильтре — «Шорты»;

  • попадает на экран результатов, где видит предложения по искомому товару.

Это хороший сценарий, который принесет ожидаемый результат без затруднений.

Сценарий 2

  • на главном экране клиент выбирает раздел «Одежда»;

  • выбирает «Шорты»;

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

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

Еще одно часто совершаемое в мобильных магазинах действие – отправление товара в «Избранное». Здесь также большинство магазинов используют один из двух сценариев.

Сценарий 1

  • пользователь нажимает на карточке «Избранное»;

  • приложение просит выбрать размер;

  • пользователь указывает размер;

  • отправляет товар в избранное;

  • читает сообщение об успешном добавлении.

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

Сценарий 2

  • на карточке пользователь выбирает «В избранное»;

  • в панели вкладок изменяется число товаров в «Избранном».

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

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

Главный экран приложения

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

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

Списки товаров

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

Карточка товара

Это — самый важный экран. Именно тут пользователь решает, станет он приобретать товар или нет.

Здесь у покупателя должна быть возможность рассмотреть товар с разных ракурсов, поэтому карточка должна быть снабжена галереей фото, а не одним снимком. Кнопка действия (добавления в корзину) должна быть заметной и сразу бросаться в глаза. Обеспечьте покупателю удобный выбор размера — например, указывайте и европейский, и русский размеры, составьте гид по размерам и т.д.

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