We stand with Ukraine and our team members from Ukraine.

The Community Of Over 578,000

Home ›› Conversational Design ›› Considerations for your chatbot design

Considerations for your chatbot design

by Michelle Lee
Share this post on
Tweet
Share
Post
Share
Email
Print

Save

Whether you’re exploring custom chatbots, browsing third parties, or looking to improve your own chatbot design, it’s good to know what kinds of UX requirements you need beforehand.
Exploring chat options can be daunting but here are some UX considerations for when refreshing or building your chatbot design.

How to nail your chatbot design

Be conscious of the size and placement of chat sticky elements

We don’t typically recommend using sticky chat elements, but if this is a must for your company, these elements should take up a minimal amount of space and appear unintrusive. 

The chatbot design should also be adjusted for mobile as the smaller screen can lead to sticky chat elements covering key page information or actions. Nothing is more frustrating for a user than being unable to interact with the page because the sticky chat element is blocking their view and they don’t know how to access the page behind it. Check your pages on different devices to see what your sticky chat element may be covering. 

Credible's chat element on their desktop homepage

The sticky chat element on desktop remains minimal and unobtrusive in the bottom right corner.

Credible's sticky chat element on their mobile homepage

On mobile, the sticky chat element is adjusted to show only the icon rather than the icon and copy. This small size helps to decrease the likelihood of it covering key page information.

Keep the chat feature accessible without relying on a sticky chat element

Regardless of whether you use sticky chat elements or not, keeping static links to the chat on relevant pages – as well as in the footer and navigation – makes it easy for users to find and use this feature themselves. 

Intersperse static links at the end of FAQ or policy content in case the user needs more information.. Place live chat links in the footer on desktop and in hamburger menus on mobile sites too, as this is where most users will look for it if a sticky option is unavailable.

Showing the static link to live chat and other forms of support on Madewell's desktop footer

Various forms of support including a static link to live chat can be found at the top of the footer.

Abercrombie & Fitch's customer support page with static link to chat


Users can navigate to the main customer support page from the hamburger menu where they can find static links to various forms of support, including chat, which is featured more prominently than other types of support.

Avoid non-user initiation of chat dialogs

Users typically express the most frustration when unwanted pop-ups, overlays, or dialogs appear uninitiated, leading to disruption of the experience. The same goes for chat dialogs and prompts. So a key thing to keep in mind for your chatbot design is allowing users to initiate the chat themselves when they are ready for help. 

If prompting the chat is a must for your team, then avoid initiating chat dialogs in the middle of the screen, and allow the user to interact with the page behind the overlay. Keep the dismissal button of the chat dialog easy to see and tap, keeping the tappable/clickable area reasonably visible.

Bloomingdale's sticky chat element on their desktop homepage

On desktop, a very minimal chat prompt is visible next to the main sticky chat button. However, it disappears as the user scrolls down the page to avoid disrupting the experience.

Bloomingdale's sticky chat element on mobile

The sticky chat element remains uninitiated unless interacted with by the user on mobile to avoid covering key page content.

Encourage users to search for information with an FAQ or navigational assistant prior to using live support

Encourage users to engage with an assistant to help with common issues without having to wait for a live representative. Only when users indicate they need more help, should you connect them directly to a live representative. 

This helps reduce the number of call center requests, as well as providing immediate relief to users with simple-to-fix issues. And remember, make it clear to the user when they are interacting with an assistant versus live support. 

Crate & Barrel's initiated chat dialog on the desktop homepage

The user is first prompted and encouraged to choose an appropriate topic or search for an issue. However, should the user not be satisfied with these topics or the search results, they can click on the chat button at the bottom of the dialog to start a conversation with a live representative.

Crate & Barrel's suggested topics and search in the mobile chat dialog

The same is seen on mobile; the chat dialog takes up the full screen so that it is easy to interact with.

Be clear about how the user should engage with the chatbot, and adjust messaging for offline hours

When initiated, provide immediate instructions on how to use the chat. Another great way to improve your chatbot design is by providing the user with pre-determined suggestions, topics, or common issues to narrow down the problem and speed up the support process. 

During offline hours, allow the user to ‘leave a message,’ instead. Prompt them to leave their name, email, and describe the issue so they feel satisfied their issue will be dealt with once support comes back online.

Honeybook's offline chat dialog
Honeybooks chat dialog offline messaging

