UX и UI-дизайнеры всё ещё со скепсисом смотрят в сторону голосовых интерфейсов. Одним кажется, что это маркетинговый хайп, который скоро сойдёт на нет. Другие не пользуются голосовыми ассистентами и поэтому уверены, что голос — это неудобно и неестественно. Но пока они сомневались, сложилась самостоятельная профессиональная сфера — со своими секретами, паттернами и механиками (и даже рынком труда). Вместе с UX-архитектором Just AI Екатериной Юлиной разбираемся, как подступиться к голосовым технологиям и что в своем мышлении должен изменить UX-дизайнер традиционных интерфейсов, берясь за голосовые.



Но для начала немного ретроспективы. На дворе 1995 год. Microsoft выпускает ОС Windows 95, и в мире происходит революция. Помню, как родители и прочие взрослые говорили о пользе и вреде компьютера. А по выходным мы всей семьей ходили в гости к друзьям, чтобы поиграть в «Косынку» и «Сапера».

В 2000-м вышла Nokia 3310. Мир снова изменился, на этот раз благодаря телефонам с кнопочным интерфейсом. Позже появились смартфоны со стилусами. У меня тоже был такой. Тыкать стилусом в экран было очень круто. Сразу как-то выделяешься на фоне людей с кнопочными телефонами. Но «лучший стилус — это ваш собственный палец», говорил Стив Джобс. В 2007 году Apple начинает продавать iPhone — и с тех пор люди тапают и свайпят, а тыкать стилусом уже давным-давно стрёмно.

А затем понеслось: 2011 год — Apple презентует Siri, в 2014-м Amazon выпускает Alexa и Amazon Echo, в 2016-м выходит Google Assistant, в 2017-м — «Алиса» от «Яндекса»… Перед разработчиками и бизнесом открылись двери в экосистемы ассистентов, как когда-то — в магазины мобильных приложений. И скоро только ленивый (и недальновидный!) не будет делать навыки для голосовых помощников.

Ситуации, когда голос — это действительно удобно

Невозможно представить, чтобы user experience (UX, пользовательский опыт) строился в вакууме. Голосовой навык рождается в конкретной ситуации, где он полезен и органичен, — бессмысленно создавать голосовой сценарий, а затем думать, где бы его применить. Важно эту ситуацию обнаружить и мастерски её обыграть.

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

В феврале 2019 года американский канал TNT транслировал матчи NBA. В перерывах между играми «Лос-Анджелес Лейкерс» и «Бостон Селтикс» комментатор Эрни Джонсон объявляет, что началась продажа лимитированных кроссовок Nike и что зрители могут попросить Google Assistant забронировать для них пару за $350.


Через шесть минут кроссовки исчезли. Более 15 тысяч человек забронировали их с помощью голосового ассистента (число заказов превысило количество доступного товара). Идеальной ситуацией для продажи баскетбольной обуви оказалась настоящая игра.





Ещё в 2017 году Starbucks придумала, как с помощью голосового ассистента сократить время ожидания заказа и путь клиента к желанной чашке кофе. Можно сказать «Alexa, order my Starbucks» («Алекса, закажи мой «Старбакс»») и забрать любимый напиток в ближайшем заведении уже через несколько минут. Не нужно стоять в очереди и ждать, когда бариста выкрикнет ваше имя. Не нужно заходить в приложение, искать свой обычный заказ, подтверждать выбор. Затем этот же кейс обыграла Ford: Alexa встроили в мультимедийную систему SYNC3, так что у водителей появилась возможность заказывать и оплачивать голосом свой Starbucks прямо в салоне автомобиля, не отвлекаясь от дороги.


А вот коллеги из компании Alan AI рассказали мне, как обнаружили прикладной юзкейс — уже не для маркетинговых, а для enterprise-задач. Техническому персоналу, обслуживающему лифты в США, приходится читать тонны документации, заполнять ряд бланков, вносить данные о ремонте, отчитываться о выполнении задач — и делать всё это в разных системах учёта. На писанину уходит много времени, в которое лифтёр фактически не работает. Alan AI применили технологии голосового искусственного интеллекта, чтобы пользователи-лифтёры могли заполнять бланки голосом в ходе работы или во время поездки на объект.

