Inline message
A visible object or section has local status, warning, success, or next-step information.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardContextual in-flow feedback
Test in lab 30 documented entries 5 anti-pattern checks
Feedback, Status, And System State
Loading, progress, alerts, banners, sync, confidence, and system visibility.
Browse all problem familiesLearn the family
What has the system received, and what should the person expect next?
Status connects an action to a real system event. A useful message names the current state, its consequence, and the next available action.
Use this method
- List the events that change the person's task.
- Write a distinct message for pending, received, delayed, and failed states.
- Place feedback near the action or result it explains.
- Test whether people infer the correct service status.
Compare the outcome
Strong: A clinic kiosk says Check-in received and gives a receipt number after the appointment service records arrival.
Weak: A clinic kiosk says Done while the staff queue still awaits the check-in record, so a patient asks reception whether arrival succeeded.
Try it: Map one button press to the real events behind it and write a truthful message for each meaningful state.
Read these patterns first
- Loading spinnerThe operation has defined resolution, timeout, cancellation, or failure paths.
- Error stateA system or task failure blocks expected content or action.
- Success confirmationA user action has completed and users need proof, object identity, or next-step orientation.
Complete study route · 30 entries
Work through the family in order
Begin with the core behavior, apply it in different contexts, then review cases that reveal the quality boundary. Open each entry for its decision rule, states, example, and source trail.
0 of 30 studies complete
Start this family →6 entries
Build the foundation
Learn the shared task and the core interaction choices.
Error state
A system or task failure blocks expected content or action.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardRecoverable failure surface
Test in lab Success confirmation
A user action has completed and users need proof, object identity, or next-step orientation.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardDurable in-context proof that an action completed
Test in lab Confirmation page
A transaction or service journey has ended and users need durable proof plus next-step information.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardFinal endpoint page after a transaction is complete
Test in lab Empty state
A next setup, creation, import, sample, or access-request action is available or explainable.
- Type
- UI-UX
- Sources
- 4
- Trail checked
establishedResolved no-data content surface
Test in lab Loading spinner
The operation has defined resolution, timeout, cancellation, or failure paths.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardBounded indeterminate wait indicator for a named action or region
Test in lab 19 entries
Apply the patterns
Choose a specialized form for the context and follow its complete behavior.
Loading skeleton
The content shape is predictable.
- Type
- UI-UX
- Sources
- 4
- Trail checked
establishedBounded content loading placeholder
Test in lab Progress bar
A system operation has a measurable total or bounded progress value.
- Type
- UI-UX
- Sources
- 3
- Trail checked
standardMeasurable system-operation progress indicator
Test in lab Step progress
A workflow has several named stages and users need to understand current, completed, pending, blocked, failed, waiting, or skipped status.
- Type
- UI-UX
- Sources
- 5
- Trail checked
standardWorkflow-stage status indicator
Test in lab Meter
A current value exists inside a meaningful known range.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardRead-only scalar value gauge within a known range
Test in lab Toast notification
Use for short non-blocking confirmation after explicit actions such as save, copy, send, archive, invite, or queue export.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardTransient non-modal status message
Test in lab Banner
The message applies across several pages, routes, sections, records, or sessions.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardTop-of-interface broad-scope message
Test in lab Notification banner
A service problem, deadline, overdue action, or elsewhere-in-service event affects the user's next interpretation of the page.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardPage-flow service notification before the H1
Test in lab Site alert
Urgent public, safety, operating-status, outage, closure, or availability information applies to the whole site or service.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardUrgent full-width sitewide alert near the top of every page
Test in lab Alert
A current task has a time-sensitive warning, error, or important status change.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardUrgent current-task status message
Test in lab Warning text
A user must understand a serious consequence before taking or skipping an action.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardSevere-consequence warning copy before an action
Test in lab Notification center
Users receive multiple asynchronous updates across objects, jobs, collaborators, approvals, or reminders.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardDurable user-opened notification history and action drawer
Test in lab Sync state
Local changes, files, messages, uploads, or records need to reconcile with a remote service or another device.
- Type
- UI-UX
- Sources
- 3
- Trail checked
standardLocal-and-remote reconciliation status
Test in lab Offline state
Connection loss or server reachability changes the user's current task.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardConnectivity-mode and local-work continuity state
Test in lab Permission denied state
A signed-in user lacks permission to view, edit, publish, export, delete, approve, share, administer, or configure a resource.
- Type
- UI-UX
- Sources
- 3
- Trail checked
standardAuthorization and access-boundary state
Test in lab Conflict state
Concurrent users, devices, branches, or background jobs changed the same object or location.
- Type
- UI-UX
- Sources
- 3
- Trail checked
standardCompeting-version resolution state
Test in lab Service unavailable page
Maintenance, overload, incident response, dependency failure, deployment, or permanent closure blocks normal use.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardWhole-service unavailable page
Test in lab Page not found page
The team needs to measure and repair broken links.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardMissing-route recovery page
Test in lab Phase / beta banner
A service is in alpha, private beta, public beta, or another explicit pre-live phase.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardService phase and feedback marker
Test in lab Cookie banner
The service sets non-essential cookies or similar device storage technologies.
- Type
- UI-UX
- Sources
- 4
- Trail checked
standardCookie and tracking consent control
Test in lab 5 entries
Review the quality risks
Study failure cases and identify the better recovery route.
Infinite spinner
Use this anti-pattern entry to audit loading, saving, syncing, uploading, report generation, billing retrieval, AI generation, and import flows that can hang.
- Type
- UI-UX
- Sources
- 3
- Trail checked
anti-patternUnbounded loading anti-pattern
Test in lab Disabled button with no explanation
Use this anti-pattern entry to audit disabled submit, continue, create, save, delete, publish, invite, export, payment, and setup actions.
- Type
- UI-UX
- Sources
- 4
- Trail checked
anti-patternBlocked action anti-pattern
Test in lab Dead-end empty state
Auditing generated UIs, dashboards, tables, lists, or panels for blank states that strand users.
- Type
- UX
- Sources
- 5
- Trail checked
anti-patternActionless blank-state anti-pattern
Test in lab Toast-only success for completed transaction
Use this anti-pattern entry to identify transaction success handled only by transient feedback.
- Type
- UI-UX
- Sources
- 5
- Trail checked
anti-patternTransient-only completed-transaction anti-pattern
Test in lab Toast-only critical error
Use this anti-pattern entry to identify and replace transient-only handling of payment, save, permission, account, upload, deletion, and security failures.
- Type
- UI-UX
- Sources
- 3
- Trail checked
anti-patternTransient critical-feedback anti-pattern
Test in lab Try another phrase
Try fewer words, clear the filter, or search across all pattern families.
Search all patterns