Как создать чат-бот в конструкторе

Продукты из этой статьи:

SaluteBot

Graph

Jivo

В личном кабинете Цифровой витрины можно бесплатно создавать боты для сайта, соцсетей и мессенджеров: ВКонтакте, Viber, Telegram и других площадок. Разбираем весь процесс по шагам на примере создания простого чат-бота.

Алгоритм создания бота

Для работы понадобится три площадки:

• личный кабинет Цифровой витрины,
• канал размещения,
• Jivo.

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

Канал размещения — это площадка, на которой будет работать чат-бот. Это может быть:

• ваш сайт,
• соцсети: ВКонтакте, Одноклассники,
• мессенджеры: Телеграм, Вайбер,
• площадки объявлений: Авито.

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

Сценарии для разных каналов создаются по одному принципу. Разница заключается в настройке интеграции между личным кабинетом Цифровой витрины и каналом размещения через Jivo.

Следовательно, перед тем как создавать сценарий в конструкторе, нужно зарегистрироваться на всех трёх площадках и настроить интеграцию между ними.

Подключение площадок

Канал размещения

Порядок регистрации зависит от площадки, для которой вы создаёте бот:

• ВКонтакте. Авторизуйтесь в нужной группе ВК под учётной записью администратора. Перейдите на вкладку «Управление сообществом» и активируйте опцию «Возможности ботов».
• Одноклассники. Убедитесь, что являетесь администратором группы ОК, и включите в ней сообщения для участников. Получите ключ доступа, скопируйте и сохраните его.
• Авито. Авторизуйтесь в вашем аккаунте на Avito.
• Вайбер. Пройдите бесплатную регистрацию на сайте https://partners.viber.com, переключитесь на русский язык в правом верхнем углу, нажмите Create Bot Account и подключите публичный аккаунт. Система сгенерирует токен — скопируйте и сохраните его.
• Телеграм. Перейдите в диалог https://telegram.me/BotFather, введите команду /start, затем /newbot и следуйте подсказкам системы. После того как вы создадите бот, скопируйте и сохраните токен.

Личный кабинет Цифровой витрины

Пройдите бесплатную регистрацию в личном кабинете Цифровой витрины и войдите в аккаунт. Для авторизации можно использовать email, Сбер ID или СберБизнес ID.

На главном экране нажмите «Создать проект». Появится окно выбора инструмента.

Выберите «SaluteBot Конструктор». Откроется окно с шаблонами для разных задач и отраслей. Выберите подходящий шаблон или нажмите «Новый проект».

Нажмите «Далее», придумайте название проекта и нажмите «Создать проект».

Откроется окно настроек проекта.

Выполните настройки:

• заполните поле «Название»,
• оставьте русский язык,
• выберите тип сценария Graph,
• выберите проект, для которого создаёте сценарий.

Чтобы установить связь между личным кабинетом Цифровой витрины и Jivo, в блоке «Аккаунт Jivo» нажмите «Добавить аккаунт» и зарегистрируйтесь либо авторизуйтесь в Jivo.

Jivo

На предыдущем шаге вы авторизовались в аккаунте Jivo из проекта в личном кабинете Цифровой витрины. Теперь нужно подключить площадку, где будет работать SaluteBot.

Для этого в боковом меню кабинета Jivo откройте раздел «Управление», блок «Каналы связи».

Перед вами список доступных каналов. Выберите нужный, нажмите кнопку «Добавить» и следуйте указаниям системы.

Для Telegram и Viber нужно ввести токен — его вы получили на этапе подключения площадки.

Готово: вы настроили интеграцию площадок. Можно создавать сценарий, по которому будет действовать SaluteBot.

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

Откроется визуальный редактор — конструктор сценария.

Разбираем пример сценария

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

Разберём сценарий на скриншоте выше.

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

Вот как работает SaluteBot в данном примере:

• Начало — распознавание фраз. Пользователь отправляет сообщение в чат, программа анализирует текст и реагирует в зависимости от фразы:
  • Если клиент пишет «Мне нужна помощь», то в чат приходит реплика «Да, я вас внимательно слушаю и готов помочь. Какой у вас вопрос?». На скриншоте сценария за это отвечает зелёный блок, который называется «Нужна помощь».
  • Если клиент пишет «Вы можете мне помочь», то получает ответ — «Конечно, я готов вам помочь. Какой у вас вопрос?». На скриншоте это зелёный блок «Ответ на вопрос».
  • Если клиент отправляет в чат приветствие («Здравствуйте», «Добрый день», «Привет» и другие варианты), то отправляется сообщение «Здравствуйте! Какой у вас вопрос?». На скриншоте это зелёный блок «Приветствие».
• После отправки ответа SaluteBot ждёт реакцию собеседника, то есть переходит на жёлтый блок «Реакция на ввод пользователя».
• После получения любой фразы диалог переходит на оператора. Бот пишет «Хорошо, передаю ваш вопрос своим коллегам» и переключает беседу на сотрудника с помощью сервиса Jivo. На схеме это блок голубого цвета «Перевод на оператора».
• Если свободных сотрудников нет, в чат приходит сообщение «Перевод на оператора временно не работает». На скриншоте это серый блок «Ошибка перевода».

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

