Chatbot Design: 3 Interaction Design Principles For Chatbots

Chatbots are a natural continuation of the revolution that happened when the web shifted from static state to interactivity. They combine the simplicity of AI, beautiful design, and exceptional customer experience.

But there’s a fine line between good and bad chatbots. Interaction design principles govern this divide.

For the end user, “unusable UX” means “I’m leaving”. No matter how beautifully your chatbot is designed visually, if the customers can’t interact with it easily, it becomes redundant. 

Get it right, and it’s a whole different story. 

If you champion just a few interaction design principles within your chatbot UX, even when your aesthetics fall short, your product will still contribute to the bottom line. Do more than that and your chatbot has an excellent chance of succeeding.  

In this article, we’ll delve into a few of the fundamental Interaction Design principles (IxD) that govern exceptional design. Armed with them, we’ll show you how this pertains to creating better chatbots for a more enjoyable and seamless user experience.

By the end, if all goes well, you can be on your way to creating a positive and unforgettable user experience for your end-users.

What Is Interaction Design?

Interactive design, well-executed, plays a vital role in the great user experience (UX) and is indisputably one of the fundamentals to any digital product. 

John Kolko, Author of Thoughts on Interaction Design, describes interaction design is:

“...the creation of a dialogue between a person and a product, system, or service. This dialogue is both physical and emotional in nature and is manifested in the interplay between form, function, and technology as experienced over time.”

In other words, Interaction Design is about creating a meaningful relationship between the customer and the product, to the point where the experience feels natural, easy, and if done right, remembered fondly.  The definition of design, after all, isn’t only about how an interface looks and feels. It’s also about how it works.

Interaction Design vs UX

‍

Because Interaction Design is a subset of UX (User Experience) Design, it’s easy to identify the overlap between the two subjects. But while they overlap, they come with a striking difference in how users think about interactions.

Interaction Design is about accommodating the user at the moment and enabling them to have a rich and memorable experience. Apart from usability, it’s an attempt to make the interaction possible with the least amount of friction,  which touches on the concepts of functionality and readability. 

On the other hand, UX Design principles  are focused more on the whole picture. On top of ensuring a positive experience for users, it also assures business goals and technical details are met.

A typical UX design process begins with research, and proceeds with the testing and validation of the hypothesis.

‍

Superpowers of Interaction Design

The goal of interaction design is to grab attention and develop interactivity — both beneficial in sales and marketing. Some of the benefits of interaction design are:

• Effective communication: Visual representation is a powerful and meaningful communication tool. Used right, you can effectively communicate with the user through an icon, symbol, or graphic that portray more in a few pixels than hundreds of words. Interaction design clearly communicates the action it represents in a succinct and clutter-free way. 
• Influences emotional responses: Great design can affect perceptions of usability. For example, simply the colour you use to denote an action, field or the entire chatbot can either instil a sense of calmness and serenity or spark a sense of urgency.
• Saves resources: Interaction design is based on a set of design principles, conventions, and rules of thumb (heuristics) that have been tried and tested to make sure they achieve the desired goal. This is not to stifle creativity but to create a foundational guideline that saves time and money.

3 Winning IxD Principles for Chatbot Design

Inarguably, chatbots provide a number of benefits for businesses. Arguably, the biggest one is superior and faster customer service.

But keep in mind that these benefits only come when the chatbot is good and effective. If it doesn’t work as it should, it can have the opposite effect and negatively affect your customer satisfaction rates.

Consider integrating these IxD principles into your chatbot design.

1. Consistency

It is common to see consistency as a key UX principle across most major product use cases. This is because consistency allows for the harmonious flow of elements in your chatbot. 

By keeping the input and output formats uniform and in sync throughout conversations, you are able to improve the learnability of the chatbot. 

That is to say, the chatbots that are consistent across all portals can be picked up by users faster as they require a lower cognitive load. If every new page, interaction, or visual led to a different effect, it’d mean the users would have to re-learn how to use the chatbot before moving on. 

By leveraging consistent elements throughout your chatbot’s UI, you can mitigate these risks. This can also raise engagement levels, eliminate confusion, and reduce churn.

Implement internal and external consistency

You shouldn’t just aim to reach consistency within your interface. Strive to make your chatbots consistent across all the interfaces on different devices. After all, your customers may access your bots using desktops, smartphones, tablets, or even smart TVs.

Also, if you have a suite of products and services, apply the same standards to all of them. Apart from that, try to stick to established and known industry conventions. 

As you can see on the screenshot above, Landbot chatbot’s UI contains the same typography, colour scheme and even tone of voice as the rest of the website. It is clearly consistent with our other interfaces, and therefore easily recognisable and familiar to our customers.

Be mindful of how you use visuals 

In addition to using bold, highly visible, and aesthetically pleasing visuals, ensure you keep matters relevant. Users should not face a scenario where they see a button or an image that they don’t understand the purpose of.

