By Nick Babich in AI — Oct 5, 2021

A comprehensive guide on how to craft good AI design

With the release of Apple iOS 15 and the upcoming Google Pixel 6 device with Google’s Tensor chip, we will soon see a tight competition between two giants in the field of artificial intelligence. Artificial intelligence is the next big thing because

The more an interface leverages human conversation, the less users have to learn how to use it.

This guideline will help you design a better AI assistant experience.

Visual design

What aspects to consider when working on UI design of AI assistant.

Object, shape, colors

How should AI assistants look like? What is the first thing that comes to mind when you think about AI assistants? From a design point of view, AI is an abstract thing, so it might be hard to give a visual presence. Sci-fi movies tend to visualize AI as 3D spheres or waves.

If you search on Dribbble or Behance, you will find dozens of 3D spheres or waves. One of the best artworks of AI assistant belong to Gleb Kuznetsov:

Voice recognition design by Gleb Kuznetsov✈

Simple home voice assistant by Gleb Kuznetsov✈

AI voice assistant visual research by Gleb Kuznetsov✈

Always show user query

Users should never ask questions like “Did the system understand what I said?” when they interact with AI assistants. They should be able to see that the system understands their request correctly.

Voice AI visual design by Gleb Kuznetsov✈

It’s also worth telling the user what’s happening, especially when an operation will take some time to proceed.

AI helper — 3D visualization by Outcrowd

Think about interaction in dynamic

While designing, consider how the natural dialogue can drive the visual interface you present to the user. Remember that the user might want to go back to modify some data they’ve provided. UI should be designed to allow that.

Create unique motion language

In user interface design, motion language plays a tremendous role in how the user feels about interaction with a product. And that is specifically true when it comes to AI assistant design.

Design should be strangely familiar.

The animated transition should be easy-to-follow and predictable.
Motion language can also showcase your unique visual brand attributes.

Functional behavior

No doubt that the visual aspect of AI assistants is essential, but even more critical is what AI assistant can do for users.

You need to adapt to technical limitations and leverage technical strengths to create a next-gen AI assistant.

Designing the conversation

Interaction with AI assistants should not feel awkward or break patterns that have evolved over the years in human-to-human conversation. You need to capture all possible user intentions (what the user will be trying to do with the help of AI) and frame them into the model of your AI assistant.

Always start with what humans want to do. Ask the question, “What would the user say or do in a particular situation?”

Create scripts for the dialog between the user and the assistant:

Imagine user interaction. Focus on utility. Find moments in user daily routine that can be improved with AI assistant. The goal is to make it easier and more fun for users to do what they want to do. Dialog sketch will help you understand how people interact with the AI assistant. Create dialog for a happy path (when everything goes as planned).
Write it down. You need to consider that different people might follow different paths when they interact with the AI assistant. Outline alternate paths and decision trees. For example, they can use different words when they ask AI assistant to do something (i.e. “Assistant, turn the light on” vs. “Assistant, fire up the lights”). Use the dialog sketch you’ve created in the previous step and cover all branches that users can go when interacting with AI assistants. At the end of this step, you will have an experience flow that will visualize all possible pathways.
Practice it. Focus both on the interactions where everything works well, and the user gets what they want and when the situation goes not as planned. By practicing interaction with AI assistant, you will identify situations you may not have already accounted for.
Refine it. Don’t assume that the user knows what to do or what will happen when they interact with the AI assistant. Try to identify and remove obstacles that users face when they interact with assistant, even when they don’t realize that.

Here are a few specific recommendations on how to simplify user interaction with AI assistant:

Use storyboarding to describe how people will interact with AI assistant. Thinking about the interaction between user and AI assistant like in a movie or play is a great way to determine how the conversation will flow. It will help you to identify important details and variations for the interactions.
Try to limit the number of options you provide. For example, when a user is asking a question like “Where should I go for vacation?” AI assistant should ideally offer one best option. If AI assistant isn’t able to do that, it should offer the top 3 the most relevant option to the user.
Take cognitive load into consideration. When you need to ask users for additional information, ask for one piece at a time. It will help you not to overwhelm the user.
When the user provides partial information, offer the user possible options so that they can choose the one. When AI assistant isn’t sure what exactly the user wants, it can ask directly, “Do you mean [X]?”
Offer contextual help. When a user is in the middle of conversion with AI assistant, the system can guide the user in the right direction. For example, the system can tell “You can do [this]” to help users understand how to interact with this particular feature.

Design both single and multi-turn conversations

