Design Feedback Patterns

Map each user action to the right feedback mechanism — inline, toast, modal, or full-page — and write copy that confirms success, explains failure, and offers recovery.

Why This Is Best Practice

Adopted by: Nielsen's Heuristic #1 "Visibility of system status" is the most-cited usability heuristic across all major design systems; Google Material Design, Apple HIG, IBM Carbon, and Shopify Polaris all provide explicit feedback component guidelines (snackbars, alerts, dialogs) with usage rules; Stripe's and GitHub's developer experience teams have published case studies on error message redesigns Impact: NNG analysis finds that 82% of usability problems involve unclear system status — users not knowing if an action succeeded, failed, or is in progress; NNG "Error Message Guidelines" (2018) documents that error messages explaining cause + resolution reduce support tickets by 40–50% vs generic "An error occurred" messages; Stripe's redesign of API error messages reduced developer support contacts by 35% Why best: Users make decisions based on perceived system state — no feedback after a click causes re-clicks and duplicate submissions; generic success messages ("Done!") don't confirm what was done; generic error messages ("Something went wrong") don't tell users what to do — all three outcomes require support escalation that a well-designed feedback response would have avoided

Sources: Nielsen "10 Usability Heuristics" (1994); NNG "Error Message Guidelines" (Harley, 2018); NNG "Indicators, Validations, and Notifications: Pick the Correct Communication Option" (Rosala, 2021); Stripe Design "Error Messages" (stripe.dev)

Steps

1. Map actions to feedback types

Select the feedback mechanism based on severity, reversibility, and required attention: