Communicating state for Stripe Apps
Learn how to guide users to take actions in your app.
Keep the user informed by showing them when they need to take a certain action.
Before you begin
Suggested use
- Use a Toast component to provide temporary feedback after users take an action.
- Use a Banner component to show users they need to take action on unexpected system-level requirements, changes, or issues. For example:
Examples
Consider the following attributes when choosing to deliver a message.
Toast | Banner | |
---|---|---|
Display | Temporary All toasts trigger on users’ actions. Toasts dismiss automatically after a short period or when the app closes. | Persistent You can deliver banners at any time. Dismissing a banner requires an action. |
Content | Limited text length Messages for toasts should be short, and fewer than four words on one line. The maximum character length for a toast is 30. | Medium to long message Banners contain title and body text. Banners are suitable for providing information with additional details. |
Action | Optional Provide an action as a shortcut for users to quickly enter the related event. | Required Inform users to take the required action. |
Position | Bottom of the app drawer | Under app drawer header |