Объединение графических и голосовых интерфейсов для улучшения UX

Каковым видится будущее графических пользовательских интерфейсов в связи с появлением голосовых интерфейсов, искусственного интеллекта и чат ботов?

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

Перевод статьи Дэвида Пазтора “Combining Graphical And Voice Interfaces For A Better User Experience”.

Органы чувств и информация. Каковы наши первичные датчики?

Актуальной в наши дни остаётся прописная истина, что картинка заменяет собой тысячи слов. Наш мозг – невероятная машина, обрабатывающая изображения. Мы можем быстрее понять сложную информацию, если она будет дана нам визуально. Согласно некоторым исследованиям, даже когда мы разговариваем с кем-то, невербальное общение занимает 2/3 разговора. Есть также другие исследования, согласно которым мы обрабатываем большую часть информации благодаря наблюдению (83% зрением, 11% слухом, 3% обонянием, 2% осязанием и 1% вкусом). Если коротко обобщить, глаза – наши первичные датчики.

Уши – наш второй по важности датчик. В некоторых ситуациях вербальное общение является наиболее эффективным каналом связи. Представьте на мгновение переживание опыта покупки чего-либо. Заказ любимой пиццы становится намного проще, если позвонить и быстро заказать её вместо того, чтобы рассматривать все предложения и рекламу на веб-сайте. Хотя в более сложной ситуации полагаться только на вербальное общение недостаточно. К примеру, станете ли вы покупать обувь, ни разу не взглянув на выбранную пару? Очевидно, что нет.

Обычным явлением является вводить визуальные элементы в текстовые платформы обмена сообщений. Не случайно, что Facebook в первую очередь реализовал идею добавления визуальных фрагментов в пользовательский интерфейс чатов. Зачастую некоторая информация становится понятнее, когда мы её видим.

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

Дизайн голосовых опытов

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

Приспосабливающиеся мультимодальные интерфейсы

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

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

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

Интерфейсы будут приспосабливаться к людям, используя наиболее удобные для них в конкретной ситуации средства и формат сообщений. Давайте рассмотрим некоторые имеющиеся примеры, включая изученные нами в UX Studio., а также некоторые коммерческие продукты.

Чат боты становятся всё более визуальными

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

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

Некоторые компании, например, Tencent в Китае, пошли ещё дальше и позволили разработчикам проектировать мини-приложения, которые запускаются в их собственном WeChat. Это вдохновило западных дизайнеров на создание диалогового интерфейса, в котором каждое отдельное сообщение может содержать другое приложение, содержащее собственный богатый интерфейс. К примеру, вы можете проходить небольшие игры вместе с вашим собеседником, что было доступно 15 лет назад в MSN Messenger. Также это является попыткой улучшить простой диалоговый интерфейс, в котором люди любят обильный набор функций.

Самоуправляемые автомобили со смешанными интерфейсами

Год назад наша команда спроектировала интерфейс самоуправляемого автомобиля в качестве упражнения в мультимодальном дизайне. Мы представили целый процесс и попытались оптимизировать взаимодействие на каждом шаге.

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

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

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

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

Домашние развлечения и цифровые помощники

Консоль Xbox с регулятором Kinect является ещё одним примером смешанного интерфейса. Графическим интерфейсом можно управлять как голосом, так и жестами. В приведённом ниже ролике можно видеть, что технология распознавания жестов в настоящий момент далеко не идеальна, но в будущем она безусловно станет лучше. Распознавание голоса тоже пока затруднительно тем, что перед каждой командой нужно произносить волшебное слово “Xbox”.

Несмотря на технические недостатки, это хороший пример того, как машина может давать постоянную визуальную обратную связь голосовым командам и жестам. Когда вы используете свою руку в качестве элемента управления, можно увидеть небольшую руку на экране, которая заменят курсор. Когда вы перемещаете курсор выше различных панелей с содержанием, устройство всегда выделяет текущую под ним, чтобы показать, какую из них вы можете сейчас активировать. Когда вы говорите слово “Xbox”, чтобы дать команду, консоль отображает командное слово на каждой панели зелёным цветом, чтобы вы знали, что сказать при выборе нужного элемента.

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

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

Свобода, которую даёт голосовой пользовательский интерфейс, захватывает, особенно в первое время использования. Например, готовить на кухне и говорить “играть Red Hot Chili Peppers” проще, чем прокручивать альбомы в Spotify грязными руками.

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

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

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

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

Одним из главных преимуществ Google Home, главного конкурента Echo, является возможность задать дополнительные вопросы. К примеру, задав вопрос “Какое население Будапешта”, вы можете затем спросить “Какая там погода”. Google Home определяет, что вы спрашиваете о том же самом месте. Контекстная осведомленность – отличная функция и будущее подобных продуктов.

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

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

Amazon Echo и Google Home дают приятную визуальную обратную связь, принимая вопрос и находя ответ. Оба приложения используют светодиодную анимацию. Для мультимодальных интерфейсов важно поддерживать синхронизацию голосовых и визуальных данных, иначе пользователь легко запутается. К примеру, когда мы разговариваем с кем-то, мы можем просто посмотреть на лицо собеседника, чтобы понять, получает ли он информацию. Вероятно мы ожидаем увидеть то же самое, когда задаём вопрос разработанному для поиска ответа продукту.

Пример из издательского дела

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

Как выбрать основной режим?

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

Визуальные пользовательские интерфейсы работают лучше, если нужно показать:

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

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

Команд в ситуациях, когда пользователь точно знает, что он хочет получить, чтобы пропустить навигацию и просто продиктовать запрос
Инструкций для пользователя, так как люди склонны лучше следовать голосовым инструкциям нежели письменным
Звуковой обратной связи с различными сигналами при успехе или ошибке
Предупреждений и уведомлений, потому что реакция на звук быстрее
Простых вопросов, ответы на которые также относительно просты

Что дальше?

Когда я спросил своих друзей-дизайнеров, какие смешанные интерфейсы они знают, некоторые упомянули легендарное видео MIT Media Lab 1979 года под названием “The Put That There”. Помимо ностальгии шокирует, что подобная технология имела рабочий прототип еще 38 лет назад. Является ли наш сверхбыстрый прогресс иллюзией?

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

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

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

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

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

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

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

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

История повторяется, так что будь её частью

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

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