Bot Prototyping: Right Now, None Of The Tools Are Great

I went through all six prototyping tools on Bot Stash's list and was underwhelmed.

Across the board they suffer from poor UI, serious bugs, or a lack of important features.

If you want the most functional option, you'll need to pay. Botsociety is reliable and has the most features, but you're limited to a single export per month unless you upgrade to their $49/month premium plan.

After reviewing most of the bot prototyping tools available, here are my final recommendations:

Use Botsociety if you need the ability to model alternate paths through a conversation and don't mind paying. Supported platforms: Facebook Messenger, Slack, Google Home.

Use Walkie if you're building a Slack bot and don't need paths or gif export.

Use Botpreview if you're building a Facebook Messenger bot and don't need paths.

All of the above have decent user interfaces and are pretty reliable. Read on for a deeper look at each one.

Background

I recently wrote about the conversational UI best practices that we uncovered while redesigning our chatbot, Neona. Originally, I had planned to write a follow-up post showing concretely how we applied those best practices to improve Neona's conversations. To make it easy to follow along in that post, I planned to use one of the fancy bot prototyping tools I had run across. Unfortunately, they either didn't meet my requirements or were too buggy to be usable. So instead of walking readers through our redesign process, I figured I'd survey the landscape of bot prototyping tools.

(When I first redesigned Neona, I used flowcharts made with draw.io to map out the conversation flow. It wasn't great, but it was functional.)

Requirements

My main goal was to communicate and explain design decisions, which motivated my requirements.

First, I need to be able to easily share animated mockups of the conversation. I prefer animation over static images because it more clearly communicates the feel of interacting with the bot.

Furthermore, I want to organize conversations as a tree, not a line. This allows you to handle different user responses more naturally. Bonus points if the app lets you share sub-trees of the conversation.

Finally, the prototyping tool should output visuals that mirror one of the platforms Neona runs on. At the moment, that means Skype or Facebook Messenger, but we're working on Slack integration. You can also talk to Neona directly in the browser, but I prefer designing interfaces within the more visually constrained environment of a messaging app.

Botmock

Botmock is one of the better tools I tested. It was the only one that let you organize your conversation as a tree, and like I mentioned in my requirements, it gets a bonus for the ability to export sub-trees. It feels like a tool you could use from beginning to end for designing a conversational interface.

It also supports a few different visual styles, including Facebook Messenger.

You create a tree by dragging connections between nodes, similar to mind-mapping or patcher programming languages like Max and Pure Data.

Botmock's editor page

Unfortunately, it's pretty buggy. Export to gif (admittedly in beta) displays a strange zooming behavior:

Botmock's gif export

Nodes also occasionally disappear from the editor page. When this happens, previously deleted nodes re-appear, covering up "Get Started." The vanished nodes still take up space in your conversation tree, but they can't be selected or deleted.

This was the deal breaker for me. I wasn't willing to design our UI in a program that could break at any moment.

Botsociety

Botsociety is probably the best tool I found. It takes second place after Botmock in terms of features, but is more reliable. There's only limited support for conversation trees, but it does have Facebook Messenger-style visuals, and you can export to gif and video.

More on conversation trees: Botsociety implements this as a feature called "paths," that allows you to specify alternative responses. The major shortcoming is that you can't reuse portions of your conversation -- you have to duplicate them.

Botsociety's editor

A major limitation to be aware of upfront -- the free plan only allows a single export per month. To get more, you need to invite friends (you each get a free extra export) or upgrade to their $49/month premium plan.

Botsociety's gif export

A few UI critiques:

  • The editor UI feels really busy.
  • In the gif export, I'm not a huge fan of how the keyboard pops up and then hides again after every message from the user.

Despite those limitations, Botsociety probably has the best combination of features and stability. If my requirements were different, I would've gone with it.

Botpreview

Botpreview has a pretty clean user interface, supports unlimited gif and video export, and allows you to preview your bot's interactions in a Facebook Messenger-style interface. Unfortunately, it doesn't offer conversation trees, or even something like Botsociety's paths.

Botpreview's editor

If you don't need the ability to map different routes through a conversation, Botpreview is a decent choice.

Botframe

Botframe is a minimal prototyping tool that has a limited scope and a clear UI. It's also pretty reliable. Unfortunately, it's missing key features. Its visualization of the conversation is static, like you're looking back at one that already happened. It only supports still image export and doesn't allow you to model multiple paths through a conversation.

Botframe's editor page

Walkie

Walkie is a prototyping tool for Slack bots. Since chatbots have an advantage in the simplicity of their render target (plain text), I'm curious to see how their platform-specific strategy pans out. Despite their solid design, they meet none of my requirements. Naturally, they only render your conversation in an approximation of Slack's UI. Conversations are modeled as the linear history of a Slack channel, so no tree-based conversations. Curiously, they only export to JSON.

Walkie's editor

Mockabot

This app didn't meet any of my requirements. It only supports linear conversation editing, doesn't have an export feature, and the mockup's UI is half-hearted material design. If Botmock and Botsociety are the closest to getting it right, Mockabot is probably the farthest.

Mockabot's editor

Final Thoughts

For many domains, one or a few apps stand head and shoulders above the rest. Bot prototyping isn't one of them. Botsociety holds the lead currently, but Botmock could jump ahead with the next bugfix release.

The hardest part of building a bot is that writing is almost too complicated for human beings to do. While comparing these tools, I was surprised that none of them even began to tackle that problem.

In the past, I've pitched the idea of building a tool like Textio for bots to my brilliant and hardworking teammates. Having done this deep dive, I feel like that's an even more viable option.

P.S. - Bot Stash includes various Sketch UI Kits in their list of prototyping tools. Since I don't know Sketch and my visual design skills are limited, I didn't consider them in my evaluation.

Bot Prototyping: Right Now, None Of The Tools Are Great
Share this