Mobile, Web App & Bots development
arrow
Cloud and DevOps Solutions
arrow
Emerging Technologies Enablement
arrow
Chatbot Developer

Chatbot Design Elements

Top Chatbot Design Elements to Consider When Building Coversational Bots
Trusted by Leaders:

What can we build

Our team development capabilities ensure quick deployment of your voice or chatbot – days to weeks and not months - and provide consistent and reliable support for your bot once it is launched.
Amazon Alexa Experts
AmazonAlexa Skills
With over 100 million devices in the market across 80 countries, the ubiquity of Alexa is certain. Build your Amazon Alexa skill.
Google Assistant experts
GoogleAssistant App
Google Home is a powerful choice for brands looking to expand their voice application reach.

Our Chatbot Development Expertise

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:

  1. Completely scripted, rules based bots that today can be built by kids using Google Sheets or professionally using the hundreds of bot development kits in the marketplace. Honestly, we have stopped trying to catalog these. We published a brief story on several of them back in 2017 which you can find on our blog.
  2. 100% machine learning, AI-based bot that takes advantage of NLP offered by services like Amazon Lex, Google, Facebook and the several outstanding and easier to use open source solutions. We strongly prefer going down this path with most bots of any real complexity.
Azumo Chatbot authoring tool
Azumo Chatbot Authoring Solution for Chatbots and Alexa Skills

We built our own solution as well which we called ACE (Azumo Chatbot Engine). The solution enabled us to build more robust chatbots more quickly. We've used it to build chatbots for Discovery Channel, Wine Enthusiasts and Coppola Winery and many others. Most of those chatbots were designed for Alexa and Google Assistant. We used ACE to also build for Facebook Messenger and other apps as well as the web.

Design Choices for a Scripted Chatbot

In fairness we do not like building scripted chatbots. They break easily and bore the user. Unfortunately they are easy to build and many developers pushed these fragile snowflakes onto customers.

To make them work well however, a good 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 scripted 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 to 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

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.

Elite Developers to Match Your Technology Needs

Web App Development

We design and build fast, simple and elegant user interfaces able to run in multiple browsers, mobile phones and tablets, with React, Angular, Python, Node, Golang and Ruby.

Mobile App Development

We build with cross platform tools like React Native and Flutter to cover both iOS and Android. These can get the most out of your budget. If you prefer native development instead we have those skills too.

Cloud Development

Everyone is leveraging the cloud for some part of their business today. But are you designing your applications to take advantage of AWS, Kubernetes, and Docker. We can help you build and manage for the cloud.

Chatbots

The Future is Conversation. Voice apps and Chatbots enable new customer experiences and will power how customers discover and interact with your business.

Emerging Platforms

We've built solutions across emerging technologies. Let Azumo design, build and manage your Blockchain, IoT, and Robotic Process Automation solutions.

Legacy Platforms

With our seasoned software engineers, we’ve been able to tackle some difficult challenges over the years, including migrating, modernizing and securing legacy systems that are decades out of date.

We’re in this together, let’s do it!

Hire talented, diverse and seasoned engineers that will integrate, communicate & perform at their best. Learn why over 75% of our business comes from referrals and repeat customers.
Get in touch with us
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form. Please try again! Or call us at 415-610-7002