Top 6 Chatbot Design Elements to Consider
We’ve been building chatbots for sometime and know just how difficult an enterprise bot can be to design, build, deploy and maintain. We put this post together to help non-technical readers understand some of the visual features that help create a great chatbot experience.
After you have figured out a use case for the bot and which messaging platform to use, next you should consider the experience you want for users. When we talk to customers about building bots we tell them up-front that a bot can be made with three approaches in mind:
- Completely scripted, rules based bot
- 100% machine learning, AI-based bot
- Some hybrid of experience 1 and 2
For a scripted experience that uses some natural language processing capability.
Design Choices for a Scripted Chatbot
A scripted bot experience is one where the designer and development team have spent not only a lot of time thinking through the voice of the bot but also the type of questions they anticipate the user will have. In many cases, a rules based bot will run like a decision tree where each action by the user prompts the bot to take action or respond.
Depending on the use case this could be perhaps 10-20 lines of scripted text to hundreds of lines of scripting. In one scripted experience, we wrote over 500 lines of script to handle just a small set of use cases where NLP would not be a good substitute. Many bot developers creating scripting experiences for entertainment purposes will see their scripts grow to thousands of lines.
Many bots use graphical elements like cards, buttons or quick replies as part of the design flow. When thinking about using these elements, you must know that messaging platform you decide deploy your bot on plays a key role in terms of design choices.
Cards and buttons require graphical images which some messaging platforms do not or cannot support. For example if you wanted to build a bot for SMS/texting, you won’t have access to cards or buttons. But if you were building for Facebook Messenger or a web interface you would be able to take advantage of these options and more.
Chatbot Design Elements:
Here’s a quick snapshot of elements you can use for your bot:
- Buttons – Buttons trigger actions to occur when a user touches or clicks them. This is similar to any mobile app experience. By adding an interactive button you can simplify complex workflows and help the user make decisions faster.
- Get Started Button – For many people first experiencing a bot on messenger, this is the first thing they will see and is quite intuitive. Pushing this button revs up the bot to get going and represents a clear call-to-action for the user. This is really a must have button for Facebook Messenger Bots.
- Cards – Card layouts put information — images, text, buttons, links, etc. — into a series of blocked containers. These blocks can be layered or moved and tend to adjust to the size of the screen, stacking and falling into columns if you turn your phone on its side. When placed in a series that can create a carousel another presentation feature. A user can cycle through the cards and select the individual one that is right for them. We suggest 2-3 cards per carousel to maintain simplicity.
- Quick Reply – Quick replies provide a way to present response buttons for the user. Quick Replies appear prominently above the composer, with the keyboard less prominent. When a quick reply is tapped, the user’s response message is sent back to the bot. On most platforms, the buttons are dismissed preventing the issue where a user could tap on buttons attached to old messages in a conversation thread.
- Smart Reply – Similar to those familiar with Google Inbox, smart reply gives the users a fast and easy way to respond to the bots questions without having to type. Smart reply saves time and pushes the user more efficiently through a workflow. This can be particularly useful when the bot is context aware or has some level of information at the ready about the user.
- Persistent Menu – The persistent menu exist to allow the user to quick navigate to another part of the bot that may not be readily available to them. In short its a way to transition into another part of the bot without having to ask the bot. It can also be used as a place for the user to personalize the bot or learn more about the bots capabilities.
These are just a selection of popular elements that can be embedded into a bot experience. And while you can employ many or all of these on some platforms, it’s best to try to pick the option that is right for the moment. If not, you could run into a very cluttered and confusing experience for the user. After-all the bots’ purpose is to make the user’s life simpler.