Голосовой UX — это не про картинки, а про контекст ситуации. Задача дизайнера — детально изучить контекст и понять, что пользователь захочет в конкретной ситуации.

UX-паттерны в голосе

Одна функция. Итак, один навык — одна функция. Если водитель заказывает кофе, то он решает эту конкретную задачу. Закончил с кофе и хочет узнать расстояние до Луны? За это отвечает уже другой голосовой навык. Делать швейцарский нож в одном навыке — дурная затея.

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

Модальные окна и кнопки. Второе название модальных окон — диалог. В чём суть модальных окон? Подтвердить или отказаться от намерения выполнить операцию. В реальной жизни люди выражают намерения, говоря да или нет, и для этого не нужны кнопки.

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

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

Кроссплатформенность. Другой аспект — как сделать один навык под несколько ассистентов. Механика и логика могут сохраняться, но дьявол будет скрываться в деталях реализации и пути пользователя до навыка. Посмотрим, как на одной и той же платформе выглядит путь к навыкам «Алисы» и действиям Google Assistant.

«Алиса» на iOS. Пользователям «Алисы» нужно сначала скачать приложение «Яндекс.Браузер», разрешить ему использовать локацию и микрофон, нажать значок ассистента и сказать активационную фразу навыка. Например, «Запусти навык «Да, милорд»». Второй и последующий опыт пользователя состоит уже из трёх шагов: открыть «Яндекс.Браузер», нажать на кнопку вызова ассистента, сказать активационную фразу.



Google Assistant на iOS. Пользователь скачивает приложение Google Assistant, авторизуется через аккаунт, разрешает отправку уведомлений и соглашается на доступ к микрофону. Если в телефоне по умолчанию выбран английский язык, то в интерфейсе приложения надо выбрать русский, попросить ассистента голосом поменять язык и сказать активационную фразу для вызова действия. Здесь она другая — «Говорить с приложением «Да, милорд»». Затем путь сокращается — во второй раз пользователь откроет приложение Google Assistant и просто озвучит команду.



Не зная активационную фразу (а команды вызова одного и того же навыка в разных экосистемах будут отличаться), навык не запустишь — и в плане UX это одно из слабых мест голосовых ассистентов. Но над задачей удобного skills discovery (как правильно донести до потребителей информацию о новых навыках) сейчас работают и Google, и «Яндекс», и другие компании, так что со временем находить полезные и актуальные в определённый момент навыки будет проще.

И, кстати, VUI-дизайнеры настаивают, что навык с одной и той же механикой для разных ассистентов — всё же отдельные проекты.

Проектирование интерфейса в семь этапов

Я спрашивала VUI-дизайнеров, коллег из Just AI и пользователей конструктора навыков Aimylogic, с чего они вообще начинают работу над сценарием. Все говорят «с идеи». Описать её можно в свободной форме в текстовом редакторе.

Павел Гвай, основатель tortu.io — инструмента для проектирования голосовых приложений: «Самый быстрый и дешёвый способ понять, как будет строиться разговор между пользователем и вашим приложением, — написать пример диалога. Это текстовый файл, описывающий работу какого-либо флоу. По формату примеры диалогов напоминают сценарий к фильму, где все реплики расписаны по ролям».

Пример диалога в Notion

Поприветствуйте пользователя

Расскажите, что делает бот. Используйте ёмкие фразы средней длины. Заканчивайте фразу закрытым вопросом: так пользователь поймёт, что от него хотят.
Плохо — «Привет! Я Активити. Не могу прожить ни дня без спорта. Он моё всё, моя жизнь, моё вдохновение! А ещё у меня большой опыт в качестве тренера и сотни упражнений в базе! С радостью поделюсь своими любимыми упражнениями с тобой!»
Хорошо — «Привет! Я Активити, бот-спортсмен. С радостью порекомендую тебе комплекс упражнений. Хочешь, расскажу про йогу?»

Проработайте пути пользователя

На языке программистов намерение — интент (английское intent). Аналогия с классическими интерфейсами — формализованный или неформализованный запрос. С формализованным работать проще, а неформализованный может превратить жизнь в кошмар.

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


Блок-схема в Miro

Часто блок-схема описывает основные развилки в голосовом навыке. Некоторые дизайнеры покрывают блок-схемой каждую деталь навыка. Павел Гвай делать этого не рекомендует, потому что она очень быстро перестанет быть читабельной, а внесение любых правок будет занимать уйму времени.

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

