Product patterns
Production-ready interaction guidance for common SaaS and AI product problems.
43 patterns
- DataFree
Bulk Actions
Let users perform one action across many records safely, with clear scope, eligibility and recovery.
9 states8 edge casesDesktop + Mobile
- DataFree
Advanced Filters
Help users narrow large datasets with filters they can see, edit, share and recover from.
8 states7 edge casesDesktop + Mobile
- FormsFree
Autosave
Save changes continuously without a Save button, while keeping users certain their work is safe.
8 states7 edge casesDesktop + Mobile
- Workflow Pro
Approval Workflow
Route a request through one or more reviewers with clear status, accountability and an auditable history.
9 states8 edge casesDesktop + Mobile
- AI Pro
AI Response
Present generated answers with streaming, sources, control and recovery, so users can trust and verify them.
9 states7 edge casesDesktop + Mobile
- FilesFree
File Upload
Let users add files with visible progress, early validation and recovery that never loses what already uploaded.
8 states7 edge casesDesktop + Mobile
- NavigationFree
Command Palette
Give users one keyboard-first entry point to jump anywhere and run any action without hunting through menus.
8 states7 edge casesDesktop + Mobile
- Payments Pro
Subscription Management
Let customers upgrade, downgrade, change billing cycles and cancel with exact prices, dates and consequences shown before they confirm.
8 states7 edge casesDesktop + Mobile
- Payments Pro
Refunds
Let support staff or customers return money with the exact amount, destination, timing and consequences stated before it's irreversible.
8 states7 edge casesDesktop + Mobile
- Payments Pro
Checkout
Take a customer from plan choice to paid with the fewest fields, a total that never surprises, and errors that keep what they typed.
8 states6 edge casesDesktop + Mobile
- Payments Pro
Failed Payment Recovery
Recover failed renewals with timely, specific prompts and a grace period, before customers lose access they still want.
7 states6 edge casesDesktop + Mobile
- PaymentsFree
Usage & Limits
Show customers how much of their plan they've used and handle the moment they hit a limit without breaking their work.
6 states5 edge casesDesktop + Mobile
- NavigationFree
App Sidebar
Organise a product's main navigation so users always know where they are, reach frequent places in one click, and keep their place on small screens.
6 states5 edge casesDesktop + Mobile
- NavigationFree
Tabs
Split one object's content into peer views that users switch between without losing their place, state or URL.
6 states5 edge casesDesktop + Mobile
- Navigation Pro
Breadcrumbs & Back
Show users where they are in a hierarchy and get them back to exactly where they came from — filters, scroll and all.
5 states5 edge casesDesktop + Mobile
- FilesFree
File Preview
Let users look inside a file without downloading it, with a predictable fallback for every type the product can't render.
6 states5 edge casesDesktop + Mobile
- Files Pro
Attachments
Attach files to records and comments with clear ownership, visibility and deletion rules that match the record they belong to.
6 states5 edge casesDesktop + Mobile
- Files Pro
CSV Import
Bring spreadsheet data into the product with column mapping, row-level validation and a preview, so nothing is imported by surprise.
7 states6 edge casesDesktop + Mobile
- WorkflowFree
Confirmation
Ask for confirmation only when an action is hard to undo, and make the dialog state exactly what will happen.
6 states5 edge casesDesktop + Mobile
- Workflow Pro
Partial Failure
Report operations where some items succeed and some fail, so users know exactly what happened and what to do about the rest.
6 states5 edge casesDesktop + Mobile
- Workflow Pro
Permissions
Show people what they can do, explain what they can't, and give them a way forward instead of a dead end.
7 states5 edge casesDesktop + Mobile
- Workflow Pro
Notifications
Tell people about things that need them, in the right channel and at the right volume, without burying what matters.
7 states5 edge casesDesktop + Mobile
- DataFree
Activity History
Show who changed what and when on a record, in a timeline people can scan, filter and trust.
6 states5 edge casesDesktop + Mobile
- DataFree
Empty States
Design what users see when there's nothing to show, so every empty screen explains why and offers the next useful step.
6 states5 edge casesDesktop + Mobile
- Forms Pro
Version History
Let users see earlier versions of a document or record, compare them, and restore safely without losing current work.
6 states4 edge casesDesktop + Mobile
- AI Pro
Human Review
Put a person between AI output and real-world consequences, with review that's fast for good output and careful for risky output.
7 states5 edge casesDesktop + Mobile
- AI Pro
Feedback
Collect quick, specific feedback on AI output that users actually give, and that the team can actually use.
5 states4 edge casesDesktop + Mobile
- FormsFree
Inline Validation
Tell users about input problems at the right moment — not while they're still typing, and not only after they submit.
6 states5 edge casesDesktop + Mobile
- Forms Pro
Unsaved Changes
Protect work in forms that save explicitly, warning only when something would actually be lost.
6 states4 edge casesDesktop + Mobile
- Forms Pro
Offline Mode
Keep users working when the connection drops, with an honest view of what's synced, what's pending and what can't be done offline.
7 states5 edge casesDesktop + Mobile
- DataFree
Search
Help users find records by what they remember — a name, a number, a phrase — with results that explain why they matched.
5 states5 edge casesDesktop + Mobile
- DataFree
Pagination
Split long lists into pages or progressive loads in a way that keeps position, counts and selection predictable.
5 states4 edge casesDesktop + Mobile
- Data Pro
Saved Views
Let users save a combination of filters, sorting and columns as a named view they and their team can return to.
6 states4 edge casesDesktop + Mobile
- Workflow Pro
Comments
Let people discuss work where it happens — on the record or the exact part of it — with mentions, threads and resolution.
7 states5 edge casesDesktop + Mobile
- Workflow Pro
Error Recovery
When something fails, say what happened in plain language, protect the user's work, and offer the most useful next step.
6 states5 edge casesDesktop + Mobile
- Navigation Pro
Keyboard Shortcuts
Give frequent users fast keyboard paths that are discoverable, consistent and never get in the way of typing.
6 states4 edge casesDesktop + Mobile
- AIFree
Prompt Input
Design the box where users ask AI for things — with context, attachments and controls visible — so prompts start strong and never get lost.
7 states5 edge casesDesktop + Mobile
- AIFree
AI Suggestions
Offer AI-generated values, completions and next steps inline, so users accept good ones in one action and ignore the rest at no cost.
6 states5 edge casesDesktop + Mobile
- AI Pro
Agent Progress
Show what an AI agent is doing during long, multi-step tasks — steps, tool use and decisions — so users can follow, steer and stop it.
7 states5 edge casesDesktop + Mobile
- AI Pro
AI Onboarding
Introduce an AI feature by showing what it can do with the user's own data, setting honest expectations about limits and privacy.
6 states4 edge casesDesktop + Mobile
- FilesFree
Export
Let users take their data out in the format they need, with a clear scope and no surprises about what's included.
6 states5 edge casesDesktop + Mobile
- Files Pro
Sharing & Links
Let people share files and records with teammates or outsiders, with access levels and link scope that are impossible to misread.
6 states5 edge casesDesktop + Mobile
- Files Pro
Storage Limits
Show how much storage is used and by what, and handle a full quota without blocking work or deleting anything.
5 states4 edge casesDesktop + Mobile