A.I. Chatbots Connect Your Web Site Users Directly to Your FB Messenger

Jim Dee
Jim Dee
Jan 3, 2018 · 6 min read
Photo adapted from “Robot” by Börkur Sigurbjörnsson (Flickr, Creative Commons).

Recently, I decided I wanted to automate some of the inquiries I get on my web site. As I’m a web developer, most people come to my site with one or more of the same few goals. They either want (1) a new web site, (2) someone to fix or redesign an existing site, or (3) someone to do marketing, SEO, or other consulting related to their site.

Looking at the stats, I figured it should be possible to apply some A.I. to that kind of thing and maybe automate some responses to sort of pre-engage visitors in a smart way. But, is this sort of thing easy or doable?

As it turns out, yes, it’s both. There’s a phenomenal site called ChatFuel that facilitates this entire process. The site helps developers (and even some more tech-savvy site owners) build rather advanced Facebook chat bots.

Let me give you an example of what I mean, via a user experience on my own site. So, let’s say someone visits ArrayWebDevelopment.com. In a few seconds, they will notice an invitation to chat pops up on the bottom right of the screen. It looks like this:

Right away, notice that my corporate logo is on the top-right of the chat bubble. I didn’t have to program that in; the bot knew what to grab for that.

Notice also that the site addresses me by name. It has my FB photo and says “Jim Dee” next to it. Again, I didn’t have to do a thing to get this… My machine is logged into FB, similarly to how yours may well also be. If yours is, and you go to my site, it will similarly greet you with your photo and name.

This is critical psychologically because the message to the user is that we’re already connected in some way — and that, in some small way, helps establish trust. Powerful stuff! And, we’re just getting started!

So, let’s say you click “Chat Now”… If so, you’ll see a graphic and a welcome message, like so:

So, again, it’s greeting me by name: “Hi, Jim-”. Pretty neat.

From here, let’s pretend I’m interested in a new site. So, I’ll write: “I’m writing because I need a new web site.” This is where it starts to get more interesting.

When I send that statement in, the bot enters it’s “A.I.” rules. And, thankfully, I have one setup to pick up on some key words or phrases like this. The rule I setup looks like this in the system setup screen on Chatfuel:

Now, it’s important to note that a user need not write exactly what I typed, or really even exactly any of the items in green, above, that I typed in when I setup the AI rule. Chatfuel uses Natural Language Processing rules to help it “understand” the user’s intention. It could well be that “new site” above might’ve been enough for it, but as this was my first bot, I decided to go a bit overboard with my list of keywords, as I sensed it might help the bot “understand.”

On the right side of the above graphic, it shows what should happen if a user sets off this rule (i.e., writes something like “new site”). It says that the bot should reply with a “block” and that the block should be “New Site.”

So, a “block” is sort of a chunk of code or instructions that I’ve also setup. To illustrate this, let’s take a look at the back end setup screen for the “New Site” block:

So, when this “block” is called, it does the items shown above. First, it shows the “typing…” indication for 1.1 seconds. Then it flashes the animated thumbs-up gif file. Then it “types” for another 2.9 seconds, and then flashes the next block of text. (Then it does more stuff not shown in that shot.)

The “typing” thing is that little indication you get on FB Messenger, and many other chat programs, when someone else is there and typing a response. I wouldn’t say it’s entirely meant to *fool* or *trick* users into believing that a real person is there typing. But, there are some psychological aspects to that, which I’ll save for another article. (These things are optional, btw… you need not show such typing animations. But, it’s pretty amazing that you can!)

Okay, back to the UX… Let’s see what happens when I entered the (“need a new site”) text that I did:

In this case, it flashed the thumbs-up gif, did some “typing” and then responded that “new projects” are interesting, and that “I’ll alert Jim so he can respond personally asap.”

So, in this example, it more or less gives the impression that the person typing from my company is probably an assistant — which it is; it’s just a virtual one rather than an actual human one.

Now, you can go completely nuts with this tech. It’s meant to be accessible to non-programmers, and certainly is. But, it really does help if you’ve got some background in how programmatic logic flows. I’ve barely scratched the surface here of what’s possible, but my bot already handles all of the major areas I wanted it to, plus a few others.

Below the above graphic, btw, you can see an example of the bot asking the user for a yes/no response. It asks if they would like to read some of my Medium.com articles. If they click “Sure” it executes another block — similarly w/ a funny gif, some typing, and then a link to my online publication. If they say no, it politely says “ok fine” (albeit with another funny gif). Heck, let’s tell it “no” so I can show you here:

It concludes with the above, plus a final link to our website.

Now, I know what you might be thinking: Why include a link to your site when they may well be a web site user on your homepage while they’re chatting?

Good question! I did that because of another huge benefit of FB chatbots. You see, once you’re chatting with someone (or, in this case, my *page* is chatting with them), you’re connected on FB messenger. That chat record will now be in my chat logs and the user’s, forever (or until they delete it). So, getting a link in there is probably a good idea!

Also, as you’re now connected, you can easily, as the site owner (the FB user) directly follow up with your prospects. Ever take a look at response rates of FB chat vs. email? It’s insanely higher.

As I mentioned, you can build out your bots (or I can do it for you) to almost any degree of complexity. And, yes, the bots can be integrated with many outside services and sites, which advanced users might want to do.

Once you start using this, you’ll think of more and more things for it to do or say in response to various customer input. If you tell my bot “goodbye” (or something similar), it’ll respond. Or, if you say thanks, it’ll also respond:

✍🏻 Jim Dee maintains his personal blog, “Hawthorne Crow,” and a web design blog, “Web Designer | Web Developer Magazine.” He also contributes to various Medium.com publications. Find him at JPDbooks.com, his Amazon Author page, Facebook, Twitter, Instagram, LinkedIn, Medium, or via email at Jim [at] ArrayWebDevelopment.com. His latest novel, CHROO, is available on Amazon.com. If you enjoy humorous literary tales, please grab a copy!

Web Designer / Web Developer Magazine

WDWD Magazine features articles on web site design / development, internet marketing, social media, SEO, and topics like marketing, communications, business development, etc. Editor: Jim Dee of Array Web Development — jim@arraywebdevelopment.com.

Jim Dee

Written by

Jim Dee

Web guy at ArrayWebDevelopment.com; author of books & blogs. See: JPDbooks.com.

Web Designer / Web Developer Magazine

WDWD Magazine features articles on web site design / development, internet marketing, social media, SEO, and topics like marketing, communications, business development, etc. Editor: Jim Dee of Array Web Development — jim@arraywebdevelopment.com.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade