How does AI affect UI?

Shreyas Prakash headshot

Shreyas Prakash

Intended Audience — For conversational UI designers in healthcare industry curious about various UI affordances/design patterns in vogue right now

Our online conversations have been increasingly life-like, but yet life-less at the same time. The UI of apps have become more conversational and chat-like in nature. Not just apps, even websites have their own chat-like interfaces on the side. And all of them face the peril of being infested by bot-like avatars.

As Maggie Appleton points this out, we have more keyword-stuffing “content creators”, and more algorithmically manipulated junk.

It's like a dark forest that seems eerily devoid of human life – all the living creatures are hidden beneath the ground or up in trees. If they reveal themselves, they risk being attacked by automated predators.

Humans who want to engage in informal, unoptimised, personal interactions have to hide in closed spaces like invite-only Slack channels, Discord groups, email newsletters, small-scale blogs, and digital gardens. Or make themselves illegible and algorithmically incoherent in public venues.

Bots are not necessary bad or evil, per se. It’s just that the conversations enacted by them often feel soulless. Now, there have been instances where chatbot conversations have been more and more life-like.

Character-AI, an AI virtual chatbot service has had several reports of users getting addicted to the virtual bots, even choosing to engage with them over their partners

In this environment, it’s interesting to see the design patterns adopted by the industry as we continue to use AI for conversations. Here are some design patterns that have caught my attention:

Offering preset texts

Screenshots from Wysa

The app offers pre-populated short answer suggestions, and suggested options for larger, more informational outputs with minimum user input required. Offering such pre-set text helps direct conversations and limit chances of breaking the conversational flow.

Overcoming gender-bias in voice agents

There is a disproportionate use of feminine names and voices when it comes to voice assistants.

Over the last decade or so, the creators of popular AI voice assistants like Siri, Alexa and Google Assistant have come under fire for their disproportionate use of feminine names and voices, and the harmful gender stereotypes this decision perpetuates. Smart devices with feminine voices have been shown to reinforce commonly held gender biases that women are subservient and tolerant of poor treatment, and can be fertile ground for unchecked verbal abuse and sexual harassment.

Recently came across the Genderless voice initiative, that aims to reduce this gender disparity.

Q is a genderless voice assistant which is able to generate voice which is gender neutral. It would not only reflect diversity of our world, but also reduce the gender bias.

Q, Genderless Voice Assistant

Pre-answer, Post-answer

While chatbots continue to answer questions, it’s important to think about the entire journey of a question. What happens before a question is answered? What happens after a question is answered?

In the above example, Perplexity AI continues to provide cues for digging deeper into the rabbit hole, by providing suggested questions which the user can ask after having answered the question. This helps create a flywheel effect for the user curious about exploring a topic.

Handoff human

When AI related conversational threads don’t go in the expected direction, and if it crosses a certain threshold of steering, the AI directs the conversation to a human expert to take it forward.

Screenshot from KLM app

In this case, the airline chatbot (KLM) allows the user to switch to direct human interaction when it is unable to complete the task as requested.

Obviously prioritising a hand-off to human agents reduces the efficiencies that automation brings to business processes. But there will always be categories of complex issues that fall outside of an AI’s capabilities, which human agents are better able to solve. Beyond complexity, where a relationship requires empathy, passion, emotion, or another form of authentic human connection, simulating this via AI is still a greater challenge than simply employing human agents to make that connection with the user.

Reducing the thickness of the ‘technical wall’

In healthcare chatbots, most of the answers are quite dense. They might sound as if they’ve been extracted from the first paragraph of a relevant wikipedia article.

Conversational AI agents are trying their best to speak as a friend, and not use dense prose.

The first generation of conversational AI agents were trained in la langue, and not la parole. We see more instances of these agents using the colloquial common tongue, and making themselves sound more human.

A friend helps you by telling you what they understand by it. This is the language used by AI for helping humans understand and comprehend better

Sidetracks and maintracks

Chatbots usually have an objective. Whenever users slightly get off-track or derailed, it’s important to get them back into the core ‘job-to-be-done’. Why did they come here for? What purpose does this chatbot solve? In the above example, you can see how the agent brings them back to the key function when the user asks multiple topics on different threads.

