Robots in Disguise: Intro to Ruby Chatbots with Stealth (Part 2)
This is a 3-part series on creating your first Ruby Chatbot using the Stealth gem. In this part we set up our Flow and Controllers. Here is a link to Part 1 and Part 3. You can see the repo here.
It’s ALIVE.. ALIIIVE!!
Now it’s time to chat with our Bot so we can start crafting conversations!
While on the App page, we can also add a Tester, which is a Facebook account (could be a friend or an alt-account of yours) to test the Bot in an “as viewer” state. This account will need to be a Developer account (which requires a phone number or credit card) This isn’t necessary at all, as you’ll see below, but allows you a streamlined workflow of using a mobile logged into the Tester account to test your changes quickly.
First we need to set up the Facebook Page with a button to initiate the conversation with our Bot. If you’ve closed the Facebook page you’ve made earlier for the bot, then just copy the number string (Page ID) beneath the Bot name (107010021075056) and then go to facebook.com/107010021075056 and that will redirect you to the Facebook Page you made. Click + Add a Button and select Send Message.
This will add a Send Message button to the top of the page which will look like this for a visitor:
Click on Send Message and you should see a conversation window pop up. As you’ll see there’s your greeting text as defined in services.yml.
The Get Started button initiates the conversation with Stealth Bot, and if all is set up on your end, you should hear from it right away.
“Hello World!”
The default greeting Stealth comes with is “Hello World!” — we’ll change that soon enough.
You’ll see the user can now type a response. If we want to make a button-based conversation flow, we’ll need to set composer_input_disable to true in our services.yml file, which disable the keyboard on mobile and the typing bar on web.
The last thing we want to note for now is the hamburger menu on the bottom-left that gives us the buttons we defined in the services.yml file. Test Button does nothing right now but Developer nests a Restart button, which replicates clicking Get Started the first time.
As it’s specified under the development heading, the Developer button is only visible to Testers and Developers.
So let’s design our Bot now. We want to create a simple interaction between the user and the Bot that demonstrates a few basic elements of Stealth and FB Messenger. Here’s the Chatbot flow we’re going for:
We can translate this into our chatbot ‘routing’ through the Stealth framework’s concept of a Flow Map. This is similar to controllers (flows) and actions (states) in Rails. With that in mind, here’s the flow_map.rb we want to represent the high-level flow:
One key difference between Rails and Stealth is that a user in a Rails app can exist in multiple states (e.g. logged in, multiple browser tabs open in different parts of the website) which typically won’t impact their experience or the website functionality. In a conversation, however, it’s single-threaded and so states are finite (in this case, one). We’ll understand what this means in practice shortly.
Set up our BotsController to handle new users and our developer restart button (and a user restart button for this example):
We can then prepare our HellosController and GoodbyesController with methods representing replies.
We can leave the CatchAllsController as is:
Lovely. Our flow logic is all set up now, with our four controllers directing conversations routed via the Flow Map to the appropriate replies. Head on to Part 3 to how to craft replies and deploy our chatbot to Heroku.
