[Patternfly] Notification/Alert

Mon Apr 6 14:04:28 UTC 2015

Hi Gabriel,

Matt and I discussed this with Kyle a while ago and we agreed on some basic design concepts of global notification and error messages. Are you working on global notification specifically?

Here is what we have for now:
Basic concepts: https://docs.google.com/a/redhat.com/presentation/d/13BIWhY_uWl_DKy8qHTzpugCL7jkatzT7lxlcKShuzBY/edit#slide=id.p
Some mockups (we haven't finalized/tested): https://docs.google.com/a/redhat.com/presentation/d/1N262pkxAYMOHS8O6xFvDszFzpLrl7_2mIWrasSk4fLg/edit#slide=id.p
Let me know if you have any questions.

We haven't officially proposed this to the EAP team since this is not our top priority. If you have any suggestions about this, feel free to let me know.
For more ideas about notification (Sent by Luke Brooker): http://tympanus.net/Development/NotificationStyles/bar-exploader.html

Thanks!
Josephine

----- Original Message -----
From: "Gabriel Cardoso" <gcardoso at redhat.com>
To: "Josephine Qian" <joqian at redhat.com>, patternfly at redhat.com
Sent: Monday, April 6, 2015 9:44:28 AM
Subject: Re: [Patternfly] Notification/Alert

Hello Josephine,

We need to implement feedback messages in a new project (Hawkular), so I wanted to ask you how did you deal with them for EAP. 

Thanks,
Gabriel

> On Feb 6, 2015, at 5:30 PM, Josephine Qian <joqian at redhat.com> wrote:
> 
> Yeah I agree with you about the green bubble. The red bubble looks like there is a breaking news. (maybe it's about the storm!)
> 
> ----- Original Message -----
> From: "Sarahjane Clark" <sclark at redhat.com>
> To: "Josephine Qian" <joqian at redhat.com>
> Cc: "Catherine Robson" <crobson at redhat.com>, patternfly at redhat.com
> Sent: Friday, February 6, 2015 1:56:27 PM
> Subject: Re: [Patternfly] Notification/Alert
> 
> Before we started the next round of testing, it was decided that the messaging/notifications pattern wasn't really ready for prime-time, so we took it out of the testing and iteration rotation.  Participants didn't call out anything specific to the text, I suspect because we were only using success bubbles at that time, so if they saw green they felt they didn't need to investigate further.  
> 
> 
> 
> 
> ----- Original Message -----
> From: "Josephine Qian" <joqian at redhat.com>
> To: "Sarahjane Clark" <sclark at redhat.com>
> Cc: "Catherine Robson" <crobson at redhat.com>, patternfly at redhat.com
> Sent: Friday, February 6, 2015 11:41:25 AM
> Subject: Re: [Patternfly] Notification/Alert
> 
> Hi,
> 
> Nice seeing the usability testing results. Thanks! Do you guys have anything new about the visual treatments that could help color-blind users? I saw this issue was noted on the page, so just curious.
> 
> One more thing is about the contrast. I think the readability might become an issue if we decide to change the background color. I tried to use the red in our color palette for error messages. The bubble looks very prominent but it's a bit hard to read the text on it. Do you remember if any participant mentioned about that?
> 
> Thanks!
> 
> Josephine
> 
> ----- Original Message -----
> From: "Sarahjane Clark" <sclark at redhat.com>
> To: "Josephine Qian" <joqian at redhat.com>
> Cc: "Catherine Robson" <crobson at redhat.com>, patternfly at redhat.com
> Sent: Friday, February 6, 2015 10:42:40 AM
> Subject: Re: [Patternfly] Notification/Alert
> 
> You might be able to get away with a message bubble that size if you change other factors.  We did some testing a while back in Patternfly on messaging using bubbles that are the same size as you show, and the users noticed, and correctly interpreted the message, significantly more often just by changing the background color within the message bubble. 
> 
> https://www.patternfly.org/wikis/patterns/usability-testing/messaging-usability-testing/
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> 
> ----- Original Message -----
> From: "Josephine Qian" <joqian at redhat.com>
> To: "Catherine Robson" <crobson at redhat.com>
> Cc: patternfly at redhat.com
> Sent: Friday, February 6, 2015 9:50:34 AM
> Subject: Re: [Patternfly] Notification/Alert
> 
> Hi,
> 
> Thanks for sharing, Liz and Catherine.
> 
> When I look at the screenshot from OpenStack, it does feel a little bit overwhelming. But if I am the user and all of messages are about the errors that I need to solve, at least I won't miss them easily since they are so prominent. In EAP, the messages look tiny and cute, but it is just so easy to be overlooked (see attachment). And I don't believe it allows messages to stack up, which is something I should consider. Thanks for bringing this up!
> 
> Josephine
> 
> ----- Original Message -----
> From: "Catherine Robson" <crobson at redhat.com>
> To: "Liz Blanchard" <lsurette at redhat.com>
> Cc: "Josephine Qian" <joqian at redhat.com>, patternfly at redhat.com
> Sent: Friday, February 6, 2015 8:05:48 AM
> Subject: Re: [Patternfly] Notification/Alert
> 
> This pattern Liz shows was also used by S-RAMP in the JBoss Fuse Service 
> Works product.  I don't have a screenshot handy.  Depending on how 
> visible the alerts need to be I think this works.  In S-RAMP it was 
> overused and distracting to the user I felt.
> 
> - Catherine
>> Liz Blanchard <mailto:lsurette at redhat.com>
>> February 5, 2015 at 3:35 PM
>> 
>> On Feb 4, 2015, at 4:31 PM, Josephine Qian <joqian at redhat.com 
>> <mailto:joqian at redhat.com>> wrote:
>> 
>>> Hi,
>>> 
>>> I am working on the the notification/alert for JBoss EAP and trying 
>>> to solve some of the issues of the global notification pattern in 
>>> PatternFly. The main issue we found is that the inline alert is not 
>>> shown prominently enough, due to its size and location. And it is 
>>> easy to be overlooked by the user who is away for a few seconds.
>>> 
>>> We have brainstormed some alternative solutions for EAP but I am also 
>>> curious about how notification/alert is designed in other products. I 
>>> know in some cases designers put the alerts in the main content area 
>>> (see attachment), when there is an immediate alert after the user 
>>> does something on a page. But how do we deal with the global 
>>> notification, if we want something different from PatternFly? Has 
>>> anybody designed something similar to Mac's notification on the right?
>>> 
>>> Any thoughts and suggestions will be helpful! Thanks!
>> 
>> Hi Josephine,
>> 
>> Here is a screenshot of how upstream OpenStack handles global 
>> notifications today…
>> http://people.redhat.com/~lsurette/OpenStack/Clear%20All%20Errors 
>> <http://people.redhat.com/%7Elsurette/OpenStack/Clear%20All%20Errors>
>> 
>> Not that it’s the best solution (the content can especially be 
>> improved), but it allows errors/warnings/information to stack up. I 
>> think they stick around for 5 seconds unless the user closes them. I 
>> find this very similar to the mac notifications you mentioned.
>> 
>> Let me know if you’d like to chat any further about this design.
>> 
>> Thanks,
>> Liz
>> 
>>> 
>>> 
>>> Josephine<alert.png>_______________________________________________
>>> Patternfly mailing list
>>> Patternfly at redhat.com <mailto:Patternfly at redhat.com>
>>> https://www.redhat.com/mailman/listinfo/patternfly
>> 
>> _______________________________________________
>> Patternfly mailing list
>> Patternfly at redhat.com
>> https://www.redhat.com/mailman/listinfo/patternfly
>> Josephine Qian <mailto:joqian at redhat.com>
>> February 4, 2015 at 4:31 PM
>> Hi,
>> 
>> I am working on the the notification/alert for JBoss EAP and trying to 
>> solve some of the issues of the global notification pattern in 
>> PatternFly. The main issue we found is that the inline alert is not 
>> shown prominently enough, due to its size and location. And it is easy 
>> to be overlooked by the user who is away for a few seconds.
>> 
>> We have brainstormed some alternative solutions for EAP but I am also 
>> curious about how notification/alert is designed in other products. I 
>> know in some cases designers put the alerts in the main content area 
>> (see attachment), when there is an immediate alert after the user does 
>> something on a page. But how do we deal with the global notification, 
>> if we want something different from PatternFly? Has anybody designed 
>> something similar to Mac's notification on the right?
>> 
>> Any thoughts and suggestions will be helpful! Thanks!
>> 
>> 
>> Josephine
>> _______________________________________________
>> Patternfly mailing list
>> Patternfly at redhat.com
>> https://www.redhat.com/mailman/listinfo/patternfly
> 
> -- 
> Catherine Robson
> User Experience Design
> Red Hat JBoss Middleware
> c: 978-944-3825
> 
> 
> _______________________________________________
> Patternfly mailing list
> Patternfly at redhat.com
> https://www.redhat.com/mailman/listinfo/patternfly
> <Red bubble.png>_______________________________________________
> Patternfly mailing list
> Patternfly at redhat.com
> https://www.redhat.com/mailman/listinfo/patternfly

---
Gabriel Cardoso
User Experience Designer @ Red Hat