[wp-trac] [WordPress Trac] #44391: Improving the notification badges in admin menu

[WordPress Trac]

#44391: Improving the notification badges in admin menu
-----------------------------------------+------------------------------
 Reporter:  hedgefield                   |       Owner:  hedgefield
     Type:  enhancement                  |      Status:  assigned
 Priority:  normal                       |   Milestone:  Awaiting Review
Component:  Administration               |     Version:  trunk
 Severity:  normal                       |  Resolution:
 Keywords:  ui-feedback has-screenshots  |     Focuses:
-----------------------------------------+------------------------------
Changes (by SergeyBiryukov):

 * component:  Menus => Administration


Old description:

> During the WCEU contributor day we received the request from the A11y
> team to look at the notification badges in the admin menu. Their red
> color and lack of context was seen as something that could be improved.
>
> So together with Jayman Pandya, Rich Copping, Jasper Cheyney and Vasilis
> Baimas we looked at different ways to improve this. We first explored
> ways to add more context with text or expandable rollovers or tooltips,
> but agreed that this was not good. So we focused on improving the styling
> itself.
>
> I've attached the design explorations we did below. By moving the badge
> onto the icon, adding a border and optionally omitting the number (this
> should be tested), we felt like this would be a nice improvement for the
> visually impaired, as well as a more calming design layout.
>
> Adrian Roselli took a look and agreed that this would be a good
> improvement, with his preference also going to design 3 and 4 (with 1
> being the current situation).
>
> We will try to make a PR for this if this sounds like a good idea to you
> all too. Putting the badge on the icon is also a nice step towards the
> pattern of the notification center proposal:
> https://core.trac.wordpress.org/ticket/43484

New description:

 During the WCEU contributor day we received the request from the A11y team
 to look at the notification badges in the admin menu. Their red color and
 lack of context was seen as something that could be improved.

 So together with Jayman Pandya, Rich Copping, Jasper Cheyney and Vasilis
 Baimas we looked at different ways to improve this. We first explored ways
 to add more context with text or expandable rollovers or tooltips, but
 agreed that this was not good. So we focused on improving the styling
 itself.

 I've attached the design explorations we did below. By moving the badge
 onto the icon, adding a border and optionally omitting the number (this
 should be tested), we felt like this would be a nice improvement for the
 visually impaired, as well as a more calming design layout.

 Adrian Roselli took a look and agreed that this would be a good
 improvement, with his preference also going to design 3 and 4 (with 1
 being the current situation).

 We will try to make a PR for this if this sounds like a good idea to you
 all too. Putting the badge on the icon is also a nice step towards the
 pattern of the notification center proposal: #43484

--

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/44391#comment:7>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform