In the last post I covered some conventional UX practices and methodologies that apply to generative AI interfaces but are not exclusive to generative AI. What are some methodologies or principles that are more specific to generative AI that differ from the UX design for other, more traditional applications? First, we define generative AI interfaces are those that use artificial intelligence to create or modify content, such as text, images, audio, or video. They are different from other applications in that they require a high level of user trust, control, and feedback. Some of the UX design principles, approaches, or methodology that are specific or important for generative AI interfaces are:
Transparency: The user should be able to understand how the generative AI works, what are its capabilities and limitations, and how it uses the user's data. This can be achieved by using clear labels, icons, tooltips, explanations, and examples to communicate the AI's functionality and purpose ¹ ².
Control: The user should be able to influence the generative AI's output, such as by providing input, setting parameters, choosing options, or editing the result. This can be achieved by using sliders, buttons, menus, checkboxes, or text fields to allow the user to adjust the AI's behavior and outcome ¹ ².
Feedback: The user should be able to see the generative AI's output, evaluate its quality and relevance, and provide feedback to the AI. This can be achieved by using progress bars, previews, ratings, comments, or suggestions to show the user the AI's progress and result, and to collect the user's opinion and preference ¹ ².
Iteration: The user should be able to refine the generative AI's output, such as by repeating, modifying, or combining the results. This can be achieved by using undo, redo, save, delete, or merge functions to enable the user to experiment and improve the AI's output ¹ ².
Some examples of generative AI interfaces that use these principles are:
Framer: A design tool that uses generative AI to create realistic mockups and prototypes based on the user's sketches. It uses a magic wand icon to indicate the AI feature, a slider to control the level of detail, a preview to show the AI's output, and a save function to store the result ¹.
Photoshop: A photo editing tool that uses generative AI to enhance or transform images. It uses labels and tooltips to explain the AI features, such as neural filters, content-aware fill, or sky replacement. It also uses buttons and menus to allow the user to select and adjust the AI options, a progress bar to show the AI's progress, and an edit function to modify the result ¹.
Notion: A note-taking and collaboration tool that uses generative AI to generate text based on the user's input. It uses a sparkles icon to indicate the AI feature, a text field to provide the input, a preview to show the AI's output, and a rating function to collect the user's feedback ¹.
Diagram: A diagramming tool that uses generative AI to create diagrams based on the user's text. It uses a label and an example to explain the AI feature, a text field to provide the input, a preview to show the AI's output, and a merge function to combine the results ¹.
(1) Emerging UI/UX Patterns in Generative AI: A Visual Guide. https://www.whitespectre.com/ideas/emerging-ui-ux-patterns-in-generative-ai/.
(2) Design Principles for Generative AI Applications - arXiv.org. https://arxiv.org/abs/2401.14484.
(3) Redefining UX Design for Generative AI Models in Enterprise. https://law.stanford.edu/2023/11/16/redefining-ux-design-for-generative-ai-models-in-enterprise/.