Start building your own chatbot now

Introduction to chatbots

Chatbots are basically “talking” robots that get certain tasks done automatically. Conversations with chatbots can be either audio or textual.

Examples can be asking Alexa to turn lights on or off (audio), chatting with a Domino’s Pizza chatbot on Facebook Messenger to order pizza (textual), or use an airline chatbot online to book flights (textual).

Of course, most of you would like to chat with chatbots as if you are talking to real people, and this is where Natural Language Processing (NLP) comes into play to add more humanity and intelligence to chatbots.

SAP Conversational AI is a great platform utilizing NLP to help users create intelligent chatbots that can get things done while sounding more like humans. The intention of this tutorial is to help you build a chatbot integrated with Slack to search for restaurants on Yelp.

We call this chatbot “Food4U”. You can find this project at https://cai.tools.sap/dennis2018/food4u.

STEP 1 – Create a working chatbot on SAP Conversational AI

First visit https://cai.tools.sap/signup and create your own account. After you have created an account and logged in, click on “+ NEW BOT” blue button to create a new chatbot. To see how I created the “Food4U” chatbot, watch my video.

Step 1.1 – Create chatbot

Now (1) select all skills for your new bot, (2) named the new chatbot “food4u_demo”, (3) select “Public” radio button, and (4) click “CREATE A BOT” blue button to create this new chatbot! After a few seconds, you are at “Train” page of “food4u_demo” chatbot. Now remove intents you don’t need.

Only keep these intents (no, yes, say-thanks, goodbye, and greetings), as shown below:

Step 1.2 – Create intents

We need to create 4 new intents: restaurant_start, restaurant_search, restaurant_type, restaurant_city.

These intents are designed to trigger “Skills” that will take actions needed to make this “food4u_demo” chatbot work.

The “restaurant_start” intent is to help trigger your chatbot to show “Food4U” start page.

To create this, at “Train” page click “Create” button, and at pop-up name your intent “restaurant_start” than click “CREATE INTENT” button.

After that, at “restaurant_start” intent page type in expressions at “Add an expression” textbox, and hit enter.

Expressions for you to add for “restaurant_start” intent can be “food now!” or “I’m hungry”, as shown in the second image.

You can be creative here, you will have to add at least 10 expressions for each intent. The “restaurant_search” intent is to help initiate the restaurant search process.

To create this, at “Train” page click “Create” button, and at pop-up name your intent “restaurant_search” than click “CREATE INTENT” button.

After that, at “restaurant_search” intent page type in expressions at “Add an expression” textbox, and hit enter.

You will need to add expressions for the  “restaurant_search” intent, you can try different variations of the word “Restaurants” (restaurants, restaurant, Restaurants, Restaurant): For “restaurant_type” intent, follow similar process mentioned earlier to create this intent.

For “restaurant_type” intent, create as many expressions (e.g. I want Korean food) as you can.

This will train the chatbot into understanding your requests on the type of restaurants with higher accuracy, so to proceed to ask you the city location (e.g. Seattle) of restaurants you are looking for.

Note that words like “Chinese” and “Korean” in your expressions will be labeled as NATIONALITY entity, so you have to relabel them as CUISINE entity.

To create this CUISINE entity, you can click to expand an expression like “Polish” (see it originally got labeled as NATIONALITY, at the screenshot below), highlight “Polish” and enter “cuisine” to finish the process.

After this is done, not only CUISINE entity got created, the expression “Polish” is now labeled as an CUISINE entity! Now for “restaurant_type” intent, you are free to re-label all the expressions’ NATIONALITY keywords (e.g. Chinese, Russian, Korean, etc.) to be CUISINE entity keywords.

For example, for the expression “I want Indian restaurants”, click to expand the expression and see that the word “Indian” got labeled as NATIONALITY, and simply highlight the word “Indian” than click on CUISINE green tag (see screenshot below).

After that, the word “Indian” in the expression will be seen as a CUISINE entity!

After re-labeling many expressions, for any new expressions like “I want African food” you created from now on, the platform should automatically re-label all NATIONALITY keywords like “African” to be of CUISINE entity, because you already trained it to automatically recognize which words in expressions are of CUISINE entity! For “restaurant_city” intent, follow similar process mentioned earlier to create this intent.

For “restaurant_city” intent, create as many expressions (e.g. I want restaurants in San Jose) as you can.

This will train the chatbot into understanding your requests on the city location of restaurants with higher accuracy, so to proceed to display a “card” that gives you a button you can click to search for restaurants of specific type/city on Yelp.

