In this codelab, you’ll learn how to use Dialogflow to create a conversational interface to power an RBM agent without writing any code.
What are you going to build in this codelab?
- A Dialogflow agent that powers an RBM agent’s conversation
- A conversational interface for a fictional pizza restaurant that sends users a discount offer and allows them to look at the restaurant’s menu
What you’ll learn
- How to use Dialogflow's main construct of an intent to create a conversational interface
- How to create RBM response types from Dialogflow in order to create a rich RBM experience for users
What you’ll need
- Your RBM platform Google account
Create and query your first agent
Duration: 30:00
Create your first Dialogflow agent
To create a Dialogflow agent:
- Open a new tab and sign in to Dialogflow.
Click Create agent in the left navigation.
Enter "CodelabRBMPizzaPlace" for your agent's name, "English" as the default language, and set the default timezone to your timezone.
Click Create.
The Dialogflow console
You should now see the Dialogflow console. If you're working on a smaller screen and the left navigation is hidden, click the navigation button in the upper-left corner. The settings button takes you to the current agent's settings.
The middle of the page shows a list of intents for the agent. By default, Dialogflow agents start with two intents. Your agent matches Default Fallback Intent when it doesn't understand what your users say. The Default Welcome Intent greets your users. You can alter these intents to customize the experience.
On the right is the Dialogflow simulator. This lets you try out your agent by speaking or typing messages.
Querying your agent
Dialogflow agents are best described as NLU (Natural Language Understanding) modules. These can be included in your app, product, or service to transform natural user requests into actionable data.
Time to try out your agent! In the simulator on the right, click into the text field that says Try it now, type "Hi", and press Enter.
Dialogflow identifies the query, matches the Default Welcome Intent, and responds with a generic greeting. This works because Dialogflow automatically trains the Default Welcome Intent with some sample greetings.
Create an RBM agent
Sign into the Business Communications Developer Console, then click Create agent.
In the Name field, enter "Your Name’s Pizza Place" (like "Sean’s Pizza Place"), select a Region, and click Create agent.
Connect your RBM agent to Dialogflow
After your RBM agent is created, click the agent to see the agent’s Overview page. Click the Integrations link in the left navigation.
By default, RBM agent’s use Google Cloud Pub/Sub to handle user messages. To connect your RBM agent to the Dialogflow agent you created earlier, click the Dialogflow integration.
In the dialog, click Connect existing model. Follow the instructions to give your RBM agent permissions to call your Dialogflow agent. When you have completed the instructions,, then click Next.
Finally, you need to provide the Dialogflow project ID. In a different browser tab than the Business Communications Developer Console, go to Dialogflow and open the CodelabRBMPizzaPlace agent you created earlier. Click the gear icon near the project name in the left navigation.
Clicking this takes you to the model’s settings. Under GOOGLE PROJECT, find and copy the Project ID.
Go back to your tab with the Business Communications Developer Console open, paste the project ID into the dialog, then click Start integration.
This process takes about two minutes to complete. Once complete, you should see the Dialogflow integration option highlighted and a View agent link available.
All messages to and from your agent are now being handled by the CodelabRBMPizzaPlace Dialogflow agent.
Invite your test device and send a message
Before diving into Dialogflow, let’s get your test device set up. If you don't already have a device capable of receiving RBM messages, follow this guide to get your device ready.
From the Business Communications Developer Console, click Devices in the left navigation. In the form, enter in your device’s full phone number in E.164 format (for example, +12223334444) and click Add.
On your device, you receive the test invite. Tap Make me a tester.
In your browser, find your device in the Devices list and send your device a test message. If you received a message on your device from your RBM agent, you're all set to continue with this codelab.
Creating your welcome intent
Typically with a Dialogflow-powered RBM agent, to start a conversation, you make an API call that specifies the user's phone number and the Dialogflow intent that begins the conversation (usually your agent's welcome intent). For this codelab, we'll skip this step and instead use the conversational thread we already created in the prior step with the test device from the Business Communications Developer Console. However, if you want to read more about this API feature, check out this guide.
Let’s begin by adding RBM responses to the Default Welcome Intent so Dialogflow can use it with your RBM agent. First, navigate to the browser tab that has Dialogflow open. Click the Intents link in the left navigation. Delete the sample plain "Text Response" by clicking the trash can in the upper right hand corner. Then, click Default Welcome Intent, scroll down to the Responses section, click + in the list of response types, and select RCS Business Messaging (RBM).
Click Add Responses, then select Simple Response. In the text field for the Simple Response enter "Check out Sean’s Pizza Place deal of the day! Buy any 12 inch pizza and get one FREE!" (replace Sean with your name), then click Save.
Initiating a conversation
Now that you have a welcome intent configured, go back to your test device and send the message "Hi". This message triggers the Default Welcome Intent, and you should see something similar to the image below.
Update your welcome intent
Now that you have Dialogflow sending a simple message, let’s update the message to be a little more compelling. We not only want to send a message about the deal of the day, but also send an image to entice the receiving user and give them some other actions they may wish to take.
Let’s replace our simple response pizza advertisement message with a card that contains an image and provides options to view the full menu and restaurant’s website.
In Default Welcome Intent's Responses section, select the RCS Business Messaging (RBM) tab. Update the existing Simple Response text with "Welcome to Sean’s Pizza Place. Check out today's promotional offer!". Next, click Add Responses and select Standalone Rich Card.
In the Standalone Rich Card form, enter the following:
- Card Title: Buy Any 12 Inch Pizza and Get One FREE!
- Card Description: Show this message at any participating location to redeem this offer. Offer expires 2/17.
- Select Card Orientation: Vertical
- Image/Video URL: https://storage.googleapis.com/df-rbm-codelab/pizza-ad-coupon.png
- Select Media Height: Medium
Click Add Suggestion and enter the following:
- Suggestion text: View menu
- Suggestion Postback: reply_view_menu
Add an Open URL Action by clicking Add Suggestion and then selecting Open URL Action from the dropdown and entering the following:
- Suggestion text: View website
- Suggestion Postback: reply_view_website
- URL to open: https://www.google.com (or any valid URL)
Click Save.
Try it out!
Once the model says "Agent training complete", go back to your device and send the message "Hi" to your agent. You should now see the Simple Response followed by the Standalone Rich Card you just designed.
Try tapping View menu. Notice that the Default Fallback Intent gets triggered. This is because your Dialogflow agent doesn't know how to handle the postback data that you configured for this suggestion, "reply_view_menu".
Let’s fix this.
Creating your Menu intent
Dialogflow uses intents to categorize a user's intentions. Intents have Training Phrases, which are examples of what a user might say to your agent. For example, someone wanting to know the menu might ask, "What’s your menu?", "What can I eat?", or "What can I order?".
All of these queries are unique but have the same intention: to get information about the menu.
To cover this query, create a "Menu" intent:
- In the left navigation, click on the + next to Intents.
- For Intent name, enter "Menu".
Under Training Phrases, click Add user expression and enter the following, pressing enter after each entry:
What's your menu?What can I eat?What can I order?reply_view_menu
This last training phrase is used to map the postback data that you configured in the previous section with this intent.
For the response to this intent, we are going to create a carousel that displays the various menu options. For a larger menu, you may want to link to a website or share a single image of the menu.
- Under Responses, click + and select RCS Business Messaging (RBM).
- Click Add Responses and select Carousel Rich Card.
- Set the Select Card Width option to Medium.
- Under the width option, click Add Card twice. This expands the number of cards to a total of 4.
- In Card 1 enter the following:
- Card Title: Sausage and Pepperoni
- Card Description: Sausage, pepperoni, olives, and green peppers
- Image/Video URL: https://storage.googleapis.com/df-rbm-codelab/sausage-pizza.jpg
- In Card 3 enter the following:
- Card Title: Italian
- Card Description: Tomato sauce, cheese, and sausage
- Image/Video URL: https://storage.googleapis.com/df-rbm-codelab/italian-pizza.jpg
- In Card 2 enter the following:
- Card Title: Margherita
- Card Description: San Marzano tomatoes, mozzarella cheese, fresh basil, salt and extra-virgin olive oil
- Image/Video URL: https://storage.googleapis.com/df-rbm-codelab/margarita-pizza.jpg
- In Card 4 enter the following:
- Card Title: Supreme
- Card Description: Sausage, Pepperoni, Hamburger, Canadian Bacon, Onions, Olives, Mushrooms and Green Peppers
- Image/Video URL: https://storage.googleapis.com/df-rbm-codelab/supreme-pizza.jpg
Following the card items, we also need to provide a way for the user to continue the conversation. To support this, click Add Responses and select Simple Response and enter the text "Want to do something else?".
Within the Simple Response, click Add Suggestion and enter the following:
- Suggestion text: View promotion
- Suggestion Postback: hi
Click Save.
Try it out!
Now try asking your agent for the menu. On your device, in the conversation for your RBM agent, enter "What’s on the menu?" and send the message to your agent.
Your agent now responds to the query correctly. Notice that even though your query was a little different from the training phrase ("What’s on the menu?" versus "What’s your menu?"), Dialogflow still matched the query to the right intent. You can also try tapping View menu item in the rich card.
Dialogflow uses training phrases as examples for a machine learning model to match users' queries to the correct intent. The machine learning model checks the query against every intent in the agent, gives every intent a score, and the highest-scoring intent is matched. If the highest scoring intent has a very low score, the fallback intent is matched.
Capturing intents without responding
You are almost done, but there’s one last thing we need to do. If you go back to your test device and tap on the View website suggestion in the initial rich card you will notice that tapping this suggestion not only opens the associated URL, but you also receive a message triggered by the Default Fallback Intent.
This is because the Open URL Action sends the postback text of "reply_view_website" to Dialogflow when you tap the action and Dialogflow maps this to the Default Fallback Intent.
To capture postback data without immediately responding to it, we will create an intent with training phrases that match the postback data and delete all responses for the intent. Dialogflow will match the postback data to the intent but won’t respond because the intent doesn't have any defined responses.
Creating your No response intent
To cover actions that you wish to ignore, create a "No response" intent:
- In the left navigation, click on the + next to Intents.
- For Intent name, enter "No response".
- Under Training Phrases, click Add user expression and enter the
following, pressing enter after each entry:
reply_view_website
- Scroll down to Responses and remove all responses using the trash icon.
Click Save.
Try it out!
On your device, in the conversation for your RBM agent, enter "hi" and send the message to your agent. This will trigger the promotional offer from the Default Welcome Intent. Click the View website suggestion and observe that the website opens in the browser and no agent response is sent.
You're done!
Duration: 1:00
Nice work!
You’ve now been through all of the stages of building a simple RBM agent powered by Dialogflow.
If you are interested in learning more, check out our advanced codelab.
Have fun developing for this exciting new platform!