The word “AI” implies that assistant should be capable of doing many different things. Ideally, users should think about AI assistant as a real human being that can understand their intention and is able to do what they tell them to do.

AI should support both single and multi-turn conversations. A multi-turn conversation is a conversation with multiple turns in which AI assistant asks questions and the user responds with the answers).

Example of single turn conversation: “Assistant, what time is it?”
Example of multi-turn dialog: “Assistant, I want to go out. Show me relevant what’s happening in San Francisco today.” This voice command starts a natural conversation that can flow in various directions.

The system should be able to understand the context of the conversation, and this allows more natural behavior and multi-turn conversations.

AI assistant should be personal

AI should utilize all information it has about a user and turn it into value for the user. For example, AI assistant should learn users’ food and music preferences and surprise the user with relevant options whenever they choose to listen to music or order food delivery.

The system should remember what happened recently and what was said or done, especially for frequent actions (such as turning off/on lights).

AI assistant should also be proactive with the information it provides to the user.

Dark real time notification by Gleb Kuznetsov✈

Never use AI for the sake of AI

Similar to any other technology, AI should serve a clear functional purpose. Do not introduce AI in your product to make it look cool because it likely makes it look quite the opposite. Clearly define core experience for AI assistant and ensure that it provides value to your target audience.

Always look at how people use your product.

You should introduce AI when it’s much easier to complete the task with the help of AI. One good example is finding a particular photo in the large photostream. It’s much easier to say, “Assistant, find a photo of me on Times Square.” rather than search for this photo manually.

Interaction mediums

There are two major interaction mediums for AI assistants:

Voice-first interface

It’s expected that AI assistant is the voice-first interface. The true power of AI is that it allows users to avoid direct manipulation with UI and solve the tasks much faster.

If you want to learn specific tips on how to design for voice, I encourage you to check Google and Amazon design guidelines.

Camera (photo/video stream)

Camera is another medium that can be valuable to users. Apple, Google, and other vendors already utilize the power of AI to improve the quality of pictures captured with device cameras.

The next-gen of mobile devices will use AI for real-time processing of imagery stream, making the camera the next data input medium.

The user will point on an object, freeze for a moment and the system will understand that the user is interested in that object.

Google Lens allows you to search what you see. It gives you context about the object. Image by Google.

Its possible to mix AI with AR to create a new medium.

Google Lens shows interactive pins on top of real objects. Image by Google.

Impression from interaction with AI

Should AI Assistant have characteristics of real human being?

Think about how you want the person using your AI assistant to feel about it. Many designers ask the question, “Should AI feel like a human? Should it have a unique voice and personality?” Ideally, yes, but we still far away from AI depicted in movies Her or Ex Machina.

At the current level of AI, we cannot guarantee that assistants we design will be as smart as real humans. And if you give AI assistant characteristics of a real human being, you can easily create overpromising. When users notice that AI is not as smart as they think, the magic of AI will go.

AI assistant should feel unobtrusive

AI assistant shouldn’t annoy or force users to do what they don’t want to do.

Clippy from MS Office is a clear example of an annoying personal assistant.

AI shouldn’t introduce more complexity

In many products available on the market today, AI is introduced on top of existing technologies. Let’s take Apple Siri as an example. Apple motivates people to use Siri with voice, but the significant part of interaction still requires touch. If you want to design a truly enjoyable interaction, you need to

Make it easier to get things done using AI assistant alone

When you design AI assistant and select voice as a primary medium for interaction, you need to ensure that the user should be able to complete their task through voice alone.

Users should be willing to interact with AI

Even when you introduce AI in your product, many users will skip it because they will think that its’ not essential for them. Its your goal as a designer to motivate them to try using AI.

You need to determine not only the capabilities of your AI assistant but also the benefits of using it

Here are a few questions that can help you with that:

Why will people want to use this assistant? (understand motivation)
How do people know about skills that AI assistant have? (discoverability)
What will the person be doing before, during, and after interacting with the Assistant? (understand the context of interaction)
What will people get from the AI assistant that they cannot get another way? (understand unique advantages)

Conclusion

In 1981, Steve Jobs famously compared computers to “bicycles for the mind.” Forty years later, this metaphor becomes even more evident.

We’re at the dawn of the next big tech revolution that will change our perception of technology.

Soon AI assistant and your phone will be the same thing.

In this new reality, the computer won’t longer be a machine that we use to solve our tasks, but rather an agent that understands our intention and is ready to assist us with our tasks.

When you design AI assistant, I encourage you to look for opportunities, not limitations. Create something you will be proud of.