Orbita's Chatbot - A Beginner's Guide

Owned by Rajkiran Alla (Deactivated), created
Last updated: Sept 08, 2021
32 min read

This document explains how to create a working chatbot from scratch.

A Bot Manager flow is available in every new project you create.

Flow Studio Flow

  1. Login to the Experience Manager.

  2. Navigate to the Project Side navigation menu > Create > Agents > Flow Studio.

     

  3. Click on the Create a Flow button.

     

  4. Give a name and description to your Flow studio.

     

  5. Create a conversation using the Flow studio. Refer to Guide to Flow Studio
    or follow the below steps and import the Flow studio conversation.

    1. If you are in an empty flow studio, save it by clicking on the tick icon on the bottom right corner.

       

    2. Select the Flow studio conversation > Verticle ellipses button > Import/export.

       

    3. Select the import tab > Copy the below code and paste it here > click on Import

      { "flowData": { "class": "GraphLinksModel", "copiesKey": false, "linkFromPortIdProperty": "fromPort", "linkToPortIdProperty": "toPort", "nodeDataArray": [ { "key": "857428463371497251", "name": "Start", "description": "", "type": "start", "category": "", "loc": "232.52284749830795 70.10354461669922", "size": "80 80" }, { "key": "402026513763859450", "name": "End", "description": "Thanks for your time.\nThe conversation Ends here\n", "type": "end", "category": "", "loc": "232.52284749830795 850.0689865401407", "size": "80 80", "multiScreen": { "description": "", "validation": { "valid": "", "invalid": "" }, "voice": { "sayText": "<p>Thanks for your time.<br />\nThe conversation <strong>End</strong>s here</p>\n", "rePrompt": "" }, "chat": { "chatText": "" }, "screen": { "shortTitle": "", "longTitle": "", "body": "", "smallImage": "", "largeImage": "" }, "buttons": { "type": "dropdown", "name": "buttons", "choices": [] } }, "directives": { "micInput": true, "keyboardInput": true, "waitTimeNoAnimation": false, "endSession": false } }, { "key": "742436401836062521", "name": "Say", "description": "Welcome to your first conversation flow using flow studio\n", "type": "message", "category": "", "loc": "232.52284749830793 261.8334813484056", "multiScreen": { "voice": { "sayText": "<p>Welcome to your first conversation flow using flow studio</p>\n" }, "chat": { "chatText": "" } } }, { "key": "417833740235547202", "name": "Rating", "description": "Please rate the document you just viewed.\n", "type": "rating", "category": "", "loc": "107.52284749830794 658.3390498084344", "rateValues": [ { "value": "1", "text": "", "data": "" }, { "value": "2", "text": "", "data": "" }, { "value": "3", "text": "", "data": "" } ], "multiScreen": { "description": "", "validation": { "valid": "", "invalid": "" }, "voice": { "sayText": "<p>Please rate the document you just viewed.</p>\n", "rePrompt": "" }, "chat": { "chatText": "" }, "screen": { "shortTitle": "", "longTitle": "", "body": "", "smallImage": "", "largeImage": "" } }, "directives": { "micInput": true, "keyboardInput": true, "waitTimeNoAnimation": false, "endSession": false } }, { "key": "649811202072708483", "name": "Yes/No", "description": "Do you like the document?\n", "type": "boolean", "category": "", "loc": "232.52284749830793 460.08626557842007", "yesDataLabel": "Yes", "noDataLabel": "No", "yesData": "", "noData": "", "multiScreen": { "description": "", "validation": { "valid": "", "invalid": "" }, "voice": { "sayText": "<p>Do you like the document?</p>\n", "rePrompt": "" }, "chat": { "chatText": "" }, "screen": { "shortTitle": "", "longTitle": "", "body": "", "smallImage": "", "largeImage": "" } }, "directives": { "micInput": true, "keyboardInput": true, "waitTimeNoAnimation": false, "endSession": false } }, { "key": "185352052922068022", "name": "Say", "description": "Thats sad. Please leave a comment on the document on what can be improved.\n", "type": "message", "category": "", "loc": "382.52284749830795 658.3390498084344", "multiScreen": { "voice": { "sayText": "<p>Thats sad. Please leave a comment on the document on what can be improved.</p>\n" }, "chat": { "chatText": "" } } } ], "linkDataArray": [ { "from": "857428463371497251", "to": "742436401836062521", "fromPort": "OUT", "toPort": "IN", "points": [ 232.52284749830798, 110.15531692504884, 232.52284749830798, 120.15531692504884, 232.52284749830798, 147.68120307922365, 232.5228474983079, 147.68120307922365, 232.5228474983079, 175.20708923339845, 232.5228474983079, 185.20708923339845 ] }, { "from": "742436401836062521", "to": "649811202072708483", "fromPort": "OUT", "toPort": "IN", "points": [ 232.5228474983079, 318.45987346341275, 232.5228474983079, 328.45987346341275, 232.5228474983079, 355.9598734634128, 232.5228474983079, 355.9598734634128, 232.5228474983079, 383.4598734634129, 232.5228474983079, 393.4598734634129 ] }, { "from": "649811202072708483", "to": "417833740235547202", "fromPort": "Yes", "toPort": "IN", "points": [ 292.63306173170633, 526.7126576934272, 292.63306173170633, 536.7126576934272, 292.63306173170633, 554.2126576934271, 107.52284749830794, 554.2126576934271, 107.52284749830794, 571.712657693427, 107.52284749830794, 581.712657693427 ] }, { "from": "649811202072708483", "to": "185352052922068022", "fromPort": "No", "toPort": "IN", "points": [ 140.9862035163743, 526.7126576934272, 140.9862035163743, 536.7126576934272, 140.9862035163743, 554.2126576934271, 382.5228474983081, 554.2126576934271, 382.5228474983081, 571.712657693427, 382.5228474983081, 581.712657693427 ] }, { "from": "185352052922068022", "to": "402026513763859450", "fromPort": "OUT", "toPort": "IN", "points": [ 382.5228474983081, 714.9654419234413, 382.5228474983081, 724.9654419234413, 382.5228474983081, 752.4913280776161, 232.52284749830798, 752.4913280776161, 232.52284749830798, 780.0172142317911, 232.52284749830798, 790.0172142317911 ] }, { "from": "417833740235547202", "to": "402026513763859450", "fromPort": "OUT", "toPort": "IN", "points": [ 107.52284749830794, 714.9654419234413, 107.52284749830794, 724.9654419234413, 107.52284749830794, 752.4913280776161, 232.52284749830798, 752.4913280776161, 232.52284749830798, 780.0172142317911, 232.52284749830798, 790.0172142317911 ] } ] }, "utterances": [] }

  6. A Flow studio conversation similar to the one in the below screenshot will be imported.
    Make sure you copy the FlowID.

    You can copy the Flow studio ID from the verticle ellipses dropdown menu too.

