System communication—toasts, loading states, errors, confirmations. 10 patterns for keeping users informed.
Feedback patterns communicate system state and guide user actions. These 10 patterns include toasts, loading spinners, skeleton screens, progress bars, empty states, error messages, success confirmations, validation feedback, and status indicators. Good feedback is timely (immediate for clicks, contextual for errors), clear (specific problem + solution), and appropriate (don't interrupt flow for non-critical info).
Toast notifications are brief messages that appear temporarily. Learn when to use them and how to avoid overusing toasts.
Loading spinners show that a process is running. Learn when to use them vs. skeleton screens and progress bars.
Skeleton screens show layout placeholders while content loads. Learn when to use them for perceived performance.
Progress bars show completion percentage for tasks. Learn when to use them vs. spinners and how to design effective progress indicators.
Empty states show when there's no data to display. Learn how to turn empty states into engagement opportunities.
Alert banners display important messages at the top of pages. Learn when to use them vs. toasts and modals.
Confirmation dialogs prevent accidental destructive actions. Learn when to use them and how to write clear confirmation messages.
Badges are small labels that indicate status, count, or category. Learn when to use them and how to design clear badges.
Error states explain what went wrong and how to fix it. Learn how to design helpful error messages and recovery paths.
Success messages confirm completed actions. Learn when to use them and how to design effective success feedback.