Warning Messages

Full-page Warnings block the user from entering/continuing a flow.
Page-level Warnings are less urgent, but contain information users need to address.

Web

When to Use

Use a Full-page Warning

  • When access is restricted or data is unavailable.
  • When the page can’t be found ( a 404 page)

Use a Page-level Warning

  • To alert the user of information that may be unrelated to the current task.
  • If there is system maintenance causing issues.
  • When there are problems to take care of that were¬†detected after the related interaction.

When not to use Warning Messages:

  • For marketing purposes
  • For form-level error messaging
  • For app recommendations
  • For in-product or feature discovery

Appearance & Behavior

Full-page warnings

  • Display the warning in the center of the page (regular or trowser).
  • Use the yellow warning icon.
  • Indicate and focus on what the user can do to fix the error or proceed.
warnings_page

Page-level warnings

  • Display at the top of a page, underneath the header.
  • Use the yellow warning icon.
page-level-warning in a page with stage

Example of a page-level warning in the context

 

iOS

When to Use

Use warning messages when access to a feature or page is restricted or there is a problem with a feature’s data.

Appearance & Behavior

Page-level warnings

iPad Warning (wireframe)

iPad Warning (wireframe)

Text Guidelines

  • Warning message capitalization is sentence case
© Intuit 2016 | Terms of use