# Notification menu: merge green and blue notification bubbles into just blue
**URL:** https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219
**Category:** UX
**Created:** [10월 16, 2017, 9:14오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219 "2017-10-16T21:14:58Z")
**Posts on this page:** 18
**Page:** 1
### Author:  [@tobiaseigen](https://meta.discourse.org/u/tobiaseigen)
#### Post date: [10월 16, 2017, 9:14오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/1 "2017-10-16T21:14:58Z")
In [this same conversation](https://meta.discourse.org/t/add-dismiss-all-link-on-notifications-menu-like-facebook/72210) with a colleague, she told me she was confused by the green and blue notification bubbles. She could not figure out what the colors represent, and she was especially confused because she had alot of both of them. In this case, she has moderator privileges but does not log in often - mostly she participates by email.
Correct me if I’m wrong, but besides the red flag-related bubbles, I think the green notification bubble only shows how many new personal messages you have while the blue notification bubbles are for everything else.
I know there are probably very good reasons for having a separate green bubble for personal messages, but in my community I don’t think there is any need and they are confusing. Perhaps an admin setting could be provided to simplify the UX and just display a single blue bubble indicating the number of new notifications?
---
### Author:  [@mikechristopher](https://meta.discourse.org/u/mikechristopher)
#### Post date: [10월 16, 2017, 9:21오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/2 "2017-10-16T21:21:33Z")
I think the green ones are more vital than blue as it’s a personal message rather than just a notification of which sometimes are not really needed to actively jump on and look at just like the red ones are. I understand your need but not sure there are many communities that would want to overlook PMs being sent.
---
### Author:  [@tobiaseigen](https://meta.discourse.org/u/tobiaseigen)
#### Post date: [10월 16, 2017, 9:30오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/3 "2017-10-16T21:30:30Z")
Thanks. I figured that was the idea behind it. But I honestly don’t think it makes any difference in practice, on any site… except maybe support oriented sites and then not for users but for staff. For users, how do they figure out what the colors mean?
---
### Author:  [@HAWK](https://meta.discourse.org/u/HAWK)
#### Post date: [10월 16, 2017, 9:33오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/4 "2017-10-16T21:33:51Z")
Yeah, it’s crucial to the way we use Discourse (support as you mention).
> [@tobiaseigen](#):
>
> For users, how do they figure out what the colors mean?
By going there once? Unless there is already a mental model in place, everyone has to learn something the first time.
---
### Author:  [@erlend\_sh](https://meta.discourse.org/u/erlend_sh)
#### Post date: [10월 17, 2017, 7:02오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/5 "2017-10-17T19:02:37Z")
This will become easier to intuit if we ever apply more structure to the notifications tab:
> [@Structured notifications tab](https://meta.discourse.org/t/structured-notifications-tab/60497):
>
> I find my notifications tab to be a bit messy. I wish it would list my notifications in order of importance. Something along the lines of: Messages Group messages Private messages Post interactions Replies Mentions Topic invite Incoming link Post edits Misc. activities Earned badge Received like It would look like this: (accidentally used an old screenshot where we hadn’t yet merged the notifications & profile tabs!) The “push it off-screen” logic would have to be something li…
Then you’d immediately see that the green (2) corresponds with the 2 PMs you’ve received.
---
### Author:  [@david](https://meta.discourse.org/u/david)
#### Post date: [10월 17, 2017, 7:18오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/6 "2017-10-17T19:18:15Z")
Maybe this could also tie into what @nbianca has been working on here:
[https://github.com/discourse/discourse/pull/4733#issuecomment-327006522](https://github.com/discourse/discourse/pull/4733#issuecomment-327006522)
So you could have the notification bubbles attributed to each of the new “tabs”:
(apologies for the awful looking bubbles)
---
### Author:  [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 18, 2017, 1:52오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/7 "2017-10-18T13:52:12Z")
A Problem is… The bubble is green but the notification lines for messages are still blue. This may be confusing.
At least make those lines green to match.
---
### Author:  [@tobiaseigen](https://meta.discourse.org/u/tobiaseigen)
#### Post date: [10월 18, 2017, 2:18오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/8 "2017-10-18T14:18:17Z")
> [@David\_Taylor](#):
>
> So you could have the notification bubbles attributed to each of the new “tabs”:
This is an interesting idea but to me it just reinforces the sense of information overload. Maybe if the avatar just had one bubble, or had blue and green rings with no numbers? (I like the way the who’s online plugin displays rings around avatars)
> [@schungx](#):
>
> At least make those lines green to match.
That’s not a bad idea. I like it, as long as the colors are not so bright as to become a distraction.
My point with this topic is that for the ordinary civilians in my community, the distinction between messages and other notifications is irrelevant. They just don’t care and find it confusing to see two bubbles. I can’t speak for other communities and obviously agree that for myself as admin/moderator it is important to see the personal messages. But I honestly also don’t need to see two bubbles to know it’s time to go to my inbox to go through my messages.
Anyhoo, bike shedding and all that. I don’t think this is so important that it needs any big structural changes. I am understanding notifications much better now and appreciate the effort discourse is taking to make sure that important notifications don’t get lost. Maybe simply making the notifications [easier to dismiss](https://meta.discourse.org/t/add-dismiss-all-link-on-notifications-menu-like-facebook/72210) so people can start fresh will resolve most of the concerns in my community. It’s only when there are hundreds that it seems to get weird for folks.
---
### Author:  [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 18, 2017, 2:20오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/9 "2017-10-18T14:20:22Z")
Blue bubble = blue lines
Green bubble = green lines
Then people natively understand.
Blue bubble = Some blue lines
Green bubble = Other blue lines
People get confused.
---
### Author:  [@tobiaseigen](https://meta.discourse.org/u/tobiaseigen)
#### Post date: [10월 18, 2017, 2:23오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/10 "2017-10-18T14:23:09Z")
Yeah - I get your suggestion. This is an interesting idea and it might work.
I wonder if there a CSS method to try it out?
---
### Author:  [@david](https://meta.discourse.org/u/david)
#### Post date: [10월 18, 2017, 2:36오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/11 "2017-10-18T14:36:55Z")
> [@tobiaseigen](#):
>
> I wonder if there a CSS method to try it out?
```plaintext
.notifications i.d-icon-envelope-o + div {
color: green;
}
```
Is that what you had in mind @schungx? Or were you thinking about adjusting the mouseover colour?
---
### Author:  [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 18, 2017, 2:40오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/12 "2017-10-18T14:40:35Z")
Making the text green is ok, but the most important thing is the make the _unread messages background_ green. That is because the green bubble shows the count of _unread messages_.
The read background is always white.
EDIT: The background is set on the `.notifications li` element and there is nothing to distinguish messages from other notifications. I don’t think it is currently possible with a pure CSS solution without adding a class to the `li` element.
---
### Author:  [@jomaxro](https://meta.discourse.org/u/jomaxro)
#### Post date: [10월 18, 2017, 2:51오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/13 "2017-10-18T14:51:10Z")
Something like this? (Pretend that highlight is on a PM not a like, I just didn’t have any PMs handy).
Edit: You are correct that there is no differentiation at the moment between notification types in the HTML, but that could likely change 😉.
---
### Author:  [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 18, 2017, 2:52오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/14 "2017-10-18T14:52:54Z")
[ ](https://global.discourse-cdn.com/meta/original/3X/c/a/ca04aee491d4696515415ea245221ed98622950f.png)
Yup. 👏
---
### Author:  [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 18, 2017, 2:54오후 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/15 "2017-10-18T14:54:18Z")
> [@jomaxro](#):
>
> You are correct that there is no differentiation at the moment between notification types in the HTML, but that could likely change
Well, you’re [@team](https://meta.discourse.org/groups/team) and of course it can likely change. _wink wink knudge knudge say no more_
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [10월 19, 2017, 2:00오전 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/17 "2017-10-19T02:00:18Z")
No, random color changes are not a good idea here. More colors is not more betterer.
---
### Author:  [@schungx](https://meta.discourse.org/u/schungx)
#### Post date: [10월 19, 2017, 2:08오전 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/20 "2017-10-19T02:08:17Z")
True, but if color is used to distinguish things it helps to be consistent. You already have two color bubbles.
---
### Author:  [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [10월 19, 2017, 2:08오전 UTC](https://meta.discourse.org/t/notification-menu-merge-green-and-blue-notification-bubbles-into-just-blue/72219/21 "2017-10-19T02:08:54Z")
This will not be happening.