How I accidentally created a creepy Halloween bot ... and you can too!

lynnaloo

Linda Nichols

Posted on October 23, 2020

How I accidentally created a creepy Halloween bot ... and you can too!

Do you like scary movies?

I decided to create a fun and smart Halloween bot using Azure Bot Service and Cognitive services. Specifically, a bot about Halloween movies. Halloween movies, like Scream.

Scream movie          

If I'm making a bot featuring the movie, Scream, then why not replace the main character of the Scream movie - the "caller" - with a new automated robot version?

Scream caller          

Why not is because an automated robot Scream caller can accidentally end up being a little creepy. And the more accurate the "brains" are for the Scream-bot, the creepier it becomes.


Transcript of chat          


Leave me alone          

But it's Halloween, the time of year for a little creepy and a lot of scary!


Creepier bot


So, now you should make a Halloween bot too! Let's get started.

Killer


Create a new bot

Azure Bot Service provides the basic tools for developing bots: the open-source Bot Framework SDK and the bot service for connecting bots to channels. The only requirement for getting started is an Azure subscription and some development experience with Node.js, .NET, or Python for adding some extra bot features.

You can begin with a sample or Yeoman-generated project and connect it to a Bot Service instance, but I prefer to start with Bot Service so that I can download a starter project, including the correct credentials.

Create a Bot Service instance in Azure

  • Find Bot Services in the Azure portal and add a new service.
  • Select "Web App Bot" as the type and then Create.
  • Your "Bot handle" must be unique, but you can change the display name for your bot later in the settings.
  • "App name" will be the value that will be in your application url: <app-name>.azurewebsites.net
  • For the starter template, we'll be using the Node.js Echo Bot
  • Once it's created, you can visit your resource and test your bot in web chat.

Download your code

  • Select "Build" in the Bot Management section of your bot resource and then Download Bot source code.

Note: When downloading your source code, check the box to include settings. This will include your application keys in .env.

  • Now that you have the code, you can start development on the bot locally, in your preferred dev environment.

Create a bank of knowledge for your bots

Certain rules          

To give your scary (and maybe creepy) bot the ability to answer questions, we'll use QnA Maker service and a knowledge base. You can fill the knowledge base with personalized answers and fill in the conversation gaps with some pre-made "chit-chat."

  • Sign into QnA Maker Portal using your Azure credentials.
  • Create a new QnA knowledge base or import an existing creepy Scream knowledge base.
  • When you're done tweaking the question and answers for your bot and training the model, select "PUBLISH."
  • Once your QnA Maker app is published, select "SETTINGS" and note the values from the "Deployment details" section. You’ll need these later.
POST /knowledgebases/<knowledge-base-id>/generateAnswer
Host: https://<yourqna>.azurewebsites.net/qnamaker
Authorization: EndpointKey <resource-key>
Enter fullscreen mode Exit fullscreen mode

Give your bot the brains

Zombies          

  • Add the botbuilder-ai module to your local bot project
npm install -S botbuilder-ai
Enter fullscreen mode Exit fullscreen mode
  • Add the secret values from your QnA knowledge base to your .env file:
QnAKnowledgebaseId="knowledge-base-id"
QnAAuthKey="resource-key"
QnAEndpointHostName="https://<yourqna>.azurewebsites.net/qnamaker" 
Enter fullscreen mode Exit fullscreen mode
  • Update index.js

Following the // Create Adapter section, add the following code to read your .env file. Or you can copy/paste from here.

const configuration = {
   knowledgeBaseId: process.env.QnAKnowledgebaseId,
   endpointKey: process.env.QnAAuthKey,
   host: process.env.QnAEndpointHostName
};
Enter fullscreen mode Exit fullscreen mode

Update the bot construction to pass in the configuration information. Update EchoBot to ScreamBot

const screamBot = new ScreamBot(configuration, {});
Enter fullscreen mode Exit fullscreen mode
  • Update bot.js to add a reference to QnAMaker
const { QnAMaker } = require('botbuilder-ai');
Enter fullscreen mode Exit fullscreen mode

You can see the final version of bot.js here.


Deploy your bot

Scream mirror          

Since your bot is a Node.js web application, we deploy it to Azure just like we would our other applications.

Note: To connect to Bot Service and QnA Maker, it's important to make sure the environment variable are set in the configuration of your App Service instance, or that you deploy a .env file (do not include that in your source control).

Alt Text          

CI/CD with Github Actions
  • To deploy your bot for the first time and setup a CI/CD pipeline for your bot, first commit your local code to a repository in Github.
  • In the Azure Portal, Select "All App service settings" under App Service Settings in your Bot Service instance.
  • Then select "Deployment Center" in the Deployment section to create a Github Action deployment.
  • Under the "Settings" tab, complete the form to create the Github Action in your Github repository. This will automatically commit an Action file to the .github/workflows folder and create the necessary Github secrets to deploy your application to your Azure Web App.

From this point, your Github action will be triggered when changes are pushed to the main branch. You can see the results of your deployments in Github, or in the Azure portal.

Screen shot          


Now that your bot is deployed, you can use it in a variety of ways. Embed your bot in your website. Imagine your scary (creepy) bot as an Alexa voice integration or Slack bot that you can share with your friends?

Sidney          


Next Steps for my super-creepy Halloween Bot

Sequel          

  • Connect the Scream-bot to a channel - Slack, Text, Teams, and more.

Alt Text          

Resources:

💖 💪 🙅 🚩
lynnaloo
Linda Nichols

Posted on October 23, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related