Создайте навигацию

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

Пример из жизни. Уже упомянутый мною навык «Да, милорд» (его аудитория в «Алисе» – 650 тысяч человек, к тому же он вошёл в число самых популярных игр для Google Assistant не только в России, но и в мире) — это атмосферная игра с музыкой, достойным синтезом речи, интересными сюжетами, игровой механикой. На старте пользовать мог управлять игрой только с помощью «Да», «Нет» и «Хватит». По сюжету игрок — милорд, владелец земель и крестьян, попадает в ситуацию «Ваша светлость! В наших благодатных краях найдены большие залежи меди! Изволите начать строить шахту?». Можно было бы и просто ответить да, но хочется же вжиться в роль и говорить, как подобает великосветской особе.

— Ваша светлость! В наших благодатных краях найдены большие залежи меди! Изволите начать строить шахту?
— Изволю!

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

Выпишите примеры диалогов и делайте ответы бота более разнообразными

Мои коллеги по Just AI пишут примеры диалогов в таблицах. Им так сподручнее, но это далеко не самый удобный вариант — описывать и логику, и возможные переходы. Кто-то пишет сценарии в Word. Какого-то единого формата и регламента описания нет.

Пользователей сильно раздражает, когда ассистент начинает повторяться. Гипотезу подтверждает Нелли Камаева, дизайнер Alan AI. Во время тестирования навыка для детей она видела, как быстро ребята теряли интерес, столкнувшись с одним и тем же ответом.

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

Загляните в «помойку» для нераспознанных намерений

«Помойка», или catch-all на языке программистов, — это место, куда по разным причинам попадают фразы пользователей.
— Я с кем вообще говорю? Ты робот?!
— Вы меня раскусили. Хотите продолжить общение?
Фраза «Я с кем вообще говорю? Ты робот?!» попадёт в catch-all (если вы её не предусмотрели сценарием). «Вы меня раскусили. Хотите продолжить общение?» — реплика по умолчанию при подобных ситуациях. Подумайте заранее, чем помочь пользователю, провалившемуся в catch-all.

Подумайте над голосом и характером

Вспомните собеседников, которые наводили на вас скуку. С ними неинтересно, разговор продолжать неохота, мы их называем нудными. То же самое происходит и при общении с навыками. «Алиса», Alexa и Google Assistant имеют свои Speech Toolkit с широким набором мужских и женских голосов, акцентов и звуковых эффектов для оживления речи бота вроде покашливания и пошмыгивания.

Если вы хотите впечатлить пользователя и вовлечь его в разговор, повозитесь со стилистикой речи, поработайте над синтезом: расставьте ударения, паузы и интонации. Это кропотливая работа, но, поверьте, результат того стоит. На внутреннем воркшопе коллега создала навык для Alexa — послушайте фрагмент:

— Hey, man. Awful weather, yeah? Wanna to get drunk? Let your old friend Joe mix you a good Irish drink. Ok?
— And now when you feel better, take your effing ass and go to the Joe's pub. There you will never drink alone. I'm waiting for you.

Ещё один способ работать с голосом — записать аудио с профессиональными актёрами. Долго, дорого, теряется гибкость, если вы захотите что-то добавить в сценарий, зато эффектно. Навык может говорить голосами знаменитостей, политиков и героев из фильмов (ну, нашу озвучку игры «Мир Лавкрафта» вы уже могли слышать, а вот как Google Assistant говорит голосом лауреата Грэмми Джона Ледженда — тык).

Для одного из бизнес-кейсов мы тоже использовали записи голосов профессиональных актёров. Только 0,5% клиентов смогли заподозрить (даже не догадаться, а заподозрить), что с ними разговаривает бот.

Для создания атмосферы используйте звуки и иллюстрации

Подобрать звуки можно из готовых библиотек или создать свои (Alexa привередлива к расширению файлов, поэтому придётся повозиться с конвертацией). В той же игре «Да, милорд» для «Алисы» звуки используются для создания атмосферы: ржание коня, ропот толпы, зловещий смех, волынка. А недавно в «Алисе» появился навык «Птицы России», где в беседе можно услышать, как поют и щебечут жаворонок, воробей или другие птицы.

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

И ещё советы от VUI-дизайнеров

