Статья переведена и опубликована с любезного разрешения uxpin.com
По данным Fortune, более 75% пользователей заходят в приложение всего один раз и никогда не возвращаются. Мы расскажем как сделать так, чтобы возвращались.
Понимание того, как пользователи взаимодействуют с приложением, крайне важно для оптимизации. Как дизайнеры и разработчики, мы должны понимать цели пользователя. Эти знания помогают определить наиболее распространенные точки трения во время выполнения задачи.
Разделите задачу на подзадачи если задача содержит много шагов и действий. Хороший пример — оформление заказа в приложениях электронной коммерции. Процесс разделен на несколько шагов, каждый из которых требует действия пользователя.
Используйте уже имеющуюся информацию о пользователях. Рассмотрим Uber в примере ниже — приложение не спрашивает пользователя о его местоположении, оно автоматически определяет местоположение на основе географических данных. В этот момент пользователю нужно только выбрать место погрузки.
Подскажите следующий шаг. Когда задача требует, чтобы пользователи выполнили ряд шагов, поддерживайте ритм анимаций, четко показывая, что будет дальше.
.gif)
Одно действие на одном экране. Используйте акценты для определения приоритетов важных элементов (например, контрастный цвет для основной кнопки вызова к действию).
Хороший дизайн пользовательского интерфейса — это предоставление соответствующей информации (сигнала) и избежание ненужной информации (шума).
Каждая добавленная кнопка, изображение, значок усложняет экран. Умеренный беспорядок еще терпим на огромном рабочем столе на мониторе, но совершенно не допустим на мобильных устройствах, где и так мало свободного места.
Покажите только то, что необходимо на текущем шаге. Например, когда пользователь делает выбор, откройте только те пункты, которые нужны для выбора, а детали покажите на следующих экранах.
Функции и контент не имеют значения, если люди не могут их найти.
Вот несколько правил навигации:
По возможности лучше использовать стандартные схемы — вкладки (для iOS) и панель навигации (для Android). Большинство пользователей знакомы с обоими шаблонами навигации.
Мобильный пользовательский интерфейс должен четко сообщать, какие элементы являются интерактивными и какие элементы статичны.
В отличие от рабочего стола, где пользователи могут использовать эффекты наведения (hover), чтобы понять, является ли что-то интерактивным или нет, мобильные пользователи могут проверить интерактивность, только нажав на элемент. Поэтому пользователи должны быть в состоянии предсказать, как элемент интерфейса будет вести себя, просто глядя на него.
Элементы управления должны иметь площадь касания 70-100 мм2, чтобы в них можно было точно попасть.
Убедитесь, что элементы расположены не слишком близко друг к другу, чтобы предотвратить ложный ввод.
Проектирование для больших пальцев — это не только создание достаточно больших целей, но и рассмотрение того, как мы держим наши устройства.
В то время как большой палец может охватить большую часть экрана на большинстве мобильных экранов, только треть экрана является действительно легкой территорией. Эта территория называется естественной зоной большого пальца. До других зон, держа телефон в одной руке, дотянуться невозможно. Основываясь на расположении рук (слева, справа или вместе), мы можем видеть, как выглядит безопасная зона на современном мобильном устройстве (см. зеленую зону на следующем рисунке).
Чем больше дисплей, тем меньшая область доступна.
Зато красная зона — лучшее место «опасных» элементов интерфейса, таких как удаление или стирание. Меньше вероятности вызвать эту опцию случайно.
Мы живем в мире прерываний. Что-то постоянно пытается отвлечь нас и направить внимание в другое место.
Например, пользователи могут использовать ваше приложение во время ожидания поезда. Облегчите пользователям возможность повторного взаимодействия с приложением после прерывания.
Twitter является одним из хороших примеров дизайна для прерывания. На экране уведомлений приложения отображаются все последние уведомления. Пока пользователь остается на этом экране, приложение не обновляет список автоматически – оно просто показывает статус “X новых уведомлений” в верхней части списка. Это позволяет пользователям не потерять свое текущее положение, когда они снова взаимодействуют с приложением после некоторого периода времени.
Мобильные приложения не живут в вакууме. Например, мобильные пользователи часто просматривают веб-сайт на мобильном телефоне, а затем переключаются на десктоп для покупки. Этот переход должен быть незаметным.
Spotify обеспечивает незаметный переход между устройствами. Вы можете настроить плейлист на Вашем Mac, и он будет мгновенно доступен на iPhone. При переключении между девайсами, приложение запоминает, где вы остановитесь.
Жесты являются скрытыми элементами управления. Томас Йос отмечает в своей статье«За пределами кнопки: охватывая интерфейс, управляемый жестами», самый большой недостаток жестов в пользовательском интерфейсе — это кривая обучения. Каждый раз, когда видимый элемент управления заменяется жестом, кривая обучения приложения растет. Это происходит потому, что жесты всегда скрыты. Вот почему важно использовать только широко распространенные жесты.
Хорошим примером подходящего для категории жеста является потянуть-для-обновления для приложений, похожих на ленты.
Ваше приложение должно быть быстрым и отзывчивым, но вы неизбежно столкнетесь с ситуациями, когда это не всегда возможно.
Например, подключение к интернету может быть слишком медленным. Вы не можете сократить загрузку, но можно сделать ожидание более приятным.
Шаблонный экран — это пустая версия страницы, в которую постепенно загружается информация. В отличие от анимированных загрузчиков, которые фокусируют внимание пользователя на факте загрузки данных, шаблонные экраны демонстрируют прогресс загрузки, а не время ожидания.
Экран ошибки не должен быть пустым, он должен дать понимание что делать дальше. Плохой пример ниже. Экран ошибки из Spotify не помогает пользователям понять контекст и не помогает найти ответ на вопрос: «Что я могу с этим сделать?»
Теперь сравните его с экраном NFL Fantasy. Сообщение об ошибке и читаемо и полезно. Экран показывает что пошло не так и, возможно, почему. Какой следующий шаг пользователь должен предпринять, чтобы исправить ошибку.
Когда приложение занято чем-то, вы должны сообщить пользователю, что приложение оно не зависло. Визуальные признаки прогресса дают пользователям чувство контроля над приложением.
Анимация это лучший инструмент для описания перехода между состояниями. Она помогает пользователям понять логику изменений макета страницы.
.gif)
В физическом мире объекты реагируют на наши взаимодействия. Люди ожидают аналогичного уровня реагирования от элементов управления цифрового пользовательского интерфейса.
Хорошая визуальная обратная связь делает взаимодействие удобным для пользователей. Все интерактивные элементы (например, кнопки) должны обеспечивать идеальную визуальную обратную связь.
Это очень важный аспект мобильных приложений на сегодняшний день. Это возможность связаться с пользователями и предоставить информацию, в которой они нуждаются.
Хорошим примером является Starbucks. Его приложение использует информацию, предоставленную пользователями (например, тип кофе, который они обычно заказывают) для создания специальных предложений.
В отличие от функциональной анимации, которая используется для улучшения четкости пользовательского интерфейса, восхитительная анимация используется для того, чтобы интерфейс стал более естественным. Этот тип анимации дает понять, что люди, создавшие приложение, заботятся о пользователях. Использование восхитительных деталей — это возможность создать эмоциональную связь с вашими пользователями.
Раздражающие уведомления-причина, по которой люди удаляют мобильные приложения (71% респондентов).
Каждое уведомление должно быть ценным и своевременным. Вот несколько вещей, которые следует учитывать при разработке push-уведомлений.
Слишком много уведомлений, доставленных за короткий период времени, может привести к ситуации, известной как уведомление overkill — когда пользователь не может обработать информацию и просто пропускает ее. Попробуйте объединить различные сообщения вместе, чтобы ограничить общее количество уведомлений.
Не только то, что вы хотите сказать — это важно, но и когда вы хотите это сказать. Не отправляйте push-уведомления в странные часы (например, в середине ночи). Лучшее время для push-уведомлений — пиковое время мобильного использования — с 6 вечера до 10 вечера.
Push-уведомление — это не единственный способ доставить сообщение пользователям. Используйте e-mail, уведомления в приложении и новости, чтобы уведомлять пользователей о важных событиях, которым вы хотите поделиться.
Как дизайнер, вы должны стремиться создать невидимый интерфейс, потому что такие интерфейсы удовлетворяют потребности пользователей и обеспечивают отличный пользовательский опыт.
Все советы указанные выше это просто отправная точка для старта. Сочетайте их с вашими собственными идеями для достижения наилучших результатов.
