Notification - Continue exploring designs for multiple inline notifications at a page-level

[KennyAtHPE]

This is in "converging" mode.

Building off #2788 Working file

---

Problem statement

Currently, the design system offers designs and guidance only for singular inline notifications. There are currently multiple platforms with use cases that require more than one inline notification specifically at a page-level.

How might we display multiple inline notifications at a page-level so that users are able to quickly and confidently ascertain how many notifications there are, which ones require their attention the most, and if applicable, what is and how to solve the issue?

Out of scope

• How to show multiple notifications at a global and sectional level?
• How do notifications relate to a notification center?

Deliverables

• [ ] Continue exploration of designs and answers to lingering questions
• [ ] Choose 2-3 designs that fit the success criteria to move forward with
• [ ] Share out with team
• [ ] Create a follow-up ticket to work with devs to enhance the current or create a new Grommet component

---

Success criteria

Final design for multiple inline notifications should be:

• Discoverable + Visible - Users should be able to quickly tell how many notifications are present and what their severities are - Align hierarchically (placement + visually) - Prominent but should not replace the main content of the page
• Accessible - Must at least meet WCAG level “AA” requirements - Tested and approved by Bill
• Visually and systemically aligned with other notifications and established DS patterns

Areas to explore

The following questions should be explored and answered before design can be finalized:

• Using our navigation guidance, where should page-level notifications appear and what pages should the content refer too?
• Should the current guidance be updated to include messages that are longer than two lines? - How would this look? Accordion, expand/collapse, shown all at once, etc. - What’s the limit? - Should this only be reserved for page-level notifications?
• Should there be an optional datetime stamp?
• Should there be and if so what is the limit on how many inline notifications can be shown together at once?
• How should multiple inline notifications be prioritized? Severity, persistence, time, required action, etc.