Playing with Messaging Chatbots in the Omnichannel Contact Center

People today communicate with each other over social networks using messaging applications. This has forced businesses to rethink the way that they need to communicate with customers, prioritizing the easiest way for customers to ask questions. Messaging vendors have taken notice and begun adding support for chatbots to improve and automate the ways businesses can interact with customers.

This trend started with adding chat widgets to websites. This allowed customers to browse the website with the company’s contact center agents/bots able to provide immediate, context-based assistance. Human or bot, many of our interactions with contact centers today, and in the future, will shift from phone calls to online, rich text chat sessions. Where will these interactions take place?

The Rise of Omnichannel

The challenge starts with omnichannel.

It used to be easy. You could either pick up the phone and call the business or issue a ticket through the business’ website. Then came SMS, and then the chat widget. But now, there seems to be a proliferation of choices for these text-based channels. These start with SMS, where a business interacts with a person via SMS (also known as A2P, Application to Person). You can make these interactions bidirectional, letting a person reply back, but it isn’t rich. It is limited to short text messages that aren’t very expressive.

It then moves to chat widgets and marketing automation, where a customer’s activity on a certain site is tracked, alongside an interactive chat widget.

Since the arrival of the iPhone, the focus of communication shifted to mobile applications. In the context of a contact center, these branded self-service applications have an advantage in that the user is already logged in and browsing history is saved. These apps now sometimes offer direct interactions with contact center agents, similar to website chat widgets.

With increased use of mobile applications, however, we are starting to see a proliferation of messaging applications adding business APIs. Examples include Facebook Messenger, LINE, WeChat, Skype, Telegram, Viber, Kik, Cisco Spark, and Slack.

With so many options available, companies need to ask themselves:

"What is the best way to add the ability for your customers to reach out and chat with you?"

In an omnichannel fashion of course - letting your customer interact with you in the most efficient way for him/her - which means companies need to implement all potential channels that their customer might use to communicate.

Below are a few omnichannel options:

1. Self-Development - Build it on your own, maintain the code, and add new channels and support for messaging platforms as they become more popular among your target audience
2. Use CPaaS - Communication Platform as a Service vendors are busy adding support for messaging platforms and offering omnichannel capabilities so you don’t need to build it all from scratch
3. Integrate a readymade service - If using a cloud-based system, the contact center software you are using might already support these capabilities.

Playing with Twilio Studio

I am a developer at heart but I haven’t really developed in recent years because I moved to product management. That didn’t deter me from trying my hand with a quick proof of concept though. As a tinkerer in programming, the CPaaS alternative was the most intriguing. It strikes a nice balance between flexibility and “time to market.” With self-development, supporting multiple channels is tedious, especially in the long run, while the ready-made service reduces customization and flexibility since you have to rely on someone else’s cookie-cutter model.

Since Twilio just announced a new visual tool called Twilio Studio, I thought it would be a good opportunity to test my proof of concept.

The Scenario

I have my own website/blog called BlogGeek.me. I also have a Facebook page associated with my site but I never use it. Most of my effort is directed towards the creation of an email list. Wouldn’t it be better if I could add an omnichannel here? That could make my content resonate with a larger audience since I’ll be reaching out to them where it is convenient to them.

To set up this specific example, I decided to work out the following capabilities:

1. Reply to an incoming request over Facebook or SMS
2. Send something to a customer who previously interacted with me in the channel of his/her choosing

I started by checking how I can rapidly set something up here and then fine tune it afterwards. This is a great approach for developers who want to achieve the same. You can follow along and create your own omnichannel experience for your customers.

Setting up a Service

First, we need to configure a few settings in the account. Once you get your Twilio Studio account up and running, it was time to create a new Flow. A Flow in Twilio Studio is a blueprint of how you’d like to handle the possible interactions - in my case, my BlogGeek.me Flow.

An empty Flow starts with this initial state widget:

Incoming Message denotes an incoming message, Incoming Call deals with my phone number, and REST API can be used for additional actions.

I’d like to be able to receive both SMS and Facebook messages, so I’ll configure these first. To install the Facebook channel, I used Twilio’s marketplace Channels Catalog. Once installed, I connected it to my personal Facebook account and from there, it found my BlogGeek.me page on Facebook.

The only thing left to do is to set the CALLBACK URL on the Facebook channel configuration to what the Studio Flow has in its FLOW URL:

Storing a User’s Preference

Twilio Studio doesn’t really care about a user’s preference at this stage, so you will need to store that information somewhere. To that end, I decided to store the incoming messages, along with the origin information in Google sheet. I will be using that Google Sheet as a poor man’s list of customers who reached out to me so I can send them notifications in the future. In my case, a free online video course on selecting a WebRTC video codec. The easiest way to get incoming messages from Twilio Studio end up in Google Sheet is by using Zapier: a great tool that enables integration of different services.

Here’s the Zap we will create:

We will start by creating the trigger app - that one will be based on Webhooks by Zapier app.

Select the “Catch Hook” trigger:

Our next step is to create in Twilio Studio an HTTP REQUEST widget - once Twilio Studio receives an incoming message, it will use this new widget to send the message to the Zapier webhook.

In Zapier, the next step we reach will show us the webhook:

In Twilio Studio, we will create a new HTTP REQUEST widget and connect it to the Incoming Message of our Flow, instructing it to send a POST message to the webhook URL we got from Zapier:

Below are the settings in the sidebar that I configured. I decided to call this widget “Zap it.”