Below is a screenshot of “restaurant_city” intent page with many expressions disclosing which geographical location the user wants for the chatbot to search for restaurants: After creating all 4 intents, you click on the “Train” tab to enter the “Train” page. In here, for the first 4 intents, you can see entities that are being used to train the chatbot in these 4 intents:

Step 1.3 – Create skills

After creating all the intents you need, you will have to build skills that can utilize the intents for the bot to do what you really want, which is to search for restaurants of specific type/city you desire on Yelp!

Next to “Train” tab, click “Build” tab to build skills for your bot.

First remove all skills you don’t need, you should only leave these 3 skills (greetings, small-talk, fallback) as shown in the screenshot below: Now you can create these 4 skills: restaurantstart, restaurantsearch, restauranttype, restaurantcity.

To create each skill at the “Build” page, click on “+ Create skill” button on the black menu, and at resulting pop-up page type in the name of the skill followed by clicking “CREATE SKILL” button to finish creating the skill: Repeat the same process 4 times to create these 4 skills: restaurantstart, restaurantsearch, restauranttype, restaurantcity. 

Now you should these 4 skills at the “Build” page: But now these 4 skills are simply empty containers. You need to program appropriate action(s) into each of the 4 skills, allowing this chatbot to do what a user wants or expects.

At the same time, you need to set-up trigger(s) for each skill, so to command the skill to perform the desired action(s) when all the trigger requirements are being fulfilled.

Without setting the trigger for a skill, the skill will never get cues to perform actions (like a light bulb without a switch to turn it on).

Step 1.4 – set up trigger/actions of “restaurantstart” skill

The “restaurantstart” skill will perform the action of displaying the welcome page, and this skill should be triggered whenever an user entered an expression relevant to “restaurant_start” intent.

To make sure the “restaurantstart” skill will do as mentioned above, first click on “restaurantstart” skill you see on “Build” page and set-up the trigger/action for the skill.

First you click on “Triggers” tab, type in “@restaurant_start” at textbox and click “SAVE”, and you should see this: Now click on “Actions” tab, click on “ADD NEW MESSAGE GROUP” button.

After that, click “SEND MESSAGE” button followed by selecting “Card” message type.

Than I added image to the card by inserting the link https://tinyurl.com/y77t4cp7 at “Your image url” section of the card: At “Title” and “Subtitle” section of the card, type in appropriate messages as shown at the screenshot below, and click “SAVE” blue button: Congratulations, you successfully set-up trigger and action for “restaurantstart” skill! Now click on “Build” tab, and move onto “restaurantsearch” skill, to get ready to set up trigger/actions for this.

Step 1.5 – set up trigger/actions of “restaurantsearch” skill

The “restaurantsearch” skill will perform the action of telling a user to enter a restaurant type (e.g. Indian).

This skill is triggered whenever a user entered an expression relevant to “restaurant_search” intent.

To make sure the “restaurantsearch” skill will do as mentioned above, first click on “restaurantsearch” skill you see on “Build” page and set-up the trigger/action for the skill.

First you click on “Triggers” tab, type in “@restaurant_search” at textbox and click “SAVE”, and you should see this: Now click on “Actions” tab, click on “ADD NEW MESSAGE GROUP” button.

After that, click “SEND MESSAGE” button followed by selecting “Text” message type.

Then add the statement “What type of restaurants? For example, Chinese food, Korean food, Italian food, etc.” into the text box, and clicked “SAVE” button.

Now you should see this: Congratulations, you successfully set-up trigger and action for “restaurantstart” skill!

Now click on “Build” tab, and move onto “restaurantsearch” skill, to get ready to set up trigger/actions for this.

Step 1.6 – set up trigger/actions and requirements of “restauranttype” skill

The “restauranttype” skill will perform the action of telling a user to enter a city location (e.g. Chicago).

This skill is triggered whenever a user entered an expression relevant to “restaurant_type” intent.

To make sure the “restauranttype” skill will do as mentioned above, first click on “restauranttype” skill you see on “Build” page and set-up the trigger/action for the skill.

First you click on “Triggers” tab, type in “@restaurant_type” at textbox and click “SAVE”, and you should see this:

bot-builder-restaurant

The “restauranttype” skill is more complex than the previous 2 skills we have created, for it involves memory access to CUISINE entity variables, so to later tell the chatbot the CUISINE requirements the user wants (e.g. Korean) in searching for restaurants.

So we need to set-up the “Requirements” of the “restauranttype” skill.

