Kompose GUI Bot Builder

Overview

Kompose is a GUI bot builder based on natural language conversations for Human-Computer interaction. You don’t need any coding skills to master Kompose. It has a simple, intuitive, and easy-to-use interface.

Bot Integration with the Kompose

  • Login to your Kommunicate dashboard.
  • Navigate to the Bot Integration section >> Select Kompose - Bot Builder >> Select your bot

Kompose bot builder

Tutorial Blog: Create a chatbot using Kompose bot builder

Video tutorial: Create a chatbot using Kompose bot builder in 5 minutes

Configure Intents in Kompose

  • Enter the 'Answer' section in Kompose-bot builder.
  • Setup questions and answers for your bot in this section.
  • Add training phrases for your intent like this:

Add training phrases

  • To achieve good results, make sure that insignificant(non-contextual) words are not repeated in every training phrase. Also, try to have at least 3 to 4 training phrases for each intent. For example, 'Why', 'I', 'constantly' etc. are insignificant words in the above shown example and therefore should not be repeated in every training phrase for good accuracy. This is to make sure that the correct intent only gets triggered with the right context.

  • Case 1. Correct intent gets triggered. Correct intent trigger

  • Case 2. Response for unknown user input gets triggered. unknown user input

Bot to Human handoff in Kompose

Bot to human handoff is useful when the bot is unable to answer the customer question or is unable to understand what the customer is saying and if the user needs to talk to a human agent directly.

1. Fallback Intent

  • In Kompose, there's an intent "Default Fallback". In this intent, you have to setup fallback message when bot is not able to answer. You have to set the bot message that should be shown to user, if it's unable to answer. When none of the intents are matched, the fallback intent is triggered, the bot response associated with it is shown to the user. Go to Bot Says Section then Click on more and then select Handover

bot to human hand off

bot to human handover

2. To Assign a conversation to a specific support agent

  • Go to Bot Says Section then Click on more and then select Handover and then click on "Assign to a Teammate"

assign to a teammate

  • If you do not want to use the Handover method then you can also add the JSON code below (as a custom payload) to the bot response of the Intent. Specify the agent's email ID (same email ID which an agent uses to log into the Kommunicate dashboard) in KM_ASSIGN_TO parameter. If KM_ASSIGN_TO parameter is left empty, the conversation routing rules will be applied and the conversation will be assigned to a human agent based on the routing rules.
{
  "platform": "kommunicate",
  "message": "our agents will get back to you", 
  "metadata": {
    "KM_ASSIGN_TO": ""  
  }
}

Set "KM_ASSIGN_TO": "<AGENT'S USER_ID>" if you want to assign the conversation to specific agent.

using payload bot to human off

Disable Small Talk option in Kompose

  • Login to your Kommunicate dashboard.
  • Navigate to the Bot Integration section >> Select Kompose - Bot Builder >> Select your Bot >> Click on Small Talk >>Click Setting ⚙️ >> Disable Small Talk

disable small talk

Extract Entities

Entities are used to identify and extract useful data from user inputs. Kompose supports extracting the user's entities like email, phone number etc.

To add the entities

  • Login to your Kommunicate dashboard.
  • Navigate to the Bot Integration section >> Select Kompose - Bot Builder >> Select the bot >> Select Answer >> Type your training messages >> Then in Bot Says section

Extract identity phone number

extract identity 2nd page

final extract identity

Custom Entity

Custom entities help us to identify and extract the useful data from the inputs given by the end user.

There are 2 ways to create the custom entity in the Kompose bot builder
  1. via the Extract entities dropdown that is available on the Bot Says section of the Answers page.
  2. via the Entities tab on the Kompose Settings page.

1. Create entities from the Kompose Answer page

Step: 1

Click on the Extract Entities >> Create Custom Entity >> Fill the entity details as shown in the following images.

Provide the Entity name, Variable name, and the Values(entity type name and synonyms)

Entity name: A name given to the custom entity. Eg. Shirt Size

Variable name: It's automatically generated by the system using the Entity name filled. Eg. ShirtSize

Add values:

Entity type: Entity type for ShirtSize is small, medium, large, extra-large.

Enter synonyms: Synonyms for the entity type ShirtSize is M and Medium can be synonyms for the medium entity type.

Click on the +Add row link to add more entity types.

Create_entity-min.png

Creating-entity.png