When the chat is operating during offline hours, the user is encouraged to watch a helpful video on the product or leave any questions and their email address so the team can get back to the user the next business day.

Assisted and live chat can be complicated as there will always be a varied range of issues the users can bring up. However consistent and well-guided interactions help to create a smooth experience for users who are already frustrated.

Remove customer friction with Contentsquare 

Find out why your customers behave the way they do with our industry-leading customer experience analytics platform. Use our Session Replay feature to understand why customers may not be interacting with your chatbot design, or discover your most profitable digital paths with in-depth Sunburst visualizations, covering data from 100% of your customer journeys.

Fragmented approaches
post authorMichelle Lee

Michelle Lee, Michelle is a UX/UI Designer who loves finding design solutions that marry both business and user needs. When she’s not designing, you can find her pursuing yet another new hobby, visiting a museum, or laughing a little too loudly somewhere in the distance.

Tweet
Share
Post
Share
Email
Print
Ideas In Brief

Chatbot design has specific UX considerations to create exceptional conversations. In this article, the author recommends making sure to:

  • Be conscious of the size and placement of sticky chat elements
  • Keep the chat feature accessible without relying on a sticky chat element
  • Avoid non-user initiation of chat dialogs
  • Encourage users to search for information with an FAQ or navigational assistant prior to using live support
  • Be clear about how the user should engage with the chatbot, and adjust messaging for offline hours
  • Particular attention has to be paid to sticky chat elements, feature accessibility, pop-ups, navigation and offline assistance.

Read the full article for a breakdown of how to pay attention to these details while getting started with conversational design.

Related Articles

The overview of current challenges and opportunities design faces and how BBC team can help designers out to enhance digital experience and understanding of the world.

The Evolution of Experience Design
  • Dan Ramadan, Creative Director for UX Architecture & Content Design at BBC, tells about the current challenges and opportunities design faces by describing 3 stages of ‘the web’:
    • Challenges of the past (document retrieval)
    • Challenges of the present (control and contribution)
    • Challenges of the future (pervasive and ubiquitous)
  • Technology is as capable of solving problems as it is of creating them.
  • The team at BBC can explore how digital experience can enhance our understanding of the world, develop empathy for others, instill pride and commitment to the importance of the individual and the inherent value of shared values and cooperative society.
Share:The Evolution of Experience Design
5 min read
Evolution-of-design-article-image.png

As organizations grow in their conversational maturity, there’s an increasing demand for conversation designers. Explore 7 skills to learn for conversation designers in 2022.

 

7 new skills to learn for conversation designers in 2022
  • Conversational design requires far more than having got all your convo design courses nailed, completed all the challenges on VUI-challenge and finished re-reading Pearl, Evanhoe & Deibel and Cohen, Giangola & Balogh for the umptieth time.
  • There is a number of new skills that can up your career as a conversation designer:
    • NLU
    • Entities
    • Entities on steroids: ontologies and graphs
    • Building conversational teams
    • Open source movement
    • Mastering conversational AI platforms
  • It’s time for conversation designers to develop t-shaped profile: specialize in one or two particular conversation design skills and systems , and mastering skills that allow us to connect with people from neighbouring disciplines.
Share:7 new skills to learn for conversation designers in 2022
7 min read
7 new skills to learn for conversation designers in 2022

There are different ways participatory design can influence young people with cognitive disability. Read reflections on co-design methodology and ways it can help.

Reflections: Co-Designing with Young People with Cognitive Disability
  • In this article, Jax Wechsler, Principal Designer at Sticky Design Studio, shares:
    • Facts about Young People with a cognitive disability that may be useful when working with this group
    • Discussion and reflections about her methodological choices
  • Things to know about Young People with cognitive disabilities:
    • Ability levels can be very nuanced, every Young Person is different
    • Life Tasting not Life Wasting!
    • The level of advocacy of parents impacts experiences and opportunities for Young People with Cognitive Disabilities
    • Social inclusion and relationships are keys to wellbeing
  • Reflections on Co-Design Methodology:
    • Recruitment is hard!
    • Using referrals and ‘snowball sampling’
    • It’s important to build rapport
    • Understanding ability and research design
    • Cultural probes/diary studies are gold
    • Parents mediating participation
    • Flexibility is key
    • Value in participation
Share:Reflections: Co-Designing with Young People with Cognitive Disability
10 min read
Reflections : Co-Designing with Young People with Cognitive Disability

This website uses cookies to ensure you get the best experience on our website. Check our privacy policy and