Usage
Confirming and acknowledging user actions can reduce uncertainty about an action that a user has taken, or is about to take. They also prevent users from making mistakes.
Types of actions
- Confirming actions ask the user to verify that they want to proceed with an action.
- Acknowledging actions provide text to let the user know whether an action they chose has been completed.
Not all actions warrant a confirmation or an acknowledgment.
Confirmation
Usage
When a UI requests confirmation from a user, it asks if they want to proceed with the action they just took. It may be paired...
When a UI requests confirmation from a user, it asks if they want to proceed with the action they just took. It may be paired with a warning or critical information related to that action.
Confirmation isn't necessary when the consequences of an action are reversible or negligible. For example, if a check mark shows an image has been selected, further confirmation is unnecessary.
Alert dialog
Confirmation is best delivered using an alert dialog.
Confirmation is best delivered using an alert dialog.
Acknowledgement
Usage
An acknowledgement notifies the user about system actions occurring in the background. It appears for a short amount of time and may include an option...
An acknowledgement notifies the user about system actions occurring in the background. It appears for a short amount of time and may include an option to undo the action.
Acknowledgement components
Acknowledgements can be delivered by a variety of components. Criteria for choosing the right acknowledgement component includes: Acknowledgements that are transient mean the component will...
Acknowledgements can be delivered by a variety of components. Criteria for choosing the right acknowledgement component includes:
- Urgency level
- Inclusion of an action to correct a problem
- Duration on screen (transient, dismissable, or both)
Acknowledgements that are transient mean the component will exit on its own within a few seconds of appearing. Dismissable acknowledgements can be dismissed by selecting an action to dismiss the component.
Component | Urgency | Content | Behavior | Number of actions to dismiss |
---|---|---|---|---|
Snackbar | Low | Informational | Transient & dismissable | 0-1 |
Alert | Medium | Correct a problem; Awareness of state |
Persistent, non-blocking, and dismissable |
1-2 |
Dialog | High | Require a choice; Acknowledge |
Persistent, blocking (interruptive) |
1-2 |
Empty State | Medium | Informational | Persistent, blocking | 0-2 |
Alert
Use alerts to deliver a persistent, in-app message that informs users of a particular change state.
Snackbar
Use a snackbar to provide brief feedback about an operation.
Empty state
When a UI is only available online and content has failed to load or sync, use an empty state. The user should be able to interact with as much of the rest of the app as possible. A link to reload can be presented to help a user accomplish their task.