- UX for AI
- UX Best Practices for Copilot Design
UX Best Practices for Copilot Design
Microsoft has revealed a set of UX design best practices that will be critical moving forward for anyone attempting to design a functional and useful copilot for their organization.
In the new video featuring the new Security Copilot, Microsoft has revealed a set of UX design best practices that will be critical moving forward for anyone attempting to design a functional and useful copilot for their organization. In this article, we dissect the video to tease out the details that we feel will be crucial for designers in the next 6-12 months.
Meet the Microsoft Security Copilot (MSC)
In this excellent video, we see many of the features that we’ve seen from the applied SaaS copilots before, plus a few new features that I consider critical for success. I strongly recommend you watch the entire thing:
Source for all screenshots in this article (unless indicated otherwise)
“How Microsoft Security Copilot works” by Microsoft Mechanics
As you watch, keep a close eye on the following key design principles and best practices.
1. The more important the task, the more real estate is required
This co-pilot is unabashedly an add-on. In contrast to the r1 rabbit we discussed last week, this is NOT an AI-First design. Not by any means. Instead, it is an add-on built literally on top of the existing product. However, while much of the UI we see in the video looks like a modal, it’s actually not: it is a stand-alone page reminiscent of the ChatGPT interface with the chat box pinned to the bottom of the page.
So the MSCopilot is built on top of and to help an existing product… But it’s in a separate page.
The full-page design of the MSC is quite different than the typical side-panel copilot experience we see when the MSC is integrated with other Microsoft security products:
Or even the half-way experience that is housed in a large pane that is Amazon Q:
Source: Generative BI with Amazon Q in QuickSight by Amazon QuickSight
Clearly, while there are still a great many options available to the designer of the copilot, the more serious the task, the more screen real estate it requires (no surprise there). In the case of the MSC, it is a large and weighty area indeed, which means the task that the creators think the AI will play in this case is an important one.
2. SaaS Copilot is Stateful
Unlike the Bing copilot or even ChatGPT, the MSC makes it a big point of being stateful. What this means is that as a user, you can have multiple overlapping conversations with this AI, picking up where you left off as the co-pilot adds more information to the conversation you are having. Statefullness is in addition to being able to have deeper, multi-stage conversations:
3. Specialized Fine-Tuned ChatGPT Model
The video makes a special point of, ahem, pointing out the specially tuned AI model of the MSC. And it is impressive. Compared with the stock ChatGPT, it performs considerably better. The whole point of fine-tuning (that is, simply put, “training”) LLMs on custom content is going to be especially critical going forward. Companies that do not allow this or provide easy and accessible ways of creating and training custom instances of ChatGPT will be very quickly left behind. Amazon, Google, Apple… I hope you are listening. We need some competition.
4. Plugins: Integrated Continuous Learning About your Specific System
If the custom trained fine-tuned instance of ChatGPT was not miraculous enough, the creators of MSC have been able to add live feeds of data from multiple systems via what they are calling “Plugins,” essentially custom data feeds that are specially configured to feed the data about your specific system into the LLM.
This is a complete game-changer because, normally, LLMs feature fairly static data that is frequently cut off by time. For example, the current version of ChatGPT, GPT-4, has access to current information until September 2023 (https://the-decoder.com/chatgpt-might-have-been-updated-with-more-recent-information/). Don’t try to ask it, for example, about things like the dissolution of InVision (NOTE: we wrote about InVision in this blog https://www.uxforai.com/p/invision-shutdown-ux-strategy-lessons, and we make it a point to report on the important events that shape the UX Design industry, which is why you should subscribe to UXforAI.com if you have not already.)
Sure enough, when the user in the video asks the LLM about the specific information about the incident that happened minutes ago, the MSC is able to form a highly coherent narrative about the situation thanks to the real-time data supplied by the plugins:
5. The IA of the AI is Straightforward, Focused on Chat
The Information Architecture (IA) for this Artificial Intelligence (AI) is relatively straightforward: we see a landing page, followed by a “My Sessions” page (which we never see but can assume is probably similar to ChatGPT’s History pane), and then ultimately followed by an answer to the specific question or chat-based investigation session. Clearly, whatever magic is contained in this particular UI is in the individual sessions: the interactions between the human and AI, and that terminal node page (chat) is the focus of the whole copilot interaction:
6. Promptbooks: No need to twist into pretzels to write prompts
Prompt engineering is clearly taken over the internet if goofy messages like:
MSC offers a welcome alternative: the AI will help you write the prompts to interact with AI. This is a bit similar to the concept of Playbooks, that is, the pre-determined plays based on specific scenarios (as in, 49rs really needed a playbook for the rainy conditions last weekend and did not have one handy.) The MSC comes to the rescue with Promptbooks, pre-made recipes for all kinds of common investigations. These are recommended right on the homepage and demonstrated in the video. That is especially handy because in security incident responses, as on the football field, the situation is extremely stressful, and time is often short. There is just no time to write complex queries like this one:
“Act as a world class market researcher with extensive experience in creating user personas, you are tasked with developing a detailed persona for the [Product/Service Name] in the [Industry]. This persona will serve as a fundamental tool for guiding product development and marketing strategies. I am your client and I have provided information on the target market, including demographics, psychographics, goals, challenges, and preferred communication channels below. Your approach should be research based, insightful, and empathetic to the user's needs. If required, please ask me the client more questions if you need any additional clarification in order to address the sections below. Please address the following sections to create the detailed persona for your client:
Give the persona a realistic name and select a representative profile picture. Ensure the persona embodies the characteristics of the [Describe Target Market].
Provide detailed demographic information, including age, gender, location, education, occupation, and any other relevant demographic factors.
Delve into the persona's interests, values, lifestyle, and other psychological attributes. Explain how these factors influence their behavior and preferences. Goals and
Identify and describe the primary goals and motivations that drive the persona's decision-making and behaviors, especially in relation to [Product/Service Name].
Pain Points and Challenges:
List and elaborate on the main challenges and pain points the persona encounters, specifically related to the product/service. Explore how these pain points affect their experiences and choices.
Specify the channels through which the persona prefers to interact, receive information, or make purchases, such as social media, email, in-person, etc.
Real-Life Interaction Scenario:
Create a brief narrative or scenario illustrating how the persona would realistically interact with [Product/Service Name]. This scenario should highlight the persona's use case, decision making process, and how the product/service fits into their life.
Incorporate any other relevant information or insights that can deepen the understanding of the persona and their relationship with [Product/Service Name].
Prepare a comprehensive document detailing the persona.
Include visual elements like the profile picture, infographics, and behavioural charts for enhanced clarity.
Your goal is to create a user persona that is not only representative of the target audience for [Product/Service Name] but also provides actionable insights for product development, marketing strategies, and business decision-making. This persona should be a reflection of thorough research and a deep understanding of the user's world.”
Fortunately, it looks like in the near foreseeable future, we will not need to write these insane monstrosities. The best practice demonstrated by the MSC is to provide specific, short queries that interact with the custom data in predictable and repeatable ways that yield useful information:
This is the key for SaaS products:
SaaS is not entertainment but serious work. And copilots are now a serious business indeed.
What did you think of the video? Did we miss any new and interesting trends and best practices? Let us know!
Greg & Daria