Купите онлайн-самовывоз в магазине: Bonjour Meal. Часть 1. Начало работы

1. Введение

637766505206e0a1.pngc604dca3ca211399.png

Последнее обновление: 11.05.2022

Добро пожаловать в раздел «Деловые сообщения»!

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

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

Что делает цифрового агента хорошим?

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

Что вы построите

В этом практическом задании вы создадите цифрового агента в Business Messages для вымышленной компании Bonjour Meal. Этот цифровой агент будет отвечать на несколько простых вопросов, например: «Во сколько вы закрываетесь?» или «Могу ли я совершить покупку онлайн?».

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

В этом практическом занятии ваше приложение будет

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

883b5a7f9f266276.png

Что вы узнаете

  • Как развернуть веб-приложение в App Engine на платформе Google Cloud Platform. В качестве альтернативы можно использовать ngrok для публичного тестирования локального приложения.
  • Как настроить учетную запись Business Messages с помощью веб-перехватчика веб-приложения для получения сообщений от пользователей.
  • Как отправлять сообщения с расширенными функциями, такими как карточки, карусели и подсказки для диалогов, с помощью Business Messages API.
  • Как Business Messages отправляет ваши сообщения

Данный практический семинар посвящен созданию вашего первого цифрового агента.

Что вам понадобится

  • Зарегистрируйтесь для получения бесплатного аккаунта разработчика Business Communications.
  • Инструкции можно найти на нашем сайте для разработчиков .
  • Устройство Android с версией 5 или выше ИЛИ устройство iOS с установленным приложением Google Maps
  • Опыт программирования веб-приложений.
  • Подключение к интернету!

2. Настройка

Включите API

В рамках этого практического занятия, поскольку мы будем работать с приложением Django, мы будем использовать API Cloud Build для развертывания приложения в App Engine . В качестве альтернативы, если вы используете ngrok, включать API Cloud Build не требуется.

Чтобы включить API Cloud Build:

  1. Откройте API Cloud Build в консоли Google Cloud.
  2. Нажмите «Включить» .

Создайте учетную запись службы

Для доступа к API Business Communications и Business Messages необходимо создать учетную запись службы. Следуйте инструкциям в документации, чтобы создать учетную запись службы в консоли разработчика Business Communications.

Разверните стартовый код Django Python EchoBot

В терминале клонируйте репозиторий Django Echo Bot Sample в рабочую директорию вашего проекта с помощью следующей команды:

$ git clone https://github.com/google-business-communications/bm-bonjour-meal-django-starter-code

Скопируйте созданный вами JSON-файл с учетными данными для сервисной учетной записи в папку ресурсов примера и переименуйте его в "bm-agent-service-account-credentials.json".

bm-bonjour-meal-django-starter-code/bonjourmeal-codelab/step-1/resources/bm-agent-service-account-credentials.json

В терминале перейдите в каталог, содержащий пример, относящийся к шагу 1.

Для развертывания примера выполните следующие команды в терминале:

$ gcloud config set project PROJECT_ID*
$ gcloud app create
$ gcloud app deploy
  • PROJECT_ID — это идентификатор проекта, который вы использовали для регистрации в API.

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