Created_successfully-min.png

Step: 2

After creating the entity, go to Extract Entities and select the created entity as shown below;

select-entity-min.png

After selecting the entity, extract it using variable name as shown below

use-entity-min.png

You have successfully created the entity and extracted it from the user input, now you will have to add the training phrases in the User says section of the same intent as shown below;

entity-trainingphrases.png

Entity extraction is enabled now, check out the following test page

entity_testing-min.png

2 Creating entities via the Entities tab on the Kompose Settings page

There is another way to create the entity, this will allow us to EDIT and DELETE the entity. Also, we can create entities and save them priorly.

Step 1: Go to Settings⚙️ available on the top right corner of the Kompose Bot builder

settings-page-min.png

Step 2: Click on Create Entity >> Fill all the required fields and create the entity

settings-entities-min.png

CreateEntity-settings-min.png

Step 3: You can manage the created entities. Edit, Delete, and Disable entities options are available in this section.

Edit_deleteEntity-min.png

Webhooks in Kompose

Webhook feature in Kompose allows you to send responses to your user from your own custom webhook server. This is helpful when you need to return some data from your data base or need to send some responses based on your own custom logic.

Integrate your webhook with Kompose

  1. Navigate to the Bot Integration section >> Select Kompose >> Select Bot >> Click Setting ⚙️ >> Webhook

  2. This section will ask you a webhook URL and request header for the webhook. Webhook URL is required at your backend server so that messages sent to bot can be forwarded to your server. You can use same webhook for multiple bots or can configure different webhook. Kommunicate will send the data to your webhook in below format:

{
    "botId": "bot id who has received the message. This id is same as shown in dashboard.",
    "key": "unique id for every message",
    "from": "user id who has sent the message",
  "message": "message sent by user to the bot",
  "nlpResponse": [ { "message": "Greetings!" } ],
  "matchedIntent":"greetings.hello",
    "groupId": "conversation id",
    "metadata": "extra information with message",
    "contentType": "content type of the message (text, html, location, etc)",
    "applicationKey": "your APP_ID shown in Dashboard Install section",
        "source": "identifies if message is sent from web or mobile",
    "eventName": "events ie. WELCOME , KOMMUNICATE_MEDIA_EVENT etc",
    "createdAt": "message sent time"
}
  1. Kompose sends the message to your webhook and waits for the response. The timeout limit for the webhook URL is set to the 30 seconds. Your webhook should return the array of message in response in below format:
[{
    "message": "A message can be simple as a plain text" 
}, {
    "message": "A message can be a rich message containing metadata",
    "metadata": {
    "contentType": "300",
        "templateId": "6",
        "payload": [{
            "title": "Suggested Reply button 1",
            "message": "Suggested Reply button 1"
        }, {
            "title": "Suggested Reply button 2",
            "message": "Suggested Reply button 2" 
        }]
    }
}]

Each object in message array is rendered as separate message in Kommunicate chat widget.

Welcome message from bots

Kommunicate sends some specific events to your webhook in eventName property. When a user creates a new conversation Kommunicate sends eventName: WELCOME to your webhook. You can check for this property in payload and reply with a welcome message.

Skip bot welcome message

Skip the 'WELCOME' event from dialogflow by setting

 "skipBotEvent":'["WELCOME_EVENT"]'

Skip bot welcome message through Settings

var defaultSettings = {
    "skipBotEvent": '["WELCOME_EVENT"]',
};
Kommunicate.updateSettings(defaultSettings);

Skip bot welcome message for a specific conversation

var conversationDetail = {
    "skipBotEvent":'["WELCOME_EVENT"]'
};
            
Kommunicate.startConversation(conversationDetail, function (response) { });

Send attachments to bot

When a user attaches a file or shares location, Kommunicate sends eventName: KOMMUNICATE_MEDIA_EVENT to your bot along with the attached file information. You can find the file information in KM_CHAT_CONTEXT object in metadata. Below is the sample of webhook payload with attachment detail:

This is sample JSON for file attachment:

{
    "eventName": "KOMMUNICATE_MEDIA_EVENT",
    "metadata": {
        "KM_CHAT_CONTEXT": {
            "attachments": [{
                "type": "image/png", // media type (in form of type/subtype) . Use the regex 'type/*' to get the generic type
                "payload": {
                    "name": "file name",
                    "url": "file url",
                    "size": "size in bytes"
                }
            }]
        }
    },
    "createdAt": 1552638706610,
    
}

