Your First Chatbot using Microsoft’s Bot Framework and Dialog Flow API: Day 1 (Dialogflow and Slack Integration)

• Download PDFArticle.zip - 2.3 MB

Table of Contents

• Preface
• Chatbot Tutorial Roadmap
• Introduction
• Case Study
• Setup Dialog Flow Account
• Creating a Bot in Dialogflow
  • Create Agent
  • Create Intent
• Test the bot in Dialogflow console
• Integrating the Bot with Slack
• Conclusion

Preface

This article is the submission against CodeProject’s Slack API Challenge. The contest officially began on January 7, 2019, and ends on March 7, 2019.

Slack is no doubt the trending platform that every developer needs.

It is easy to use and manage, and not only this, we can create our own Slack app and add a lot of custom functionality to it. You can learn how to create your own Slack app in this article. It is very easy and may hardly take 20 minutes to create your first app.

Chatbot Tutorial Roadmap

Since this is a vast topic and beyond the scope of a single article, I have divided the sections into multiple articles. In the first article, we’ll see how to create a chatbot using Google’s Dialogflow and test the bot in Dialogflow console. We’ll also see how it could be integrated with Slack. The second article will demonstrate how to create a custom chatbot using Microsoft’s bot framework and enable the webhooks in Dialogflow and return the response from the custom bot to Dialogflow intents as a fulfillment response. The third article of the series will demonstrate how to integrate the complete created bot in article two and three with Facebook Messenger and Slack and test the webhook response in the two environments. The following are the three articles of tutorial about learning how to create a custom chatbot.

1. Your first Chatbot using Microsoft’s Bot Framework and Dialogflow API: Part 1 (Dialogflow and Slack Integration)
2. Your first Chatbot using Microsoft’s Bot Framework and Dialogflow API: Part 2 (Bot using Microsoft’s Bot Framework)
3. Your first Chatbot using Microsoft’s Bot Framework and Dialogflow API: Part 3 (Integrate and test the bot on Slack and Facebook Messenger)

Introduction

From Wikipedia:

"A chatbot (also known as a smartbot, talkbot, chatterbot, Bot, IM bot, interactive agent, conversational interface or artificial conversational entity) is a computer program or an artificial intelligence which conducts a conversation via auditory or textual methods.^[1] Such programs are often designed to convincingly simulate how a human would behave as a conversational partner, thereby passing the Turing test. "

In this article, we’ll discuss how to create a real-time chatbot using Google’s Dialogflow API and integrate the same with Slack. The reader of the article does not need to have prior knowledge of bot creation as the article will demonstrate the bot creation and deployment step by step using explanatory pictures. Follow my last article Creating a Chatbot using Amazon Lex Service to learn how to create a bot using Amazon’s Lex service. Trust me, it is fun and exciting to create your own bot and see it working over the thought of creating a bot. We’ll setup Dialogflow account to leverage API. Let’s jump directly into the tutorial.

Case Study

Let’s imagine a scenario for our bot creation. Let’s say there is a newly opened Restaurant and they have recently launched their website, Facebook page, Twitter handles, and integrated their business with other social media accounts. The restaurant wants to come up with a digital solution to book a table in the restaurant online by the user and they want to create an automated bot to do so. An end user can talk to the bot and book a table. The bot will ask all the relevant details before table booking in the restaurant like date, time, number of persons, etc. We’ll create the bot and integrate that with a few social media accounts.

Setup Dialog Flow Account

1. If you already have a Google account and want to use that for creating a bot in dialog flow you can do so, if not, you can create a new one. I am using my existing Google account to sign in to dialog flow.

   "Dialogflow is powered by Google’s machine learning and Give users new ways to interact with your product by building engaging voice and text-based conversational interfaces, such as voice apps and chatbots, powered by AI. Connect with users on your website, mobile app, the Google Assistant, Amazon Alexa, Facebook Messenger, and other popular platforms and devices. Read more…"

   Click on "Go to console" to login into Dialogflow.

   

2. As suggested earlier, create a new Google account or login with an existing one.

   

Creating a Bot in Dialogflow

Create Agent

1. After entering the console, you’ll see a get-started page, click on the button "CREATE AGENT" to create the agent/bot.

   

2. Give the bot a meaningful name, for e.g., "TableBookingBot". You can choose the default time zone and language as per your choice and click on "CREATE" button.

   

3. It will take a moment to save the agent.

   

Create Intent

1. Time to see what the intents are. Each intent represents a different topic that a bot can understand and perform an action to fulfill it. For example, when a user types in "Hi" or "Hello", these inputs need to be handled by a bot and for that, an intent should be there that understands user’s input and responds accordingly. If we click on "Intents" button in the left-hand side panel, we’ll see two default intents already created for us, for example, Default Welcome Intent and Default Fallback Intent.

   

2. Click on Default Welcome Intent, and we see the sample Training Phrases called utterances in Lex service in Amazon already filled in. For example, "just going to say hi", "heya". You can add more in the list depending upon what you expect from a user to start with.

   