Avoiding dead ends

It’s important to also design keeping continuity in mind. When we ask the chatbot a question which it doesn’t have an answer to, and it replies with an ‘I don’t know…’. It just ends there in an awkward manner, and there is higher friction to restart the conversation again.

Most people will just give up when chatbots or assistants say something similar to “I’m sorry, I’m still learning”, “I’m not sure I can help with that”.

It is in these situations that the user and the business need the conversation to keep going. Here’s how you do it.

As you can see here, the conversation extends despite the chatbot not having an answer to the user’s immediate question. More starter text is provided to overcome the friction.

Conversational implicature

When users ask a question, what is said, and what is implied might be two different things. It’s important for the chatbot to get the complete context before answering such questions.

If we have a medical topic being shared, and there is an immediate question asked, then the ai should pull in both the previous answer as well as the question to understand the implied question (hidden between the lines)

It is common knowledge that we humans don’t always mean what we say, or say what we mean. We use metaphors or form sentences in the context of other events. For another human being, it’s a natural thing to process this sort of conversations. Of course we “know” what the other person wants. We don’t need people to use a specific set of words.

This is called as conversational implicature.

We see this a lot in customer service. Customers who call about a broken internet connection complain about the same problem in a different way. “I’m not able to get online” and, “I think my internet is broken” is both indicative of “a problem” and the problem is “lack of internet”. This is why you need to write alternate queries for the same piece of information.

Thinking about what they meanwhy they said it and what they actually said can help you give a holistic user experience.

Citations for trust

Citations help users verify that the referenced material is relevant and valid. This way users don’t cede control over the accuracy of their content to the AI’s search engine.

The adoption of RAG (Retrieval Augmented Generation) has helped dramatically improve the AI’s response by getting really good at the needle-in-the-haystack problem.

Now, instead of simply summarizing a topic or a primary source, AI can collect information from multiple sources and aggregate it into a single response. Citations help users trace the information contained in a response back to its original material.

And there is more to the list!

Table of the nine GenAI-Enhanced Design Patterns

These are the nine broad design patterns that have proliferated in the AI landscape over the past year.

Subscribe to get future posts via email (or grab the RSS feed). 2-3 ideas every month across design and tech