To do so, click on “Requirements” tab and input as followed (#cuisine as cuisine): Now click on “Actions” tab, click on “ADD NEW MESSAGE GROUP” button.

After that, you will see a link for “ADD CONDITION”, click on it and set condition as shown below (the condition is: if @restaurant_type is-present AND #cuisine is-present):

Now click “SEND MESSAGE” button followed by selecting “Text” message type. Then you add the statement “So you want {{memory.cuisine.raw}} food restaurants. At which city?” into the text box, and click “SAVE” button. Now you should see this:
Congratulations, you successfully set-up trigger, requirements, action for “restauranttype” skill!  Now click on “Build” tab, and move onto “restaurantcity” skill, to get ready to set up trigger/requirements/actions for this.

Step 1.7 – set up trigger/actions and requirements of “restaurantcity” skill

The “restaurantcity” skill will perform the action of displaying a “card” allowing a user to click to search for restaurants of specific type/city on Yelp in the browser.

This skill is triggered whenever an user entered an expression relevant to “restaurant_city” intent.

To make sure the “restaurantcity” skill will do as mentioned above, first click on “restaurantcity” skill you see on “Build” page and set-up the trigger/action for the skill.

First you click on “Triggers” tab, type in “@restaurant_city” at textbox and click “SAVE”, and you should see this: The “restaurantcity” skill involves memory access to LOCATION entity variables, so to later tell the chatbot the LOCATION requirements the user wants (e.g. Seattle) in searching for restaurants.

So we need to set-up the “Requirements” of the “restaurantcity” skill.

To do so, click on “Requirements” tab and input as followed (#location as location):

Now click on “Actions” tab, click on “ADD NEW MESSAGE GROUP” button. After that, you will see a link for “ADD CONDITION”, click on it and set condition as shown below (the condition is: if @restaurant_city is-present AND #location is-present): Now click “SEND MESSAGE” button followed by selecting “Text” message type.

Then you add the statement “Will search for {{memory.cuisine.raw}} restaurants at {{memory.location.raw}}.  Please Wait.” into the text box, and click “SAVE” button. Now you should see this: Now click “SEND MESSAGE” button followed by selecting “Card” message type.

At the card you add any image relevant to food using image URL you found online (e.g. www.example.com/food.jpg).

At “Title” section add the statement “{{memory.cuisine.raw}} restaurants at {{memory.location.raw}}”.

At “Subtitle” section add the statement “Please say “Restaurants” again to start a new search for restaurants!”.

Click “ADD A BUTTON”  followed by clicking “Link” to add a button that can link to URL.

Enter the caption “Results” for the button. In-order for the user to click on “Results” button to search restaurants on Yelp, at “Web_url” text input of the “Results” button you must add the appropriate customized Yelp URL: Here is the customized Yelp URL you should use for “Results” button, to be pasted to the “Web_url” text input: https://www.yelp.com/search?find_desc=Restaurants+{{memory.cuisine.raw}}&find_loc={{memory.location.raw}}. So in the Yelp URL we just pasted, {{memory.cuisine.raw}} and {{memory.location.raw}} variables allow Yelp to search for restaurants of cuisine type and city (respectively) you have inputted to the chatbot earlier.

With your card properly programmed, now click on “SAVE” blue button to ensure your work on this card is not lost: Whenever your chatbot responds to you with this card, click on “Results” button will open a new browser page to search for restaurants on Yelp, according to the cuisine type and city you have inputted to the chatbot earlier.

Congratulations, you successfully set-up trigger, requirements, action for “restaurantcity” skill!

Step 1.8 – Test your chatbot!

After you finished building up all 4 skills for the bot, click on “CHAT WITH YOUR BOT” blue button to open a chat window to test your chatbot, to ensure your chatbot is functioning correctly.

Below is an example test flow: Again, clicking the “Results” button of the card at the end of the conversation will open a Yelp page on a new browser page to search for restaurants.

Now you should have a fully working “food4u_demo” chatbot on SAP Conversational AI Platform, and please have lots of fun chatting with it to searching for restaurants on Yelp website!

STEP 2 – Integrate SAP Conversational AI chatbot with Slack

First create your own account on Slack using your personal email, and create a workspace called “TestSpace” on Slack.

Watch my video to see how I integrate the “food4u_demo” chatbot I created to Slack. This second part of the tutorial aims to teach you how to integrate the “food4u_demo” chatbot you just created to Slack!

Step 2.1 – Slack integration tutorial (1-2)

At your SAP Conversational AI home page after logging into your account, click “food4u_demo” link.

Then test your “food4u_demo” bot on SAP Conversational AI as before, to make sure the bot is still working well.

Now click on “Connect” tab of your bot on SAP CAI, then scroll to “Slack” item and click on it. At the SAP Conversational AI slack integration tutorial pop-up page, first click on “(1) Create a Slack app”, and open https://api.slack.com/apps on a new browser page, so to enter “Slack API” page.

At “Slack API” page, click on “Create New App” green button.

At “Create a Slack App” pop-up, name it “Food4U_cool_demo” and select “TestSpace” as your development Slack workspace, and click “Create App” green button.  At the SAP CAI slack integration tutorial pop-up page, click on “(2) Get your credentials.”

To fill-in “Client ID” and “Client secret,” need to find them at “Slack API” page.

To find them, at “Food4U_cool_demo” site on Slack, click on “Basic Information” tab under “Settings” at left-side menu, and scroll down to “App Credentials” section to see “Client ID” and “Client Secret” (see screenshot below): Now copy “Client ID” and “Client Secret”, past them to appropriate places at “(2) Get your credentials” of SAP CAI slack integration tutorial pop-up page, and click “GET TOKENS” blue button: After a few seconds, right below the place where you added “Client ID” and “Client secret” previously, you will see your SAP CAI bot’s “OAuth URL” and “Event URL” tokens, ready to be added to your Slack app later:

Step 2.2 – Slack integration tutorial (3-7)

At the SAP CAI slack integration tutorial pop-up page, click on “(3) Add a new bot user” and follow the instruction to add a new bot user on your “Slack API” page: After finishing “(3) Add a new bot user” as instructed, click on “(4) Set the OAuth redirect URL” and follow the instruction, so you in the “OAuth & Permission” tab page (on your “Slack API” page) will fill the “Redirect URLs” with the “OAuth URL” of your SAP CAI chatbot (find it as shown in the last screenshot of Step 2.1): After finishing “(4) Set the OAuth redirect URL” as instructed, click on “(5) Enable interactive messages” and follow the instruction. Basically, you in “Interactive Components” tab page (on your “Slack API” page) will fill the “Request URL” with “Event URL” of your account bot (find it as shown in the last screenshot of Step 2.1): After finishing “(5) Enable interactive messages” as instructed, click on “(6) Fill the Events redirect Url” and follow the instruction.

Basically, you in “Event Subscriptions” tab page (on your “Slack API” page) will fill the “Request URL” with “Event URL” of your account bot (find it as shown in the last screenshot of Step 2.1), followed by enabling “message.channels” and “message.im” at “Subscribe to Bot Events” section: After finishing “(6) Fill the Events redirect Url” as instructed, click on “(7) Add my bot to a slack channel” and follow the instruction. Basically, you have to open the link provided in “(7) Add my bot to a slack channel” on a new tab in the browser, and add your SAP CAI chatbot onto your Slack workspace (“TestSpace” in this case):

Step 2.3 – Slack integration tutorial: talking to your chatbot on Slack!

At your SAP CAI slack integration tutorial pop-up page, you will proceed to “(8) Chat with your bot” in which you will test your chatbot on Slack. Now at your “TestSpace” Slack page, click on your app “food4ucooldemo” under “Apps” section, and start talking to the chatbot on Slack like you would do on SAP CAI to search for restaurants of specific type/city on Yelp!

Below is the example test flow of your “food4ucooldemo” chatbot app on your “TestSpace” Slack page: Continue from bot’s last response “So you want Italian food restaurants. At which city?” in the test flow, you now at Slack input a city such as “Chicago” and the bot will respond to you with a card containing an image and a “Results” button. Now click on “Results” button on the card: By clicking “Results” button on the card in your Slack chat, this opens a new browser page to search for “Italian” restaurants in “Chicago” (in this example) on Yelp website: Now, you have successfully integrated your “food4u_demo” chatbot with your Slack. Congratulations and have lots of fun chatting with your chatbot on Slack to search for restaurants in Yelp!

Conclusion

As you can see in the tutorial, you don’t have to be a skilled programmer to create a workable chatbot on SAP Conversational AI platform. Basically, anyone with proficient computer experiences can create a chatbot, and integrate the bot to platforms like Slack.

SAP Conversational AI is designed to make chatbot building process fun and efficient, and remove most technical barriers that prevent so many “non-technical” business people from creating chatbots that could enhance businesses.

SAP Conversational AI is like a factory in which you can build and test your chatbots, and step 1 of this tutorial is here to give you a good taste of the whole “factory” process. However, in-order for your SAP CAI chatbots to be of value for businesses and societies at large, you got to allow customers to use your chatbots on various commercial platforms like Facebook Messenger or Slack.

That is why step 2 of this tutorial is here to help you experience the process of integrating your chatbot with platforms like Slack, so you can understand the basics of how to get your chatbots out there to the world!

Thanks for reading and happy bot building 🙂

Want to build your own conversational bot? Get started with SAP Conversational AI !

Follow us on
There are currently no comments.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

This website uses cookies

Please confirm that you accept cookies to monitor the performance of our website