Attachment object for location message

{
    "attachments": [{
        "payload": {
            "lat": "Latitude",
            "lon": "Longitude"
        },
        "type": "location"
    }]
}

Extract WhatsApp Number in Kompose

How to get WhatsApp user’s number in Kompose webhook?

We need to setup a webhook in Kompose Intent first.

In webhook call, the user id is sent to your server.You can use that and get user’s phone number, and then do whatever you want to do e.g. storing it in your database, passing it to some CRM as leads or anything else.

Step 1. Setup the webhook

To setup the webhook, you need to log in into your Kommunicate dashboard then go to “Kompose - Bot Builder” ( https://dashboard.kommunicate.io/bots/bot-builder-list ). Here select the bot for which you want to add webhook, then open any intent scroll to the end and select “Webhook” check box, then either select any of the already created webhook or create a new one.

Kompose Webhook Body

Step 2. Get user phone in your code

Now, whenever that particular intent will be triggered, the whole payload consisting of multiple details will come to your server as request body. Here is how it looks:

{
  "botId": "meet-greet-inb71",
  "key": "5-69234790-1662023652048",
  "from": "whatsapp:+919872409999",
  "matchedIntent": "631077918f0d142ade8ea4ad",
  "matchedIntentName": "whatsappChat Intent",
  "parameters": {},
  "nlpResponse": [],
  "message": "whatsapp chat",
  "groupId": 69234790,
  "metadata": {
    "INTEGRATION_CHANNEL_MESSAGE_ID": "ABEGkZhyQFGIAgo6xNGrMtJa8P2_",
    "KM_CHAT_CONTEXT": {
      "groupId": "69234790",
      "botId": "meet-greet-inb71",
      "messageSource": "12",
      "applicationId": "a546470a05536fa2e39da333fb2c8ea9",
      "from": "whatsapp:+919872409999",
      "attachments": []
    }
  },
  "contentType": 0,
  "applicationId": "a546470a05536fa2e39da333fb2c8ea9",
  "source": 12,
  "createdAt": 1662023652051,
  "eventName": ""
}

Kompose Request Body

Inline Code

If you don't have servers to host your custom functions and calls in the form of Webhooks don’t worry. Now one can use Inline code, where you can write the code within the Kompose bot builder and it gets executed when the corresponding message is triggered. We call the Inline code a Dynamic message.

  1. Let’s start by creating Inline code. You can find create inline code option right on the bot builder page. Firstly delete any static message from the “Bot Says” like in the below screenshot.

Inline Delete Bot Says

  1. Enable the “Dynamic Message” and select “Inline Code” and from the below drop-down click on the “Create an Inline Code” button.

Inline Enable Dynamic

  1. A modal will be opened, there enter a name for Code and desired script. Please don’t change the function name or arguments.

Inline Write Code

Click on Deploy to make the inline code live for use.

  1. Now select the created inline code to the bot answers & click on the Train bot.

Alternatively, you can create an Inline Code by setting the Kompose Setting page. One can edit, disable/enable or delete from this page.

Inline Settings Edit

Inline Code Example

Doctor's Appointment Booking Chatbot using Inline Code:

We have created a Bot with pre-chat lead collection enabled and collecting the Email of the user. In Welcome Message, we have added two Buttons named "Appointment" and "Register". To handle Appointment Button, we have created an Intent with "Appointment" as a Training phrase and asking patient to select their illness. Below is the payload used for illness selection.

{
    "message": "Submit your details",
    "metadata": {
        "payload": [
            {
                "data": {
                    "title": "Choose your Symptoms",
                    "name": "Associated Symptoms",
                    "options": [
                        {
                            "value": "Headache",
                            "label": "Headache"
                        },
                        {
                            "value": "Cough",
                            "label": "Cough"
                        },
                        {
                            "value": "Breathlessness",
                            "label": "Breathlessness"
                        }
                    ]
                },
                "type": "checkbox"
            },
            {
                "data": {
                    "name": "Submit",
                    "action": {
                        "postFormDataAsMessage": "true",
                        "postBackToKommunicate": "false",
                        "requestType": "json",
                        "formAction": ""
                    },
                    "type": "submit"
                },
                "type": "submit"
            }
        ],
        "templateId": "12",
        "contentType": "300"
    },
    "platform": "kommunicate"
}

To handle "Submit" Button we have created another Intent named Submit and given Training phease as "Submit" and "Associated Symptoms". To schedule an appointment, we have created an Inline Code by clicking on Settings option present at the top right corner of the Bot builder page and navigating to Inline Code option and clicking on "Create Inline Code" Button. We have named this Inline Code "Submit". The same Inline Code named "Submit" was selcted by enabling Dynamic Message under Bot Says section of "Submit" Intent. Below is Inline Code used.

exports.responseHandler = async (input, callback) => {
  try {
    let resp = {
      "appointment": {
        "comment": {
          "body": "This is Body",
          "public": false
        },
        "book": "Your appointment is booked with ",
        "time": " at 12 PM tommorow"
      }
    };
    if (input.message.includes("Headache")) {
  callback([{
      "message":resp.appointment.book + "Dr. Vipin" + resp.appointment.time
    }]);
}else if (input.message.includes("Cough")) {
  callback([{
      "message":resp.appointment.book + "Dr. Mukesh"+ resp.appointment.time
    }]);
} else if (input.message.includes("Breathlessness")) {
  callback([{
      "message":resp.appointment.book + "Dr. Rajeev"+ resp.appointment.time
    }]);
}
    
  } 
  catch {
    callback([{
      "message": "inline code failed"
    }]);
  }
}

"input" contains all the information regarding that particular Intent. "callback" is used to send the message back to your Bot. Here, we have used input message and replied using callback with appropriate Doctor name scheduled as per the selcted ilness .

Result:

Appoint 1

Extract Entities Through Inline Code

Before extracting entities we need to consider few things here. "1. Response Handler". It is a function which has two parameters. The first parameter is an object which contains the details of the message which triggers a particular intent, and the second parameter is a function which is responsible for generating the response from bot’s end.

Input

The input parameter is an object. It contains all the information which may be required to generate a response.

Such as, we require the data entered by the user in a form, group id or user id to perform any validation and messages sent by the user.

Sample JSON:

{
   "botId": "prhelpt-a8ju9", // the id of the bot which is supposed to reply
   "key": "5-541471-1628416506417", // unique key associated with a message
   "from": "8TXpRYy1bkAZGD4SHAcSatd4uM0b5WiEcM", // userId of the customer
   "matchedIntent": "608fdf42ab34748dd5355d94a", // intent id which got triggered
   "matchedIntentName": "A sample intent",
   "parameters": null, // this will contain extracted entity data
   "nlpResponse": [],
   "message": "Hello from the end user", // the user input which triggered this intent
   "groupId": 65781456, // the group id of the conversation
   "metadata": {
// data such as form response, etc will appear in KM_CHAT_CONTEXT
       "KM_CHAT_CONTEXT": {
           "formData": {
               "Name": "John",
               "Password": "john123",
               "userDetail": "some_secret_detail",
               "Gender": "male",
               "music_type": [
                   "metal",
                   "pop"
               ]
           },
       }
   },
  }

Extracted entities from the “parameters” property

{
   "botId":"new-bot-4-xf5i8",
   "key":"5-656651-16747851667298",
   "from":"8TXpRYy1bkXZhsUyqRiqTtd4uM0b5WiEcM",
   "matchedIntent":"63abc4ac48jfy6977d2350e07",
   "matchedIntentName":"my name is somename",
   "parameters":{
      "name":"John"
   },
   "nlpResponse":[ ],
   "message":"my name is John",
   "groupId":651451,
   "metadata":{ },
}
Callback

The callback is a function, it accepts an array of messages. The messages are objects. A message can be a plain text or it can be a rich message. Refer to the various types of rich messages supported by our platform here.

// example of a simple message
let message1 ={
   "message":"Hello Kommunicate"
}// example of a rich message with buttons
let message2 ={
   "message":"click on the buttons",
   "platform":"kommunicate",
   "metadata":{
      "contentType":"300",
      "templateId":"3",
      "payload":[
         {
            "type":"link",
            "url":"https://www.google.com",
            "name":"Go To Google"
         },
         {
            "type":"link",
            "url":"https://www.facebook.com",
            "name":"Go To Facebook",
            "openLinkInNewTab":false
         }
      ]
   }
}
callback([message1, message2]);;
← Lex IntegrationIBM Watson Integration →