3. On the right side of the page, there is an option to test the intent. Click on that and type "Hi". Here, we see in the test panel, it recognizes that user said ("USER SAYS") "Hi" and responds back with a default text "Hi! How are you doing?" So, this response text comes from the default response set in the intent for all the training phrases/utterances.

   

4. The following image shows all the sample pre-defined training phrases existing in this default welcome intent.

   

5. When you scroll down, you see the Text Responses section. A few default responses are shown here. Since our purpose is to ask the user about his intent to book a table, we can delete these default responses and provide few for our intent.

   

6. Give some meaningful responses that meet our purpose of asking the user if he wants to book a table. For example, "Hi! How are you doing? Would you like to book a table?", "Hi, There! Looking for a table reservation?", etc.

   

7. Now if you test the intent after saving it, it will respond accordingly as per the set response texts.

   

8. Now what about if the user wants to book a table, so we need to have a new intent that takes care of table booking for the user. So, click on the + button in Intents and create a new intent and name that BookATable intent.

   

9. In the Training Phrases/Utterances section, provide the phrases like "Book a table", "Book a table for 2", "Book a table for 2 at 9 PM today". You see that while you type and enter these phrases, the framework is so smart to recognize your input parameters. For example, when you type "book a table for 2", it understands that 2 is a number and creates a parameter list and adds 2 as a parameter with a type number. This functionality is basically the part of Action/parameters section where one can define the input parameters, but should take from the user. We can define those parameters manually, but the framework is also smart enough to understand from our training phrases and add that to the action/parameters list. Like number, it goes for time and date as well.

    

   

10. Now at the Action and parameters section, we see three parameters added based on the training phrases, i.e., of type, number, date and time. A bot expects the user to provide these parameters when user types in. Click on "SAVE" to save the training phrases and parameters till time.

    

11. We can also make these parameters mandatory for the user to provide and set the default prompts for the parameter. So that if the user does not provide those parameters, the bot asks the user to provide that. Click on "Define prompt." link for the number.

    

12. Define few prompts for a number like "For how many people?", "For how many guests", etc.

    

13. Similarly, for time, as shown below:

    

14. For date as well as shown in the following picture:

    

15. We can provide the default response of this intent that says, "Your table is booked" and also provide the input parameters in the default response like "your table I booked for the $number on a $date at a $time" where the $ and corresponding parameter is the input parameter that user provided. You can play with lots of given action and parameters likewise to make your bot more interactive and cooler. This default response is the response that a bot returns if there is no webhook or functionality that takes care of user’s input texts. Save the intent.

    

16. Going back to the intents list and Default Welcome Intent, we see that we can add the follow-up intents here as well. Follow up intent means the next bot response based on user input. For example, the response of the bot if the user says "Yes" or "No" when asked for "Would you like to book a table." Click on Add follow-up intent.

    

17. We see the list of follow up intent types you can create, we’ll create one for yes response and one for no response.

    

18. Click on no and create a new follow up intent for no.

    

19. Name the intent as "NoIntent" and we see the default training phrases there like user saying "no", "don’t", "nope really" etc. That means the user does not want to book a table.

    

20. In that case of the user saying "no", provide the response text like "No problem! Thanks", "OK. Maybe next time! Thanks", etc.

    

21. Similarly, create a "Yes" follow up intent and name that "YesIntent" and save.

    

22. Now in the Intents list, we see two follow up intents for Default Welcome Intent. You can test the bot in test window and check your intents and user responses.

    

In the next section, we’ll create a bot using Microsoft’s Bot Framework and hook the real-time business logic to handle the user requests instead of sending dummy responses.

Test the Bot in Dialogflow Console

Our first version of bot without a webhook is complete and can be tested.

1. Open the test window for Default Welcome Intent and type "Hi". The bot will return the default response text.

   

2. Now, type "Book a table" and the bot will ask "For how many persons".

   

3. Provide the number of persons and bot will continue asking about time and date because we set those parameters as mandatory.

   

   

And it returns the final response as follows:

It says "OK. Your table for 3 is reserved on today at 6 pm" i.e., the default response text. We call it a default response text because we have not integrated any external webhook as a fulfillment of request and so it takes the default response text. We can also add our custom functionality by creating our custom bot engine and integrate the same with Dialogflow as a fulfillment webhook and in that case, the response will be returned from our API which could be a calculated response as per the backend business logic. In the next section, we’ll see how we can create a webhook using Microsoft’s bot framework and integrate the same to our bot.

Integrating the Bot with Slack

You can learn how to create your own slack app in this article.

1. Go to the Integrations section of Google Dialogflow console and enable Slack.

   

2. Follow the instructions as shown in the popup.

   

3. Create your new slack app and get the needed details to be filled in this section.

   

   

4. Open the newly created Slack app and type "Hi". It will respond as expected.

   

   

   

   

So, we get the response from the default return response.

Yippie!

Conclusion

In this detailed article, we learned what a chatbot is, how to create your own bot using Google’s Dialogflow and test the bot in Dialogflow console and in Slack App. In the next article of the series, we’ll learn how to create a bit using Microsoft’s bot framework and return the fulfillment response from that webhook instead of returning default response from the Dialogflow Intent.