Говорящий интерфейс: строим диалог с пользователем

инт_фб

Качественный интерфейс не только красивый, но и информативный. Пользователь, в идеале, должен вести с ним диалог. Однако это не всегда получается. Как «разговорить» своё приложение или сайт — читайте в нашей статье.

Первый этап: анализ

Прежде чем делать наброски текста для интерфейса и интерфейса вообще, подумайте:

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

Целевая аудитория

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

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

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

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

Ситуация

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

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

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

Необходимый минимум

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

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

А вот это уже перебор

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

Например, замените поля «Выберите способ получения заказа» и «Планируемое время для приезда курьера» на «Курьер / Самовывоз» и «Жду курьера к …». Если текст можно понять неоднозначно, исправьте это. Например, текст в поле «Адрес» лучше переписать. Пусть будет «Район, улица, дом, парадная, этаж, квартира», так люди точно не перепутают.

Да, это будет объёмное поле. Но можно использовать справочники Google и Яндекса, чтобы варианты высвечивались по ходу набора. Также рекомендуется добавить функцию запоминания, чтобы клиент не тратил время при каждом визите.

Второй этап: предотвращение ошибок

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

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

Конечно, идеал недостижим, и всегда будут оставаться (или появляться) какие-то проблемы. Поэтому продумайте заранее свою систему подсказок и оповещений. Помните, что ваша цель — объяснить человеку, что произошло, почему это случилось и как всё исправить. Пишите с заботой и без шаблонов. 

Чем более «человеческим» и живым будет ваш язык, тем скорее и спокойнее клиент приступит к исправлениям. Да, такое обращение потребует времени для создания и места для размещения, но это поможет людям. И они не уйдут от вас после проблемы.

В случаях, когда клиенты намеренно искажают или недоговаривают свои данные, чтобы их не «завалили спамом» или не отследили (да, и такое бывает), предупредите их о возможных сложностях, например: 

  • неправильный телефон или e-mail — «Если у нас возникнут проблемы, то мы не сможем предупредить вас о том, что курьер опоздает»;
  • очевидная ерунда вместо имени и фамилии — «У вас очень необычное имя! Но, к сожалению, мы не можем занестит его в свою базу клиентов без подтверждения. А это значит, что мы не сможем предоставлять вам скидки и выгодные предложения. Поэтому, пожалуйста, представьтесь ещё раз или свяжитесь с нами для подтверждения»;
  • неполный адрес — «Пожалуйста, уточните свой адрес, чтобы курьер не потерялся, а вы не замёрзли (если зима) на улице. Не забудьте указать, как подъехать к парадной, чтобы пицца приехала максимально горячей!».

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

Третий этап: проверка

Второй этап завершён, а значит пути назад уже нет (ложь).

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

Протестируйте свой интернет-ресурс на реальных людях. Это можно сделать с помощью прототипов с работающими кнопками. Создайте их в InVision, Marvel или Flinto и дайте на растерзание толпе. Приложите к прототипу сценарий, в котором человек должен что-либо купить или оформить с помощью разработки.

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

Вариантов дальнейших действий 2:

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

2. Интерфейс устроил испытуемую группу, проблем не возникло, сценарий был выполнен — вы закончили работу. Доделывайте продукт, если всё функционирует корректно, пускайте его в работу.

Вывод

Интерфейс включает не только изображения, но и текст. Взаимодействие человека и приложения (или сайта) — это общение, как и в жизни. Вы можете передавать информацию невербально, но какова вероятность, что вас поймут правильно?

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