Создаём блоки

Сценарий — это набор экранов, каждый экран состоит из блоков. Блок определяет действие, которое чат-бот совершает во время беседы с пользователем. Например:

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

Чтобы посмотреть все доступные возможности блоков, нажмите в конструкторе «Добавить экран». Появится форма выбора блоков.

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

Текстовое сообщение

Чтобы задать текстовую реплику, выберите «Текст» и введите нужную фразу. Всё просто: если ввести «Здравствуйте!», то пользователь получит в чате сообщение с текстом «Здравствуйте!».

Если в одном блоке ввести несколько реплик, то система будет выбирать ответ случайным образом. Это позволяет разнообразить общение: например, пользователь будет каждый раз получать разные приветствия.

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

Для этого наведите курсор на блок с первым текстом, появится надпись «Добавить блок».

Нажмите на неё, откроется форма выбора блоков. Снова выберите «Ответ ассистента» и «Текст», введите следующую реплику.

Допустим, мы хотим, чтобы бот сначала здоровался с пользователем, а сразу после этого сообщал об акции. Значит, нужно задать следующую логику:

• первая реплика: выбор из нескольких приветствий (этот блок мы уже создавали);
• вторая реплика: текст «У нас сейчас акция — хотите, расскажу?».

В сценарии блоки выглядят так:

Вот как это будет выглядеть на практике:

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

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

Изображение

В чат можно отправлять картинки. Для этого нужно:

• нажать «Добавить блок»,
• выбрать «Ответ ассистента» → «Изображение»,
• загрузить файл.

Ограничения по размеру и форматам указаны в окне загрузки изображения.

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

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

Кнопка

Кроме текста, пользователь может общаться с чат-ботом с помощью кнопок.

Кнопки — это короткие реплики, до 30 символов длиной. На одном экране может быть несколько кнопок с вариантами развития диалога.

Например, с их помощью можно реализовать выбор категории товаров или услуг:

Другой вариант — определить потребность клиента:

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

В нашем примере добавим кнопку на экран с изображением об акции.

Допустим, мы хотим, чтобы пользователь переходил по кнопке на сайт с акционными товарами. Реализуем это:

• наводим курсор на экран с изображением об акции;
• нажимаем «Добавить блок», выбираем «Кнопка»;
• появляется кнопка, нажимаем иконку редактирования;
• задаём название (например, «Открыть каталог»);
• нажимаем на третью иконку, вводим ссылку и нажимаем «Сохранить».

Готовый блок с изображением и кнопкой перехода в конструкторе выглядит так:

В результате мы создали два блока:

• первый блок — текстовое приветствие с предложением узнать об акции;
• второй блок — баннер с акцией и кнопка перехода на продающий лендинг.

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

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

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

Интенты

Как работают интенты:

• вы задаёте примеры реплик, которые может ввести пользователь;
• задаёте реакцию на эти реплики — создаёте блоки с ответами или действиями;
• SaluteBot анализирует сообщение пользователя и находит близкий по смыслу пример реплики;
• определив подходящий интент, переходит на нужный блок и выполняет заданное в нём действие.

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

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

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

В окне «Интенты» нажимаем «Добавить интент» и попадаем в окно выбора реплик. Здесь можно выбрать готовые варианты из подходящей вам категории или задать новые реплики.

Нам нужен интент «Согласие». Чтобы его подключить, находим в меню категорию «Базовые интенты», ставим галочку в пункте «Согласие» и нажимаем «Выбрать».

Затем нажимаем «Добавить выбранные» и «Сохранить». В блоке с текстовыми фразами появится интент «Согласие».

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

Теперь блоки связаны: если пользователь выразит согласие на предложение узнать об акции, то SaluteBot отправит в чат баннер и кнопку перехода в каталог.

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

Как видим, сценарий работает корректно:

• чат-бот поздоровался,
• предложил узнать об акции,
• получил согласие,
• отправил картинку и кнопку.

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

Структура сценария

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

Разместить экраны в конструкторе можно так, как вам удобно. Связи при этом не меняются.

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

Чтобы сделать блок стартовым, наведите на него курсор, во всплывающем окне нажмите на многоточие и выберите «Сделать началом сценария». Здесь же можно удалить блок.

После того как вы создадите сценарий, нажмите в правом нижнем углу «Сохранить» и «Собрать».

Запуск чат-бота

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

После отладки убедитесь, что SaluteBot заработал в канале размещения. Для этого перейдите на нужную площадку — откройте мессенджер, соцсеть или другой ресурс — и пройдите путь клиента:

• откройте окно диалога;
• задайте вопрос;
• попробуйте оформить заказ;
• напишите сообщение с ошибками и посмотрите, распознает ли система ваш запрос.

Если получаете некорректные ответы или забыли добавить какую-то пользовательскую ситуацию, скорректируйте сценарий в конструкторе.

Тестирование бесплатное, так как по умолчанию вы пользуетесь тарифом личного кабинета Цифровой витрины «Разработчик». Бесплатный тариф рассчитан на количество пользователей менее 50. При большем потоке клиентов вы можете перейти на один из платных тарифов.

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

Продукты из этой статьи:

SaluteBot

Graph

Jivo