Deployed service [default] to [https://PROJECT_ID.appspot.com]

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

Настройте свой веб-бук

Теперь, когда ваша служба развернута, вы будете использовать URL-адрес приложения для установки URL-адреса веб-перехватчика на странице настроек учетной записи в консоли разработчика Business Communications .

URL веб-перехватчика будет представлять собой URL приложения + "/callback/". Например, это может выглядеть так: https://PROJECT_ID.appspot.com/callback/

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

Заполните поля «Контактная техническая информация», а затем обновите поле «Webhook» , указав URL-адрес веб-перехватчика для развернутого приложения.

ceb66c905ded40be.png

Нажмите кнопку «Сохранить» рядом с ссылкой на ваш проект GCP.

3. Создание вашего первого агента

Использование консоли разработчика бизнес-коммуникаций

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

В поле «Бренд» введите название создаваемого вами бренда. Бренд — это компания, с которой вы работаете, и потребители могут взаимодействовать с агентом в режиме диалога. В поле «Имя агента» укажите, что пользователи должны видеть в диалоге «Сообщения компании». В случае вымышленной компании Bonjour Meal, Bonjour Rail — это железнодорожная компания, которая управляет ресторанами Bonjour Meal. Поэтому я укажу Bonjour Rail в качестве бренда и Bonjour Meal в качестве агента.

Агент — это интерактивный персонаж, представляющий бренд.

88a9798e6546eb4e.png

Нажмите «Создать агента» и позвольте консоли сделать свою работу. Этот запрос займет несколько секунд и будет выполнен для отправки нескольких запросов к API бизнес-коммуникаций с целью создания бренда и агента. Вы можете использовать API бизнес-коммуникаций напрямую для создания агента и бренда. Ознакомьтесь с документацией , чтобы увидеть, как будет выглядеть запрос curl, выполняющий те же действия, что и консоль.

Ваш первый разговор

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

f6bd8ded561db36f.png

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

На мобильном устройстве нажатие на ссылку запустит средство запуска агентов Business Messages Agent Launcher, в котором будет предварительно заполнен URL-адрес для тестирования агентов.

Нажмите «Запустить» , чтобы активировать интерфейс общения с вашим агентом.

2bf9f282e09062de.png

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

Развернутое приложение также содержит некоторую логику для демонстрации богатого функционала, доступного в Business Messages.

  • Если вы отправите слово "card", вы активируете расширенную карту.
  • Если вы отправите «чипы», вы активируете чипы подсказок.
  • Если вы отправите слово "карусель", вы вызовете карусель богатых карт.

Поздравляем! Это первая беседа вашего агента с вами!

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

Обновление приветственного сообщения и использование элементов диалога.

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

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

4323f988216fa054.png

Обновите приветственное сообщение (желтое поле ввода), чтобы оно выглядело следующим образом:

Добро пожаловать в стартовый аккаунт Bonjour Meal. Я могу дублировать ваши сообщения и показывать вам некоторые из расширенных функций платформы. Попробуйте эти предложения!

Нажмите кнопку «+ Добавить начало разговора» , как показано в фиолетовом поле на изображении выше, чтобы добавить начало разговора для вызова подсказок, карусели и карточки. Для добавления начала разговора необходимы компонент «Текст» и компонент «PostBackData». Текст — это то, что отображается пользователю, а данные postBack — это то, что отправляется на веб-хук вашего агента. Веб-хук анализирует данные postBack и отправляет соответствующий ответ пользователю. 906bc74668a1b215.png

После внесения изменений информация об агенте в консоли выглядит следующим образом:

8e96b0a10edd20af.png

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

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

К сожалению, мы не сможем сразу увидеть эти изменения в переписке, поскольку предыдущие данные кэшируются в инфраструктуре Business Messages. Кэш очищается примерно каждые 2 часа, поэтому вы сможете проверить это завтра.

А пока давайте посмотрим, как всё работает изнутри.

4. Анализ стартового кода

Общий обзор исходного кода.

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

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

В общих чертах, Django направляет URL-адреса в представления, а логика представления генерирует шаблон, который отображается в браузере. Давайте посмотрим на файл urls.py проекта.

bm-django-echo-bot/bmcodelab/urls.py [Строки 31-37]

from django.urls import include, path
import bopis.views as bopis_views

urlpatterns = [
    path('', bopis_views.landing_placeholder),
    path('callback/', bopis_views.callback),
]

Здесь определены два маршрута, поэтому Django может выполнить логику, если эти два URL-адреса распознаны. Если URL-адрес проекта — https://PROJECT_ID.appspot.com/, то проекту известны следующие маршруты:

  • https://PROJECT_ID.appspot.com/
  • https://PROJECT_ID.appspot.com/callback/

Оба URL-маршрута ссылаются на bopis_views , который находится в файле bopis/views.py. Давайте посмотрим, что происходит в этом файле. Для начала разберемся bopis_views.landing_placeholder .

bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [строки 302-309]

... 
def landing_placeholder(request):
    return HttpResponse("<h1>Welcome to the Bonjour Meal Codelab</h1>
    <br/><br/>
    To message your Bonjour Meal agent, go to the Developer Console and retrieve
    the Test URLs for the agent you have created as described in the codelab
    <a href='https://codelabs.developers.google.com/codelabs/'>here</a>.")
...

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

Другой URL-адрес перенаправляет на функцию с именем callback , также расположенную в bopis/views.py . Давайте рассмотрим эту функцию подробнее.

bm-django-echo-bot/bopis/views.py [строки 60-101]

...
def callback(request):
    """
    Callback URL. Processes messages sent from user.
    """
    if request.method == "POST":
        request_data = request.body.decode('utf8').replace("'", '"')
        request_body = json.loads(request_data)

        print('request_body: %s', request_body)

        # Extract the conversation id and message text
        conversation_id = request_body.get('conversationId')
        print('conversation_id: %s', conversation_id)

        # Check that the message and text body exist

        if 'message' in request_body and 'text' in request_body['message']:
            message = request_body['message']['text']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'suggestionResponse' in request_body:
            message = request_body['suggestionResponse']['postbackData']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'userStatus' in request_body:
            if 'isTyping' in request_body['userStatus']:
                print('User is typing')
            elif 'requestedLiveAgent' in request_body['userStatus']:
                print('User requested transfer to live agent')

        return HttpResponse("Response.")

    elif request.method == "GET":
        return HttpResponse("This webhook expects a POST request.")
...

Здесь логика анализирует тело запроса на наличие сообщения или ответа-подсказки и передает эту информацию в функцию с именем route_message , после чего возвращает HttpResponse обратно в инфраструктуру бизнес-сообщений для подтверждения получения сообщения.

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

b10113f9d037e6a5.png

Business Messages отправляет содержимое сообщения в формате JSON на ваш веб-хук, откуда оно перенаправляется к оператору или к логике для ответа в качестве бота. В нашем случае это механизм маршрутизации route_message . Давайте посмотрим.

bm-django-echo-bot/bopis/views.py [строки 105-122]

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    else:
        echo_message(message, conversation_id)
...

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

bm-django-echo-bot/bopis/views.py [строки 40-42]

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
...

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

Отправка сообщений

Теперь у вас должно быть представление о том, как веб-приложение принимает сообщения. Всё это осуществляется с помощью веб-хука.

Но как приложение отправляет исходящее сообщение пользователю с помощью бизнес-сообщений?

a9475b1da93a83e8.png

Когда ваша инфраструктура отвечает пользователю, вы отправляете ответ в API бизнес-сообщений, который доставляет сообщение пользователю.

API для бизнес-сообщений имеет библиотеки для Python, Node.js и Java. У нас также есть REST API, к которому вы можете отправлять запросы напрямую, если ваша инфраструктура не написана на языке, для которого у нас есть библиотека. Посмотрите раздел «Отправка сообщений» , чтобы узнать, как cURL используется для отправки сообщения по определенному идентификатору диалога.

В рамках этого практического занятия мы сосредоточимся на использовании клиентской библиотеки Python , которая уже интегрирована в стартовый код Bonjour Meal, развернутый в App Engine в вашем проекте GCP, или запущена локально через ngrok.

Давайте рассмотрим функцию echo_message и посмотрим, как мы взаимодействуем с API для отправки сообщения в Business Messages.

bm-django-echo-bot/bopis/views.py [строки 199-212]

...
def echo_message(message, conversation_id):
    '''
    Sends the message received from the user back to the user.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

В этой функции создается экземпляр класса BusinessMessagesMessage, в который в функцию echo_message передается переменная message. После создания экземпляра объект передается в send_message вместе с идентификатором диалога.

bm-django-echo-bot/bopis/views.py [строки 214-236]

...
def send_message(message, conversation_id):
    '''
    Posts a message to the Business Messages API, first sending
    a typing indicator event and sending a stop typing event after
    the message has been sent.

    Args:
        message (obj): The message object payload to send to the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    credentials = ServiceAccountCredentials.from_json_keyfile_name(
        SERVICE_ACCOUNT_LOCATION,
        scopes=['https://www.googleapis.com/auth/businessmessages'])

    client = bm_client.BusinessmessagesV1(credentials=credentials)

    # Create the message request
    create_request = BusinessmessagesConversationsMessagesCreateRequest(
        businessMessagesMessage=message,
        parent='conversations/' + conversation_id)

    bm_client.BusinessmessagesV1.ConversationsMessagesService(
        client=client).Create(request=create_request)
...

Функция send_message использует учетные данные вашей сервисной учетной записи для проверки возможности отправки сообщений в этот диалог, создает экземпляр клиента Business Messages и формирует запрос на отправку сообщения по указанному conversation ID .

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

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

Когда будете готовы, давайте настроим агент Bonjour Meal.

5. Настройка вашего агента

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

906bc74668a1b215.png

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

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

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

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

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

eb6b8ac6b62387ee.png

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

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

Давайте загрузим логотип, который находится в исходном коде, клонированном вами в начале этого практического занятия. Вы можете найти его в каталоге ./assets/ репозитория, файл называется "bonjour_meal-logo.png". Вы можете перетащить файл в модальное окно веб-браузера, появится инструмент для редактирования изображения, позволяющий изменить качество и обрезать его. Отрегулируйте разрешение изображения и обрежьте его так, чтобы размер изображения был меньше или равен ограничению в 50 КБ. Когда вы будете удовлетворены изображением, нажмите галочку в синем круге для подтверждения и нажмите «Выбрать» внизу модального окна.

1856081f59623ae2.png

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

Обновите приветственное сообщение.

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

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

6598fec47021136e.png

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

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

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

Предоставление информации о часах работы предприятий.

Для предоставления этой информации пользователям мы отправим им персонализированное сообщение, используя API бизнес-сообщений.

Возможно, вы помните, что сообщения обрабатываются в функции route_message файла views.py . Функция сначала нормализует строку, а затем проверяет, соответствует ли нормализованное сообщение каким-либо из жестко заданных параметров. Для простоты добавим дополнительное условие, проверяющее, равно ли нормализованное сообщение новой константе, которую мы назовем CMD_BUSINESS_HOURS_INQUIRY и которая будет содержать значение "business-hours-inquiry". Если условие истинно, мы вызовем функцию send_message_with_business_hours .

Функция route_message теперь будет выглядеть следующим образом:

bm-django-echo-bot/bopis/views.py

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    else:
        echo_message(message, conversation_id)
...

Для корректной работы кода нам потребуется внести еще два изменения: первое — определить CMD_BUSINESS_HOURS_INQUIRY вместе с остальными константами, второе — определить функцию send_message_with_business_hours и отправить сообщение, используя API бизнес-сообщений.

Давайте сначала определим константу в верхней части файла вместе с другими объявлениями констант:

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
...

А теперь перейдём к определению функции send_message_with_business_hours . Вы можете определить эту функцию в любом месте файла, следуя соответствующему синтаксису Python. Поскольку эта функция просто отправляет сообщение, подобно echo_message , вы можете использовать её в качестве шаблона для определения этой функции.

bm-django-echo-bot/bopis/views.py

...
def send_message_with_business_hours(conversation_id):

    message = '''Thanks for contacting us! The hours for the store are:\n
    MON 8am - 8pm\n
    TUE 8am - 8pm\n
    WED 8am - 8pm\n
    THU 8am - 8pm\n
    FRI 8am - 8pm\n
    SAT 8am - 8pm\n
    SUN 8am - 8pm
    '''

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

Таким образом, наш бот должен уметь сообщать пользователю часы работы, когда тот отправляет сообщение типа "business-hours-inquiry". В результате можно ожидать примерно следующее:

125802166995afd5.png

После развертывания исходного кода в GCP изменения станут видны немедленно. Мы не кэшируем веб-приложение в Google Cloud Platform так же, как кэшируется информация об агентах, поэтому вы сможете протестировать это сразу же.

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

Сообщить пользователю о скором появлении онлайн-шопинга

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

Проанализируйте нормализованное сообщение и проверьте условие для константы с именем CMD_ONLINE_SHOPPING_INQUIRY , значение которой установлено на "online-shopping-inquiry". Если условие истинно, вызывается send_online_shopping_info_message .

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
CMD_ONLINE_SHOPPING_INQUIRY = 'online-shopping-inquiry'
...
...
...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    elif normalized_message == CMD_ONLINE_SHOPPING_INQUIRY:
        send_online_shopping_info_message(conversation_id)
    else:
        echo_message(message, conversation_id)
...

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

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

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
    fallback_text = ('Online shopping will be available soon!')

    rich_card = BusinessMessagesRichCard(
        standaloneCard=BusinessMessagesStandaloneCard(
            cardContent=BusinessMessagesCardContent(
                title='Online shopping info!',
                description='Thanks for your business, we are located in SF near the Golden Gate Bridge. Online shopping is not yet available, please check back with us in a few days.',
                suggestions=[],
                media=BusinessMessagesMedia(
                    height=BusinessMessagesMedia.HeightValueValuesEnum.MEDIUM,
                    contentInfo=BusinessMessagesContentInfo(
                        fileUrl=SAMPLE_IMAGES[4],
                        forceRefresh=False
                    ))
                )))

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        richCard=rich_card,
        fallback=fallback_text)

    send_message(message_obj, conversation_id)
...

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

5cd63c57c1b84f9a.png

Как и предыдущее изменение, позволяющее пользователю узнавать о часах работы, это изменение будет заметно сразу же при использовании ngrok или сразу после развертывания кода в GCP App Engine.

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

Использование фишек для направления разговора

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

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

Мы создадим два новых варианта начала диалога. Для первого установите текст «Каковы ваши часы работы?» и данные Postback на «business-hours-inquiry». Для второго варианта начала диалога установите текст «Могу ли я совершать покупки здесь?» и данные Postback на «online-shopping-info».

В результате должна получиться конфигурация, как на следующем скриншоте:

ef6e6888acea93e3.png

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

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

В конце функции добавьте следующее:

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Business hours',
                postbackData='business-hours-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

# Let's do the same with the business hours
def send_message_with_business_hours(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Can I purchase online?',
                postbackData='online-shopping-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

Обратите внимание, что текстовое поле в элементе BusinessMessagesSuggestion ограничено 25 символами, как описано в документации .

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

ef57695e2bacdd20.png

6. Поздравляем!

Поздравляем, вы успешно создали своего первого цифрового агента Business Messages!

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

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

Вот небольшой фрагмент того, как это может выглядеть.

57d2bb7b0ec38c81.png

Как создать отличный диалог?

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

Предоставьте контекст и обозначьте ожидания.

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

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

Предоставьте пользователю функциональность.

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

Поддерживайте вовлеченность пользователя.

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

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

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

Что дальше?

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

Справочная документация