Flow Manager flow

  1. Click on the icon on the tabs menu, you will get a new flow created.

     

  2. Double click on the flow to rename it and click on “Done”.

     

  3. Click on the hamburger icon > Import > Built-in > Orbita Flows-(BETA) > FlowManager

     

  4. Place the Flow Manager flow on the canvas and Deploy the flow.

Connecting the Flow Studio with Flow Manager flow.

  1. Double click on the Function node named “Set Flow Id”

  2. Locate msg.payload.flowId = '' and paste the FlowID you copied within the single quotes.

     

  3. Click on Done.

     

  4. Deploy the Experience Designer flow.

     

Any changes made to the Experience Designer nodes are denoted by a blue circle on the top right corner of the node.

Connecting the chatbot with Google Dialogflow

To create a Dialogflow account and publish the interaction model to Google Dialogflow, refer to this How to Publish the interaction model to Dialogflow?

After successfully deploying the interaction model to the Dialogflow Agent,

  1. Go to the Experience Designer > Launch tab > Launch node > Endpoint.
    Click on the icon to copy the endpoint of the project.

  2. This URL is used as a webhook URL for Alexa and Dialogflow.
    For Dialogflow, go to Dialogflow and select fulfillment from the side menu. Enable Webhook and use this URL to link the Dialogflow agent with the Orbita project.

  3. You have successfully connected the project with your Dialogflow agent.

Bot Manager flow