I pasted the webhook URL from Zapier into the REQUEST URL of the HTTP REQUEST widget in Twilio Studio.

Now, I need to populate the fields of this webhook. Scrolling down the widget configuration on the sidebar, I added my “body” and “from” fields as HTTP PARAMETERS:

This will pass the customer’s addressing (SMS or Facebook) along with the message he/she sends me to Zapier.

In “body”, I placed {{trigger.message.Body}} and in “from”, I placed {{trigger.message.From}}.

Zapier wanted me to test this app before moving onto the next stage, which means sending a message through my Facebook page.

Now that we have our messages coming into Zapier, it is time to put them in a Google Sheet. To that end, I created a Google Sheet with a rudimentary header row consisting of Date, From and Message fields. Here’s a sample sheet for you to use. In Zapier, select the Google Sheets app for the next application and then pick the Create Spreadsheet Row action:

Once you connect it with your Google Docs account, you can configure the row that will be added:

After selecting the Spreadsheet and Worksheet, Zapier will automatically add the three fields (Data, From, and Message) from the Google Sheet.

For the Date field, typing “Zap Meta Human Now” will give you the current date and time.

For the From field, select the From field from Step 1.

For the Message field, select the Body field from Step 1.

After testing and approving this, whenever someone sends a message to your Facebook page account, you’ll get a row added to the Google Sheet.

Note that I’m not concerned about filtering duplicates here. This can be added later if needed. For now, I want to have all the messages stored in this Google Sheet. They might come in handy when I decide to make this specific Bot more intelligent in the future.

Replying to the Incoming Message

So far we tried to create a workflow that enables us to receive messages over SMS and Facebook. To achieve this we:

1. Created a Twilio Studio Flow
2. Configured it to receive Facebook messages
3. Created a Zap on Zapier that connects an incoming message from the Twilio Studio Flow to a Google Sheet

Now, we need to send a reply to the person who contacted us. To do this, we’ll create a new Send Message widget in the Twilio Studio Flow:

A few things to note here:

• I set up a very simple message in the MESSAGE BODY:Thanks for reaching out to me. When I have something interesting - I'll let you know.”
• There’s a failure Flow that I am not including here as it is not necessary for our purposes. This is one of the features that I like about Twilio Studio - it points out and gives you the chance to correct possible errors in your Flow.
• We’re done… at least with sending a reply to an incoming message from a customer

Sending out an Unsolicited Message

So-far you have been able to collect a list of users. Next you might want to send them a message. Luckily you can do this with Twilio Studio by invoking a REST call, here's how I did it:

I connected the REST API wire of our Flow’s starting point to a new Send Message widget:

For the configuration of the message, I used {{flow.data.body}} as the actual content of the message - more on that later. The rest was populated with defaults. Here’s what the widget’s configuration looks like:

We now have the Flow in place for sending out a message. To test it, I decided to use a curl invocation:

curl -X POST \

  https://preview.twilio.com/Studio/Flows/<MY-FLOW>/Engagements \

  -u '<MY-SID>:<MY-AUTH-TOKEN>' \

  -H 'cache-control: no-cache' \

  -H 'content-type: application/x-www-form-urlencoded' \

  -d 'From=<FROM-ID>&To=<TO-ID>&Parameters={"body":"<MY-MESSAGE>"}'

Below, you’ll see how to configure each of the codes that are highlighted to make it work for your website:

MY-FLOW: Use the URL of the Twilio Studio editor page:

MY-SID and MY-AUTH-TOKEN: The API LIVE credentials of your account which can be found at this link: 

FROM-ID: Where do you want your message sent from? For me, this was the Facebook page ID. The easiest way to obtain it is via the Channels menu in the marketplace. Just pick the installed Facebook Messenger channel there and copy the Page ID:

The FROM-ID for me was “messenger:99XXXXXXXXXXX36”.

TO-ID: I selected this from the Google sheet that we created earlier.

MY-MESSAGE: Write the message that you want to send your customers.

Tying It All Together

We wanted to be able to create an omnichannel interaction with users over SMS and Facebook using Twilio Studio. Here’s what we’ve done:

1. Created a flow where incoming messages from SMS and Facebook can be received
2. Collected these messages into a Google Sheet for external processing using Zapier
3. Sent a reply to each incoming message
4. Sent out an unsolicited message to customers on our Google Sheet. In the future, it might be a good idea to automate that from the manual curl command used above.

The complete Flow looks like this:

This lacks error-checking and additional features such as filtering the contents of incoming messages and customizing a reply, but it is a good start for an automated omnichannel experience that can be customized and tweaked for your company.

Below is a test chat sent through a friend’s Facebook Messenger account using this Flow:

Conclusion

In this article we explored the creation of a simple omnichannel messaging bot by using Twilio Studio. This is useful for other developers because it can be used as a baseline for the creation of two-way interactions with a business’ users and customers on the channel that is most convenient to the user.

If you want to read more, take a look at the Twilio’s guide to creating a Santa Bot with Twilio Studio. It is a bit more elaborate and complicated than what I’ve shared here.

Oh, and if you’re interested, come say hi to the chatbot on my Facebook page - you already know how it works behind the scenes :-)

About the Author

Tsahi Levent-Levi is an Independent Analyst and Consultant for WebRTC. Tsahi sometimes writes on behalf of Twilio. Tsahi is the author and editor of BlogGeek.me, which focuses on the ecosystem and business opportunities around WebRTC, CPaaS and Messaging.