For enterprise leaders & product teams

One X Group Design Patterns Library

AI-driven design patterns and best practices for enterprise digital transformation

All Identity Components Interfaces Guidances Adjustments Presets Trust Accessibility Controls Infrastructure AI Interface Patterns Data Visualization Conversational AI

Identity

Define and establish the presence and characteristics of AI within the interface

Symbol

Represents the AI with a distinctive symbol or icon

Color

Assigns a distinct color to visually identify the AI within the interface

Personality

Defines the tone, style, and characteristics of the AI's communication

Greeting

Initiates interaction with users in a friendly and welcoming manner

Name

Assigns an identity to an AI system for personification and recognition

Components

Comprise the building blocks and elements that constitute AI design and implementation

AI Autofill

Automatically suggests and completes user inputs based on AI predictions or patterns

AI Stat Card

Displays key AI metrics and performance indicators in a concise card format for easy reference

AI Classification Column

Displays categorized data or insights generated by AI in a structured column format

AI Document Summary

Generates concise summaries of documents or text-based content using AI-driven algorithms

AI Forecast Column

Displays AI-generated forecasts or predictions in a structured column format for easy reference and analysis

AI DataTable Chat

Facilitates interaction with AI-generated data through a chat interface with tabular data presentation

AI Action List

Presents users with actionable items or tasks generated by the AI based on analyzed data or user inputs

AI Charts

Visualizes AI-generated insights and data analysis results in graphical format for easy interpretation

AI Summary Column

Summarizes AI-generated findings or insights in a dedicated column format for easy reference and comparison

AI Insights Callout

Highlights key trends, anomalies, or insights generated by AI for user attention and analysis

Interfaces

Facilitate user interaction and engagement with AI features and functionalities

Floating Action Button

Provides a centralized, accessible action point on the interface

Prompt Popover

Facilitates dynamic input guidance directly within the interface

Highlight Text

Exposes interactive options through text selection

Chat Panel

Provides a dedicated area for interactive communication between users and AI

Natural Language Input

Enables intuitive, conversational interactions with AI systems

Guidances

Offer direction and assistance to users in utilizing AI capabilities effectively

Starter Suggestions

Provides initial prompts or recommendations to guide users in getting started

Modifier Dropdown

Provides users with a dropdown menu of modifiers to remix or blend with AI-generated content

Response Variations

Offers users the option to select from different variations of AI responses to improve chat quality

Contextual Tooltips

Provides guidance through dropdown menus for content remixing

Prompt Examples

Provides sample prompts or hints to guide users in initiating interactions with the AI

Adjustments

Enable customization and fine-tuning of AI behavior and outputs to meet user preferences

Model Selector

Allows users to choose their preferred AI model for processing requests or generating responses

Fine-tuning Options

Provides users with the ability to adjust and refine the behavior or parameters of the AI model

Presets

Provide predefined settings or configurations for rapid deployment and usage of AI

Response Preferences

Tailors AI responses to align with user-defined parameters

User Preferences

Enables customization based on user-specific settings and behaviors

Persona

Creates detailed profiles to guide AI interactions and design

Trust

Foster confidence and reliability in AI through transparency, accountability, and validation mechanisms

Feedback

Allows users to provide quick feedback on AI outputs through thumbs-up/thumbs-down action buttons

Disclaimers

Provides users with information regarding the limitations or liabilities associated with AI usage

Citations

Provides users with references or sources for the information presented by the AI

Report Abuse

Allows users to flag inappropriate or abusive content generated by the AI for review

Accessibility

Ensure inclusivity and usability of AI features for users with diverse needs and abilities

Voice Commands

Allows users to interact with the AI using spoken commands or voice input

Keyboard Shortcuts

Provides users with keyboard combinations for quick access to AI functionalities or actions

Multilingual Support

Enables the AI to understand and respond to user inputs in multiple languages

Controls

Empower users with tools to manage and regulate AI operations and interactions

Edit Message

Allows users to edit their previously sent messages in the chat interface

Regenerate

Allows users to regenerate or refresh AI-generated content for improved outcomes

File Upload

Allows users to upload files or documents to the AI for processing or analysis

Scroll Directions

Enables users to navigate quickly within a long chat window by jumping to the top or bottom

Displays a loading state to indicate to users that the AI is processing information

Copy Text

Enables users to copy text from messages or chat transcripts within the interface

Pause

Provides users with a control to temporarily pause or stop the chat while the AI processes information

Infrastructure

Support the underlying framework and resources necessary for AI functionality and integration

Folder Management

Organizes content into structured, navigable directories

Chat History

Provides users with access to past conversations and interactions within the application

Chat Sharing

Enables users to share chat transcripts or conversations with others

Chat Download

Enables users to download chat transcripts or conversations for offline access or reference

AI Interface Patterns

Design patterns for building trustworthy, transparent, and intuitive AI-powered user interfaces.

AI Confidence Indicator

Display confidence scores alongside AI outputs to help users calibrate trust and make informed decisions.

Progressive Disclosure

Reveal AI complexity gradually — show simple results first, let users drill into reasoning and data sources on demand.

Human Override Control

Always provide users with clear mechanisms to override, correct, or reject AI recommendations.

Explainable AI Summary

Present AI reasoning in plain language — show users why a recommendation was made, not just what it is.

Data Visualization

Patterns for presenting complex data in clear, actionable, and visually compelling ways.

Real-Time Dashboard

Live updating dashboards with KPI cards, sparklines, and status indicators for at-a-glance monitoring.

Comparison Matrix

Side-by-side comparison views for evaluating options, with sortable columns and highlight differences.

Data Story Flow

Narrative-driven data presentation that guides users through insights with scrolling, annotations, and context.

Anomaly Highlight

Automatically surface outliers and anomalies in datasets with visual emphasis and contextual explanations.

Conversational AI

UX patterns for designing chatbots, voice interfaces, and multi-modal conversational experiences.

Guided Conversation

Structure chatbot interactions with suggested responses, quick actions, and branching dialogue flows.

Context Memory

Maintain conversation context across sessions — show users what the AI remembers and let them manage it.

Handoff & Escalation

Seamlessly transition from AI to human support when confidence drops or user frustration is detected.

Multi-Modal Input

Accept text, voice, images, and documents as input — let users communicate in the way that suits them.