Dont just add AI on top: Rethinking mobile email UX for all workflows
uxdesign.cc
We redesigned mobile email replies with a UI for inserting local responses while reading, optionally with AI. Image by theauthor.Many UI designers are currently tasked with extending existing interfaces with AI features, such as copilots and chatbots. On desktops, these are often added in sidebarsbut on mobile devices, where screen space is limited, AI is typically layered on top of existing UIs aspopups.In this article, we explore the drawbacks of this design pattern and discuss a better alternative. Drawing on our research in Human-Computer Interaction, we introduce a redesign inspired by microtasking. We use this to improve the experience of replying to emails on smartphones.The problem: AI on top hides context for usingitMobile email UIs are a prime example for adding AI on top: The image below shows how several email apps added AI with a popup oroverlay.A common UI design pattern for AI replies in current mobile email apps: AI is integrated as a popup (A), on top of an empty draft view (B). Users enter a prompt (C), check the generated reply (D), and then accept it with a button (E). Image by the author, with screenshots from Googles website, Superhumans YouTube channel, The Copilot Connections YouTubechannelUnfortunately, this design wastes valuable screen space, because the AI popup hides the incoming email or existing draft. This forces users to remember key details from the original email while crafting an AI prompt and reviewing the generated response. This cognitive burden becomes especially problematic for longer emails or in typical mobile scenarios where users are frequently interrupted.Leaving UI space unused, while requiring users to recall information, indicates that current AI replies are not integrated well.The solution strategy: Microtasking keepscontextTo address these issues, we applied principles from microtasking, leading to a new UI concept we call Content-Driven Local Response (CDLR). It restructures the UI for email replies into twosteps:The redesign: (1) While reading the email, tap any sentence to insert a local reply, optionally with AI sentence suggestions. (2) On a usual draft UI, connect the local replies to one coherent emailor (3) let AI do just that. Image by theauthor.Step 1Local response: Instead of switching to a separate AI popup, users can insert responses directly within the email as they read. In a sense, the email text itself becomes the interface: Tapping a sentence inserts a response card where users can jot down a reply, notes, or keywords. This tap also signals the AI to generate sentence suggestions, which users can accept with a tap orignore.Step 2Connecting the local responses: Once users finish reading, they transition to the email draft screen, where all local responses are collected. Here, they can refine these snippets into a full reply manuallyor let AI generate a coherent message fromthem.Result: Flexible workflows and usercontrolWe evaluated this design in a user study with 126 participants, comparing it to two baselines:Manual replies: Users wrote responses withoutAI.AI-generated replies: This UI mimicked the industry standard of entering a prompt for a fully AI-generated response.Our findings show that Content-Driven Local Response (CDLR) provides a flexible middle ground between these extremes. By allowing users to draft local responses while reading, the design allowed users to engage more with the incoming email and their own thoughts on it. At the same time, AI support helped reduce typing effort anderrors.As our study (N=126) showed, our design (center) involves users more, also while reading. Image by theauthor.Moreover, participants also valued the added control over the final message. While full AI generation was faster, the new design also covers fast workflows: When preferring a quicker workflow, users can skip the local response step and jump straight to AI drafting. In this way, the new UI supports very flexible workflows.This design empowers users to decide when and how to involve AI, for example, to balance speed andcontrol.Design lessonslearnedA core principle of microtasking is keeping relevant context visible, allowing users to recognise information rather than having to recallit.Initially, we applied this idea to help users see the incoming email while prompting AI and reviewing its output. Through our user-centred design process, we refined it further: the ability to insert local responses while reading is useful on its owneven withoutAI.Put as a design insight for AI integration:Rather than adding AI on top of existing UIs, we should design for users workflowswhether they involve AI or not. Such flexible UIs empower users to decide themselves when and how to involveAI.So how can we redesign for these flexible workflows? Heres ourrecipe:Identify micro-decisions that users make in the workflow that currently lack explicit interaction. In email replies, this meant recognizing that users naturally decide which parts of an email to respond to whilereading.Enable users to express these moments in interaction. In our case, we allowed users to tap any sentence whilereading.Integrate AI specifically and optionally at these decision moments. For example, in our design, tapping a sentence also triggered (local) suggestions.ResourcesPreprint of the paper on arxiv: https://arxiv.org/abs/2502.06430Video showing the UI in action: https://youtu.be/wtTDgU6559Ihttps://medium.com/media/e7f6b6bfe841b7b510751e41d3f33a51/hrefDont just add AI on top: Rethinking mobile email UX for all workflows was originally published in UX Collective on Medium, where people are continuing the conversation by highlighting and responding to this story.
0 التعليقات ·0 المشاركات ·44 مشاهدة