The buttons and the layout should match your brand. Go with something unique and prioritise choosing an easily understandable button layout that can be consistently used throughout your chatbot pages, as well as resemble buttons in other digital assets, like your website.

Use a unique button layout

Users should be able to navigate easily while interacting with the bot.

In the above use case, if the user chooses to take the chatbot up on its offer or click “What can you do?”,  it answers the question. Then it elaborates on its answer.

Using buttons and quick replies like this is an easy way to facilitate navigation and flow. This improves your bot’s overall user experience along with reducing the fallback rate. 

2. Constraints / Error Prevention

The design concept of constraints dwells on the fact that human error is often inevitable — and chatbots are supposed to be ready for these unexpected factors. Even if systems are designed perfectly, machines and any sources of artificial intelligence are still susceptible to error because humans are involved.

But while the possibility of mistakes is part of the deal, there are ways to mitigate and reduce them.

Enable users to re-engage with the bot when needed 

People can easily be interrupted while interacting with the chatbot. Maybe they have a problematic internet connection, an uninvited guest swooped in, or their dog came into the picture. Consequently, they end up pushing a button or typing something random.

In this case, the chatbot must resolve the problem. The idea is to eliminate error-prone conditions and present users with an easy way out before committing to any negative action, such as leaving the page. 

You can also provide the option to re-engage with the chatbot if needed.

This is important because it grants control to the users. It reminds them that they are in charge — and the chatbot is only around to help them reach their goals.

Error Prevention with clear warnings

The best way to reduce the number of errors a user makes is to anticipate possible mistakes and prevent them from happening in the first place by putting in a set of constraints.

While it’s essential for the user to feel comfortable and in control, certain expertly placed constraints allow users to trust the system and believe that the chatbot will prevent them from making errors.

‍

‍

In the image above, a chatbot rectifies the issue that concerns an email address featuring the word “gmaik”. It used its algorithms to identify that “gmaik” is a typographical error, and chances are, the user could have meant to type “gmail”.

What’s also great about this example is the chatbot’s straightforward and polite response, which helps the user to recover from it quickly without any unnecessary friction. 

Here are a few error prevention techniques:

• Disable irrelevant functions - programming your chatbot to be capable of handling multiple functions isn’t bad. But if these functions don’t add quality to the user experience, it’s best to disregard them.
• Use buttons that ease navigation and improve UX - use context-based and simple buttons that unmistakably suggest what happens when a user clicks them. Also, limit the options for user responses to avoid confusion.
• Provide clear instructions and preemptive help - offer guidance and walk users through processes. And if they have any questions or feedback, ensure your chatbot can dish out high-quality answers and collect open-ended information.
• Provide clear warning messages - just like the image above reflects, bring the user's attention to an error they made. But try to do this only as a last resort to avoid annoying them unnecessarily.

3. Learnability

How easily can a new user navigate your chatbot? 

Do they come away frustrated and confused?

People struggle to learn new ways of doing things unless they provide significant benefits. And yet, people are often met with untested and confusing chatbots, giving them a seemingly bad reputation.

Leveraging the fundamental interaction design principle of learnability induces people to learn your graphical user interface (GUI) with relative ease within the first attempt and avoid difficulties with further interactions.

“The best interaction designs don’t try to reinvent the wheel, but make efficient and effective use of patterns in a new way.” - Toptal

Users don’t want to tap a chatbot to ask for help from another human being. It will only make them feel insulted or mentally challenged. 

In many cases, with the help of machine learning and natural language processing, this shouldn’t be a problem.  Thanks to intelligent and innovative tools, chatbots can be designed to to pick up information from previous conversations quickly. 

If not, conversations will result in circularity without any meaning. Ultimately, they’ll end up frustrating users.

Below are images that depict how users fail to communicate with chatbots.

‍

Remember, humans have hard-wired behaviours, and most of them operate interfaces based on instincts. 

When they encounter a button, their instinct will tell them to click it. If they click a button, their instinct will tell them their needs will be met. If their needs aren’t met after they click a button, their instinct will conclude that they are victims of bad design.

If the users insist bad design is the problem, that’s where the designer enters the picture and applies a winning IxD principle. Instead of explaining to them that the problem isn’t in the design, why not show them?

Here are a few tips on how to include learnability in your chatbot design:

• Incorporate fun elements - Use playful templates and captivating visual elements. Engaging interfaces allow users to easily learn and remember interactions.
• Include familiar elements - Common patterns and components make users feel more comfortable. And the more comfortable they are with an interface, the more engaged and responsive they would be.
• Add options for predictive elements - Some users prefer conversing with chatbots with a set of predetermined responses. Meanwhile, others prefer to type in responses freely. Take note of this and design your chatbot according to your audience’s preferences.
• Share progress - After the action is performed, show users the progress that has been made toward the goal. You may design progress bars or inform users of what will happen next.

If you follow the three fundamental interaction design principles above, we have no doubt that your chatbots will not only positively influence the bottomline of your business, but will also delight your customers and turn them into brand promoters.