Содержание
- 01. Установите личность
- 02. Используйте RiveScript
- 03. Создайте мозг своего бота
- 04. Создайте голос
- 05. Подача запроса
- 06. Не бойтесь чат-бота
В середине 2000-х виртуальные агенты и чат-боты службы поддержки вызывали много лести, хотя они и не были очень разговорчивыми, а под капотом они просто состояли из обмена данными с веб-серверами.
В настоящее время, несмотря на то, что существует огромное количество примеров `` слабого ИИ '' (включая Siri, Alexa, поисковые системы, автоматические переводчики и распознавание лиц) и другие темы, такие как адаптивный веб-дизайн, привлекают внимание, чат-боты по-прежнему вызывают ажиотаж. . Благодаря крупным инвестициям крупных компаний остается множество возможностей взломать диалоговые интерфейсы будущего.
- Как создать опыт взаимодействия с чат-ботом
Иногда у них плохая репутация, но чат-боты могут быть полезны. Им не нужно чувствовать себя простой заменой стандартной веб-формы, где пользователь заполняет поля ввода и ждет проверки - они могут обеспечить общение.
По сути, мы улучшаем взаимодействие с пользователем, чтобы оно выглядело более естественным, например, при общении с экспертом или другом, а не с указанием и щелчком в веб-браузере или мобильными жестами. Цель состоит в том, чтобы эта технология, обеспечивающая чуткие и контекстные ответы, стала неотъемлемой частью жизни людей.
Посмотрите видео ниже или прочтите, чтобы узнать о практическом способе разработки и создания чат-бота на основе реального приложения для приема проектов в практике сервис-дизайна.
01. Установите личность
Поскольку эта практика обслуживает более 110 000 участников по всему миру, целью было предоставить быстрый, удобный и естественный интерфейс, через который внутренние заинтересованные стороны могли бы запрашивать эффективные цифровые услуги, вместо того, чтобы заполнять запутанные формы.
Первым шагом было выявление личности чат-бота, так как это будет означать голос команды разработчиков сервисов для заинтересованных сторон. Мы опирались на основополагающую работу Ааррона Уолтера над дизайнерскими персонажами. Это очень помогло нашей команде развить черты личности бота, которые затем определили сообщения для приветствий, ошибок и отзывов пользователей.
Это деликатный этап, поскольку он влияет на восприятие организации. Чтобы убедиться, что у нас есть как можно больше информации, мы немедленно организовали семинары для заинтересованных сторон, чтобы выявить подходящие индивидуальные особенности, цвет, типографику, изображения и последовательность действий пользователя при взаимодействии с ботом.
После того, как мы получили все необходимые разрешения, включая поиск юриста, мы решили преобразовать устаревшие формы запросов в серию вопросов, которые имитировали беседу между заинтересованными сторонами и представителем нашей группы дизайнерских услуг.
02. Используйте RiveScript
Мы знали, что не хотим слишком углубляться в язык разметки AI для части обработки - нам просто нужно было достаточно, чтобы начать работу.
RiveScript - это простой API чат-бота, который достаточно легко изучить и которого достаточно для наших нужд. В течение нескольких дней у нас была отработана логика, чтобы принять запрос проекта от бота и проанализировать его с помощью бизнес-логики, достаточной для проверки и классификации, чтобы его можно было отправить через службы JSON REST в соответствующую внутреннюю очередь задач проекта.
Чтобы этот базовый чат-бот заработал, перейдите в репозиторий RiveScript, клонируйте его и установите все стандартные зависимости Node. В репо вы также можете получить представление о взаимодействиях, которые вы можете добавить с помощью различных примеров фрагментов.
Затем запустите папку веб-клиента, которая превращает бота в веб-страницу, запустив базовый сервер Grunt. На этом этапе вы можете улучшить опыт в соответствии со своими потребностями.
03. Создайте мозг своего бота
Следующим шагом будет создание «мозга» нашего бота. Это указывается в файлах с расширением .RIVE, и, к счастью, в RiveScript уже есть базовые возможности взаимодействия (например, такие вопросы, как «Как вас зовут?», «Сколько вам лет?» И «Какой ваш любимый цвет?').
Когда вы запускаете приложение веб-клиента с помощью соответствующей команды Node, HTML-файл получает указание загрузить эти.RIVE файлы.
Затем нам нужно сгенерировать часть мозга нашего чат-бота, которая будет обрабатывать запросы проектов. Наша основная цель - превратить подборку вводных вопросов по проекту в обычную беседу.
Так, например:
- Здравствуйте, чем мы можем помочь?
- Отлично, как скоро нам нужно начинать?
- Можете ли вы дать мне приблизительное представление о вашем бюджете?
- Расскажите подробнее о своем проекте ...
- Как Вы узнали о нас?
Типичная доступная веб-форма будет выглядеть так:
form action = ""> fieldset> legend> Тип запроса: / legend> input id = "option-one" type = "radio" name = "request-type" value = "option-one"> label for = "option- one "> option 1 / label> br> input id =" option-two "type =" radio "name =" request-type "value =" option-two "> label for =" option-two "> option 2 / label> br> input id = "option-three" type = "radio" name = "request-type" value = "option-three"> label for = "option-three"> option 3 / label> br> / fieldset > набор полей> легенда> Временная шкала: / легенда> input id = "one-month" type = "radio" name = "request-timeline" value = "one-month"> label for = "one-month"> 1 месяц / label> br> input id = "one-three-months" type = "radio" name = "request- timeline" value = "one-three-months"> label for = "one-month"> 1-3 месяца / label> br> input id = "four-plus-months" type = "radio" name = "request- timeline" value = "four-plus-months"> label for = "four-plus-months"> 4+ месяцев / label> br> / fieldset> br> label for = "request-budget"> Информация о бюджете / label> br> textarea id = "request-budget" name = "request-budget-text" rows = "10" cols = "30"> / textarea> br> label for = "request-description"> Описание / ярлык проекта> br> textarea id = "request-description" name = "request- description-text" rows = "10" cols = "30"> / textarea > br> label for = "request-reference"> Reference / label> br> textarea id = "request-reference" name = "request-reference-text" rows = "10" cols = "30"> / textarea> br > input type = "submit" value = "Submit"> / form>
С веб-формами мы хорошо знакомы с определенными шаблонами: вы нажимаете кнопку «Отправить», все данные формы отправляются на другую страницу, где обрабатывается запрос, а затем, скорее всего, появляется дерзкая страница с благодарностью.
С помощью чат-ботов мы можем принять участие в отправке запроса и сделать его более значимым.
04. Создайте голос
Чтобы преобразовать эту форму в диалоговый пользовательский интерфейс, обслуживаемый веб-клиентом чат-бота RiveScript, нам нужно преобразовать информационную архитектуру из жесткой в гибкую; или метки полей в строки пользовательского интерфейса.
Давайте рассмотрим некоторые доступные метки полей и связанный с ними тон вопроса:
- Запрос: Как мы можем помочь? Точно сказать не могу? Не возражаете, если я задам несколько вопросов?
- График: Как скоро нам нужно начать?
- Информация о бюджете: Можете ли вы дать мне приблизительное представление о вашем бюджете?
- Описание Проекта: Хорошо, вы можете мне кратко рассказать о проблеме, которую необходимо решить?
- Справка: Кроме того, кто вас направил к нам?
Затем нам нужно преобразовать код веб-формы в сценарий AI, следуя очень удобной логике обработки RiveScript для двусторонних разговоров:
- Как мы можем помочь? + *% чем мы можем помочь - установите area = varSure, не возражаете, если я задам пару вопросов? + *% конечно, не возражаете, если я задам пару вопросов - как скоро мне нужно будет начать этот запрос? + *% как скоро мне нужно будет начать этот запрос - установите when = var Можете ли вы дать мне приблизительное представление о вашем бюджете? + *% Можете ли вы дать мне приблизительное представление о вашем бюджете - установите budget = varOK, можете ли вы сказать мне краткое изложение проблемы, которую необходимо решить, затронутые компоненты и среды или общее описание? + *% ок, не могли бы вы сказать мне краткое изложение проблемы, которую необходимо решить, затронутые компоненты и среды или общее описание - установите project = var.Также, кто направил вас к нам? + *% также, кто направил вас к нам - установите referal = vargreat, вот что я получил до сих пор: n Необходимые услуги: получить области> n Нужно начать: получить, когда> n Примерный бюджет: получить бюджет> n О вашем проекте: получить проект> n Порекомендовал: получить реферал> n и свяжемся с вами в ближайшее время, могу ли я еще чем-нибудь вам помочь сегодня? вызов> получение получить области> получить, когда> получить бюджет> получить проект> получить реферал> / вызов>
05. Подача запроса
В отличие от стандартных переменных формы, отправляемых для обработки на другую страницу или службу, чат-боты могут немедленно проверять и отправлять информацию, введенную пользователем в окне чата (или озвученную), что означает, что пользователи также могут легко вернуться к ранее введенным значениям.
Нам нужно было отправить запрос пользователя, введенный в пользовательском интерфейсе чат-бота, через JSON REST API на внешний сервер задач проекта.
В RiveScript-js мы можем использовать XMLHttpRequest объект отправить запрос практически одновременно, так как данные вводятся пользователем:
> объектный прием javascript var http = new XMLHttpRequest (); var a = rs.getUservar (rs.currentUser (), «области»); var b = rs.getUservar (rs.currentUser (), «когда»); var c = rs.getUservar (rs.currentUser (), «бюджет»); var d = rs.getUservar (rs.currentUser (), «проект»); var e = rs.getUservar (rs.currentUser (), "реферал"); var url = "http: // localhost: 3000 / send"; var params = "area =" + a + "& when =" + b + "& budget =" + c + "& project =" + d + "& referal =" + e; console.log (параметры); http.open ("POST", url, true); http.setRequestHeader ("Content-type", "application / x- www-form-urlencoded"); http.setRequestHeader («Подключение», «закрыть»); http.onreadystatechange = function () {// Вызов функции при изменении состояния. если (http.readyState == 4 && http.status == 200) {предупреждение (http.responseText); }} http.send (параметры); объект
06. Не бойтесь чат-бота
Вскоре существующие способы взаимодействия с компьютерами для получения информации уступят место технологиям на основе искусственного интеллекта, таким как чат-боты, где люди просто выполняют простые голосовые команды, как мы видели с такими технологиями, как Amazon Echo и Google Home.
Сообществу веб-дизайнеров не нужно бояться - мы все должны осознавать добавленную стоимость этой новой технологии.
Это может изменить правила игры для компаний, в которых работает, предлагая полностью масштабируемое обслуживание клиентов и улучшенный анализ клиентов.
Эта статья изначально была размещена всетевой журнал, самый продаваемый журнал для веб-дизайнеров и разработчиков в мире. Подпишитесь здесь.