Read more

  1. Breadboarding, shaping, slicing, and steelthreading solutions with AI agentsproduct-management
  2. How I started building softwares with AI agents being non technicalagentic-engineering
  3. Legible and illegible tasks in organisationsproduct
  4. L2 Fat marker sketchesdesign
  5. Writing as moats for humanswriting
  6. Beauty of second degree probesdecision-making
  7. Read raw transcriptsknowledge
  8. Boundary objects as the new prototypesprototyping
  9. One way door decisionsproduct
  10. Finished softwares should existproduct
  11. Essay Quality Rankerobsidian
  12. Export LLM conversations as snippetsbrowser-extension
  13. Flipping questions on its headinterviewing
  14. Vibe writing maximswriting
  15. How I blog with Obsidian, Cloudflare, AstroJS, Githubwriting
  16. How I build greenfield apps with AI-assisted codingai-coding
  17. We have been scammed by the Gaussian distribution clubmathematics
  18. Classify incentive problems into stag hunts, and prisoners dilemmasgame-theory
  19. I was wrong about optimal stoppingmathematics
  20. Thinking like a ship
  21. Hyperpersonalised N=1 learningeducation
  22. New mediums for humans to complement superintelligenceai-coding
  23. Maxims for AI assisted codingai-coding
  24. Personal Website Starter Kitai-coding
  25. Virtual bookshelvesaesthetics
  26. It's computational and AI everythingai-coding
  27. Public gardens, secret routesdigital-garden
  28. Git way of learning to codeai-coding
  29. Kaomoji generatorsoftware
  30. Copy, Paste and Citecuriosities
  31. Style Transfer in AI writingai-coding
  32. Understanding codebases without using codeai-coding
  33. Vibe coding with Cursorai-coding
  34. Virtuoso Guide for Personal Memory Systemsmemory
  35. Writing in Future Pastwriting
  36. Publish Originally, Syndicate Elsewhereblogging
  37. Poetic License of Designdesign
  38. Idea in the shower, testing before breakfastsoftware
  39. Technology and regulation have a dance of ice and firetechnology
  40. How I ship "stuff"software
  41. Weekly TODO List on CLIcli
  42. Writing is thinkingwriting
  43. Song of Shapes, Words and Pathscreativity
  44. How do we absorb ideas better?knowledge
  45. Read writers who operatewriting
  46. Brew your ideas lazilyideas
  47. Vibescreativity
  48. Trees, Branches, Twigs and Leaves — Mental Models for Writingwriting
  49. Compound Interest of Private Notesknowledge
  50. Conceptual Compression for LLMsai-coding
  51. Meta-analysis for contradictory research findingsdigital-health
  52. Beauty of Zettelswriting
  53. Proof of workproduct
  54. Gauging previous work of new joinees to the teamleadership
  55. Task management for product managersproduct
  56. Stitching React and Rails togetherai-coding
  57. Exploring "smart connections" for note takingknowledge
  58. Deploying Home Cooked Apps with Railssoftware
  59. Self Marketing
  60. Repetitive Copypromptingwriting
  61. Questions to ask every decadejournalling
  62. Balancing work, time and focusproductivity
  63. Hyperlinks are like cashew nutswriting
  64. Brand treatments, Design Systems, Vibesdesign
  65. How to spot human writing on the internet?writing
  66. Can a thought be an algorithm?product
  67. Opportunity Harvestingcareers
  68. How does AI affect UI?design
  69. Everything is a prioritisation problemproduct-management
  70. Nowlifestyle
  71. How I do product roastsproduct
  72. The Modern Startup Stacksoftware
  73. In-person vision transmissionproduct
  74. How might we help children invent for social good?social-design
  75. The meeting before the meetingmeetings
  76. Design that's so bad it's actually gooddesign
  77. Breaking the fourth wall of an interviewinterviewing
  78. Obsessing over personal websitessoftware
  79. Convert v0.dev React to Rails ViewComponentsrails
  80. English is the hot new programming languagesoftware
  81. Better way to think about conflictsconflict-management
  82. The role of taste in building productsdesign
  83. World's most ancient public health problemsoftware
  84. Dear enterprises, we're tired of your subscriptionssoftware
  85. Products need not be user centereddesign
  86. Pluginisation of Modern Softwaredesign
  87. Let's make every work 'strategic'consulting
  88. Making Nielsen's heuristics more digestibledesign
  89. Startups are a fertile ground for risk takingentrepreneurship
  90. Insights are not just a salad of factsdesign
  91. Minimum Lovable Productproduct
  92. Methods are lifejackets not straight jacketsmethodology
  93. How to arrive at on-brand colours?design
  94. Minto principle for writing memoswriting
  95. Importance of Whytask-management
  96. Quality Ideas Trump Executionsoftware
  97. How to hire a personal doctor
  98. Why I prefer indie softwareslifestyle
  99. Use code only if no code failscode
  100. Personal Observation Techniquesdesign
  101. Design is a confusing worddesign
  102. A Primer to Service Design Blueprintsdesign
  103. Rapid Journey Prototypingdesign
  104. Directory Structure Visualizercli
  105. AI git commitscli
  106. Do's and Don'ts of User Researchdesign
  107. Design Manifestodesign
  108. Complex project management for productproducts
  109. How might we enable patients and caregivers to overcome preventable health conditions?digital-health
  110. Pedagogy of the Uncharted — What for, and Where to?education
  111. Future of Ageing with Mehdi Yacoubiinterviewing
  112. Future of Equity with Ludovick Petersinterviewing
  113. Future of Mental Health with Kavya Raointerviewing
  114. Future of Tacit knowledge with Celeste Volpiinterviewing
  115. Future of Rural Innovation with Thabiso Blak Mashabainterviewing
  116. Future of unschooling with Che Vanniinterviewing
  117. Future of work with Laetitia Vitaudinterviewing
  118. How might we prevent acquired infections in hospitals?digital-health
  119. The soul searching yearsentrepreneurship
  120. Design education amidst social tribulationsdesign
  121. How might we assist deafblind runners to navigate?social-design