Не учите интерфейсу. Язык — привычный и понятный интерфейс. Не надо учить человека говорить. Он это умеет.
Плохо — «Чтобы прослушать сообщение заново, скажите «Прослушать заново». Чтобы перейти к следующему сообщению, скажите «Перейти к следующему сообщению»».
Хорошо — «Послушаем сообщение ещё раз или перейдём к следующему?»

Задавайте закрытые вопросы. Рекомендую избегать открытых вопросов и открытого конца высказываний бота, пользователя нужно направить к действию.
Плохо — «Привет! Я Симфони, бот-меломан. С радостью порекомендую тебе альбом и расскажу про него».
Хорошо — «Привет! Я Симфони, бот-меломан. С радостью порекомендую тебе альбом и расскажу про него. Хочешь узнать про трек дня?»

Избегайте канцеляризмов. Очевидная рекомендация, которой мало кто следует. Никто из нас не хочет читать сложный и перегруженный текст, а уж слушать его тем более невыносимо.
Плохо — «Немаловажно иметь в виду, что дальнейшие альбомы этого исполнителя станут платиновыми, что позволяет сделать вывод о успешности данного дебютного альбома как средства эффектного выхода на международную арену».
Хорошо — «Дебютный альбом привлёк к исполнителю внимание всего мира. Недаром его следующие пластинки дважды стали платиновыми!»

Тестирование и обучение

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

Из личного опыта. На одном из воркшопов я проектировала фитнес-навык: по задумке Alexa сначала делала инструктаж, потом включалась музыка и человек повторял упражнение. Я с азартом тестировала всё на себе: прыгала и бегала под нарезанную музыку, меняла длину треков, повторяла упражнения множество раз и в конечном счёте UX навыка меня удовлетворил.

Провоцируйте и материтесь

Пользователи — провокаторы. Они проверят реакции навыка не по теме: навык для заказа пиццы, а пользователь — вроде очень хитёр — спросит про суши. Придумайте достойный ответ. И ещё поматеритесь от души. Я серьёзно! В Just AI есть чек-лист мата, который используют при тестировании.

Проговаривайте и переслушивайте

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

Обучайте навык

Но с первого раза всё в навыке вы не предусмотрите. Примите это и смиритесь. Вашему навыку потребуется дообучение. Читайте диалоги и анализируйте логи. Как это делать с помощью Python, в одном из выпусков «Школы Алисы» рассказывает Дарья Сердюк, NLP Research Engineer Just AI.

Инструменты дизайнера

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

Aimylogic
Конструктор с NLU-движком (natural language understanding, понимание естественного языка). Более 10 тысяч пользователей и более 1100 навыков для голосовых ассистентов с общей аудиторией в 1 млн пользователей. Есть бесплатная подписка и бесплатный демопериод на платных подписках.



В конструкторе можно создать сценарий, протестировать его и подключить более чем к десяти каналам («Алиса», Google Assistant, Telegram, «ВКонтакте» и другие). Есть техническая поддержка и сообщество в Telegram. Вот примеры нескольких голосовых навыков:

• «Одно из двух»
• «Да, милорд» («Алиса» и Google Assistant)
• «Сто к одному»
• «Рубль в день»
• «Зарядка для глаз»

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

Voiceflow
Графический конструктор Alexa Skills. Позволяет создавать Alexa Skills без навыков программирования. Подходит для UX-тестирования.

Flow.ai
Графический инструмент для создания чатботов. Позволяет создавать ботов без навыков программирования. Также подходит для UX-тестирования.

Материалы для прокачки

• Исследование Voice Tech об инструментах для голоса.
• Сайт-каталог инструментов для голоса.
• Github-репозиторий с инструментами для голоса.
• Telegram-чат, посвящённый разговорным интерфейсам. В канале не привязываются к конкретной платформе или инструменту, обсуждают всё от бизнес-составляющих и трендов до разработки и проектирования.
• Tools for Voice.

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

Опыт и материалы VUI-дизайнеров, упомянутые в статье, использованы с их согласия.

Благодарности:

Дмитрию Чечеткину, сооснователю и главе стратегических проектов, Just AI.
Дарье Сердюк, NLP Research Engineer, Just AI.
Павлу Гваю, основателю Tortu.io.
Нелли Камаевой, Product Designer, Alan AI.