What’s the Difference Between Conversation UI and Conversation Design?
Demystifying the elements that make up great conversations.
When I started designing conversation applications a few years ago it was hard to find accurate information on topics that were relevant to my work. I’d scour the internet looking for the reasons behind why product designers made certain choices in their UI, but most articles were just about chatbots. And none of them spoke in detail about the experiences a user has when engaging with a conversation UI. I’d emerge from hours of research with more questions than answers.
This frustrating and often disappointing experience led me to want to team up with conversation design experts as well as fellow UX designers. We are excited to collectively bring you Crafting Conversations, a series of articles that break down the components of well-designed conversations, how Conversation Design is connected to UI/UX, how to get started, and overall best practices.
Why does good conversation design matter? Conversation Design Principal at Salesforce, Greg Bennett, argues it’s the future of UX. Furthermore, 60% of consumers want easier access to self-serve solutions for customer service according to a report from Ovum. So, how can we create great conversations? To put it very simply, there are two parts of designing conversations: Conversation User Interface (UI and the User Experiences around using it) and Conversation Design (CxD). These two disciplines often overlap and they must work together to produce a user experience that is positive and effective. For the purposes of this article, we will put these disciplines in separate categories, but please keep in mind that the lines between them are very blurry.
History of Digital Conversations
To start, let’s look at the history of Conversation Design. Conversation experiences appeared in the design world in 1961 when IBM introduced the first digital speech recognition tool. Then in 1966, Eliza was one of the first chatbots that mimicked human conversation. Following the conversation trend, human-to-human digital conversation platforms began springing up in 1973 when programmers at the University of Illinois created the first live chat solution.
Today we have intrepid tools that respond to the command of your voice like Alexa and Siri. Conversation applications can be used to help you shop, receive support from a company, book appointments, catch up with friends, and so much more. From social to enterprise applications, we are starting to shift away from the traditional ways of communicating and are entering an era of conversation-centric interactions.
What is Conversation User Interface (UI)?
Conversation UI is what the user interacts with to participate in a digital conversation. UX designers work on creating conversation UIs in addition to considering and documenting intended functionality and user flows.
In text-based (or even video and sometimes voice) conversations, UI is the visual stylings of the conversation and might include font and background colors, typography, buttons, the way attachments are displayed, timestamps, and so on. In voice, a user might engage with this conversation product entirely through speech. A voice user interface can have its own criteria of interaction that may or may not include a graphical interface like a screen.
UX designers provide specifications for a conversation user interface and then they work with engineers to determine the functionality of interacting with the UI. For instance, if there is a feature to send an attachment to the other participant (human or machine), the user needs to know what to click, what file types are accepted, how to select one, and how to send it. After an attachment is sent, there should be UX considerations such as what the sender or receiver sees and what they are able to do with the attachment (preview it? download it? forward it?).
How conversation UI shows up in the user’s day-to-day:
- Messages — How are text-based messages visually represented to a user? How will a keyboard user navigate through these messages? Also, what level of interactivity do they have? Can a user edit or delete a message after it’s been sent? Are there ethical concerns with allowing certain types of users (such as sales reps or customer support agents) to change what they sent, altering the record of truth?
- Chat bubbles — Have you ever noticed how the color of a chat bubble might change depending on the user? For example, if they are using wifi the bubble might be green, if they are offline the bubble might be grey. Or on a program like Slack, the designers didn’t use bubble at all. Those are design decisions that are part of the overall experience for the user.
- Layout — Design decisions around how messages are aligned (left or right or both), or how far apart the chat bubbles are spaced, or how wide the bubbles themselves are.
- Avatar — The style and location of some or all participants’ user avatar, if one is used at all.
- Timestamps — These are designed to include the date and time. The logic associated with when and where to use timestamps can get pretty complex but we’ll look more closely at this in a future article.
- Voice or auditory indicators — How do I know if Siri is listening? Or that she heard my request? UX designers will decide on auditory signifiers that answer these questions.
- Attachments — If I want to send a photo, link, or document, what steps do I take? What happens if the upload fails, will there be a visual indication in the UI, an auditory one?
- Entry or exit in conversation — When you enter into a conversation, how did you get connected with the other participant(s)? Did you click on an option in the UI to initiate it? Did you open up and continue conversing on a previous conversation thread? If another participant sent an outbound conversation request to you, did they have consent to do so? Did you receive a request to join?
What is Conversation Design?
The most successful and widely adopted conversation experiences adhere to the patterns of human-to-human interactions. This is why conversation designers often rely on linguistics to create conversations that seamlessly engage with the user. The definition of linguistics is, “The scientific study of language and its structure.”
According to Marlinda Galapon, Conversation Design Senior at Salesforce, “Conversation design is more than simply writing dialogs for chatbots and voice assistants. It’s the practice of designing interaction flows and strategizing forms of language to build a natural conversation between a user and a system. Conversation designers take into consideration the voice and tone, every exclamation point and comma, discourse markers [we’ll learn about those later], and more.”
How conversation design shows up in the user’s day-to-day:
- Automated cashier checkouts that guide you through payment. On the cashier screen, each step is presented one by one in a way that’s easy to follow.
- Voice assistants found in smart speakers and modern car dashboards — When these assistants don’t understand something the user said, you may hear “I didn’t quite catch that, did you mean___?” This is what is called Conversation Repair. Machines still have limitations, and it’s important to create these repair paths so that the user doesn’t get stuck with an error message and no way of resolving their issue.
- Customer service chatbots on websites — Depending on the brand’s voice and tone, the bot could say something more formal like, “I see you’re having an issue. Tell me a little more so that I can help.” Or something less formal like, “Yikes! I can help you with that.”
- Recently, there are now chatbots that guide the user through scheduling COVID vaccine appointments.
- When guiding a user through a process, it’s best to lead with a verb. “Select an option” is much easier to grasp than, “Here are the options. Pick 2.” Leading with the verb sets the expectation from the beginning. When you don’t lead with a verb, it takes a while longer for the user to understand what it is they need to do, which in turn can create a stressful experience.
- IVR (interactive voice response) systems that route your conversation to the right customer experience. When you hear “If you want to speak to a presentative, press 1.” For these experiences, it’s best to keep the menu items short, as it’s hard for the user to remember all the options.
Thanks for joining us on this journey through designing great conversations. In future articles in this series, you’ll learn how to get started, explore use cases, and get great advice from our team of designers, linguists, and conversation lovers.
This series is a collaborative effort between a team of conversation subject matter experts. Thank you to Michal Angel, Austin Bedford, Greg Bennett, Rachel Blank, Michael Diffenderfer, Marlinda Galapon, Denise Martinez, Jonathon Newby, Madeline Davis, and Margaret Seelie.
Learn more about Salesforce design at design.salesforce.com
Follow us at @SalesforceUX.
Check out the Salesforce Lightning Design System