The Bot manager flow allows you to have an endpoint for your chatbot.

  1. Login to Experience Manager.

  2. Create/select a project.

     

  3. Enter the project by clicking on it.

  4. Navigate to Project Side navigation bar > Develop > Experience Designer (opens in a new tab).

     

  5. Import the “Another Bot Manager” flow.

    1. Click on the Hamburger menu > Import > Clipboard.

       

    2. Copy the below code and paste it into the pop-up window.

      [ { "id": "252ead02.2d8d12", "type": "tab", "label": "Another Bot Manager", "disabled": false, "info": "" }, { "id": "baf80b38.4f4fb8", "type": "alexa-flow-config reff", "z": "252ead02.2d8d12", "skillConfig": "a6543489.a0c308", "x": 100, "y": 50, "wires": [] }, { "id": "429069bb.4a7018", "type": "http in", "z": "252ead02.2d8d12", "name": "GET", "url": "/bot/yourbot", "method": "get", "upload": false, "swaggerDoc": "", "x": 170, "y": 120, "wires": [ [ "33be7b27.6dd684" ] ] }, { "id": "25f8d9bb.fb9556", "type": "http in", "z": "252ead02.2d8d12", "name": "POST", "url": "/bot/yourbot", "method": "post", "upload": false, "swaggerDoc": "", "x": 170, "y": 200, "wires": [ [ "75f9d49b.79494c" ] ] }, { "id": "1d76b0f5.1eefdf", "type": "http in", "z": "252ead02.2d8d12", "name": "GET: Default Settings", "url": "/bot/yourbot/settings", "method": "get", "upload": false, "swaggerDoc": "", "x": 120, "y": 280, "wires": [ [ "8f101cd3.e3338" ] ] }, { "id": "75f9d49b.79494c", "type": "orbita-bot-provider-v2", "z": "252ead02.2d8d12", "name": "Bot Provider V2", "botInParser": "", "botOutParser": "", "ttsconfig": "{\n \"languageCode\": \"en-US\",\n \"ssmlGender\": \"FEMALE\",\n \"name\": \"en-US-Standard-C\",\n \"audioEncoding\": \"MP3\"\n }", "providerType": "Google", "skillConfig": "a6543489.a0c308", "token": "", "noerr": 0, "nlpData": false, "x": 380, "y": 200, "wires": [ [ "d517357b.5bb358" ] ] }, { "id": "d517357b.5bb358", "type": "http response", "z": "252ead02.2d8d12", "name": "Response", "statusCode": "", "headers": {}, "x": 640, "y": 200, "wires": [] }, { "id": "33be7b27.6dd684", "type": "orbita-bot-view-template", "z": "252ead02.2d8d12", "name": "Bot View Template", "skillConfig": "a6543489.a0c308", "endpoint": "/bot/yourbot", "chatbotVersion": "v2", "customcss": "", "customjs": "", "customheader": "", "chatbotsetting": "", "chatjsurl": "", "x": 390, "y": 120, "wires": [ [ "d517357b.5bb358" ] ] }, { "id": "8f101cd3.e3338", "type": "function", "z": "252ead02.2d8d12", "name": "App Settings", "func": "msg.payload = { \n speechToText: \"Google\", \n headerLogo: \"\",\n waitTime: \"250\",\n micMode: 'push'\n};\nreturn msg;", "outputs": 1, "noerr": 0, "x": 370, "y": 280, "wires": [ [ "d517357b.5bb358" ] ] }, { "id": "a6543489.a0c308", "type": "alexa-skill-config", "skillname": "Test", "projectId": "610bd20e0a9066006e106f87", "intents": "[]", "skillstate": ",fromsession" }, { "id": "slots", "type": "slots", "z": "", "slots": [] } ]

       

    3. Select current flow/new flow as you prefer and click on Import.

       

    4. Click the OK button on the popup window.

       

    5. The Flow named “Another Bot Manager” flow will be available in the Experience Designer.

You can access the chatbot in two ways:

  1. Using the endpoint https://<domain-name>.orbita.cloud:8443/oeapi/bot/yourbot

  2. Open the Http in node named “GET“ and click on the “Open/Copy URL” button

     

  3. You can use the utterances such as “flow”, “flow studio” in the chatbot to invoke the Flow studio conversation.

If you want to skip giving an utterance to launch the Flow studio conversation, connect the Launch node to the Flow manager node as shown below.

Now when you access the Chatbot endpoint, you will receive the first message in the Flow studio conversation on launch.

 

Make sure you delete the Launch node from the Launch tab

Refer to this document for detailed configuration steps. How do I configure Chatbot

Related articles