Mobile alerts

Also referred to as: Toast, banner, notification toast banner, overlay messages

Overview

  • Release version
    Yokohama
  • Available sinceMadrid
  • A11Y WCAG 2.1 AA

When to use

Use mobile alerts to display simple, essential messages where no response is required, such as success, error or important info notifications.

When not to use

Avoid using alerts when you need dynamic content, a customized layout, or multiple actions. In those cases, use mobile pop-ups instead, as alerts are limited to fixed layouts and single-message interactions.


Overview

A mobile alert typically refers to a specific type of pop-up message that is commonly used to display essential information, warnings, or errors to users. Mobile alerts usually consist of a title, a message, and a button for the user to acknowledge or dismiss the alert. The layout of alert is not configurable, but you can define the text.

Use cases for using mobile alerts

  • User notifications upon action success: Alerts are often used to notify users about valuable information, such as successful actions. For example, “Item added to cart”.
  • User notifications upon action failure: Alerts can display detailed error messages to users when something goes wrong, helping them understand the issue and take appropriate action. For example, “Creation of a new incident failed due to signal loss”.
  • Confirmation dialog upon button tap: Alerts are used to confirm actions that might have significant consequences, like confirming if a user wants to delete a file or to log out of their account.
  • Displaying information over a record screen: A mobile alert can display an important message and a button to redirect you to an alternative screen. This mobile alert is an overlay pop-up window that displays over a record screen. over a record screen.

Note: When the use case is a simple confirmation of an action and a Yes or No response is required, then mobile alerts and mobile pop-ups can be used. For more involved messages that require dynamic text and a customizable look-and-feel, then mobile pop-ups should be used.

Mobile alerts