Привет, Хабр! Меня зовут Саша Терещенко, продуктовый дизайнер и я хочу сказать пару слов про то, что интерфейсы текстовых чат-ботов можно делать сильно лучше. Если приложить голову.

Чатовые интерфейсы меняют существующую парадигму взаимодействия и работы с интерфейсами. Раскин это предвидел 30 лет назад, но пришло это только сейчас. Интересные рассуждения по этой теме представил NNG в своей статье AI: First New UI Paradigm in 60 Years, и именно там содержатся большая часть ценных идей по улучшению чат-ботов.

Первым интерфейсом была перфокарта, вторым — консоль, третьим — GUI. Мы пришли к четвёртому типу.

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

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

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

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

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

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

Как строить чатовые интерфейсы и про что не стоит забывать при их проектировании

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

База

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

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

1. Давайте выборы вариантов ответа

   

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

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

   

2. Форматируйте текст

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

   

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

3. Добавляйте разный контент

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

   

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

4. Собирайте обратную связь

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

   

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

5. Показывайте обратную связь

   

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

6. Подстраивайтесь под формат

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

   

Как еще мы можем преобразить наши чатовые интерфейсы

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

1. Подсказки или подсказчики.

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

   

2. Ветвистость диалога.

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

   

   

3. Регулировка направленности ответов

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

   

Вместо заключения

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

Одним из новшеств в этой области является возможность загрузки изображений в GPT-4V. Это открывает двери для более глубокого взаимодействия между пользователем и искусственным интеллектом. Теперь не только текст, но и визуальная информация может быть источником для анализа, обработки и ответов от системы. С полными возможностями такой модели можно ознакомиться в этом посте на Хабре, где больше примеров из отчёта. И сам отчёт, где примеров еще больше.

Стоит упомянуть и еще один способ взаимодействия - через аудио. Такое микширование вариантов передачи информации уже создает уникальный пользовательский опыт, делая общение более естественным и динамичным. Сейчас встречается огромное кол-во цифровых ассистентов, которые, по сути, убирают оболочку взаимодействия с интерфейсом в виде GUI позволяя вам напрямую говорить системе, что вы хотите получить. Этот подход прекрасно подходит под фразу “Лучший интерфейс тот, которого нет” фактически реализуя его на практике.

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