Hello devs and list lurkers
One of the remaining big tasks we have scheduled for Roundcube 1.0 is the re-location of the status messages: http://trac.roundcube.net/ticket/1488974
Many people complained that the location at the bottom of the screen is somewhat out of the user's sight and the messages itself are not visible enough.
Please find attached a suggestion to refactor the status messages into stacked popups but still located at the bottom of the window.
What do thou think?
Kind regards, Thomas
What do thou think?
I dont think the exact location is very important. Im just happy to see all notifications be the same box. Can't wait for this to be merged in.
I personally would have chosen top right, even if it overlaps some UI elements, because thats where pretty much everything else puts it. But again, any location will do really as long as its visible enough.
Cor
Am 17.11.2013 20:29, schrieb Thomas Bruederli:
One of the remaining big tasks we have scheduled for Roundcube 1.0 is the re-location of the status messages: http://trac.roundcube.net/ticket/1488974
Many people complained that the location at the bottom of the screen is somewhat out of the user's sight and the messages itself are not visible enough.
I've never seen such messages in Classic anyway. Don't they exist there?
Cheers,
Michael Heydekamp Co-Admin freexp.de Düsseldorf/Germany
On 11/18/2013 01:49 AM, Michael Heydekamp wrote:
I've never seen such messages in Classic anyway. Don't they exist there?
These are the messages displayed on top-center of the classic UI. You've seen them for sure, e.g. "Loading..." message.
On 11/17/2013 08:29 PM, Thomas Bruederli wrote:
What do thou think?
I like that. The position is fine. I'd try also with black background (like menus), maybe with some opacity.
A.L.E.C wrote:
On 11/17/2013 08:29 PM, Thomas Bruederli wrote:
What do thou think?
I like that. The position is fine. I'd try also with black background (like menus), maybe with some opacity.
Just tried. Visibility is definitely higher but colored texts are slightly harder to read. Although I haven't adapted the icon colors yet.
~Thomas
On 11/18/2013 09:07 AM, Thomas Bruederli wrote:
I like that. The position is fine. I'd try also with black background (like menus), maybe with some opacity.
Just tried. Visibility is definitely higher but colored texts are slightly harder to read. Although I haven't adapted the icon colors yet.
Maybe text colors should be brighter, but that's does not look bad. I'd also propose to try without colored border.
On 18 Nov 2013, at 09:25, A.L.E.C alec@alec.pl wrote:
On 11/18/2013 09:07 AM, Thomas Bruederli wrote:
I like that. The position is fine. I'd try also with black background (like menus), maybe with some opacity.
Just tried. Visibility is definitely higher but colored texts are slightly harder to read. Although I haven't adapted the icon colors yet.
Maybe text colors should be brighter, but that's does not look bad. I'd also propose to try without colored border.
Or maybe use a box shadow like: box-shadow: 0px 0px 15px 3px rgba(65,232,23,0.54); (for green)
Cor
Cor Bosman wrote:
On 18 Nov 2013, at 09:25, A.L.E.C alec@alec.pl wrote:
On 11/18/2013 09:07 AM, Thomas Bruederli wrote:
I like that. The position is fine. I'd try also with black background (like menus), maybe with some opacity.
Just tried. Visibility is definitely higher but colored texts are slightly harder to read. Although I haven't adapted the icon colors yet.
Maybe text colors should be brighter, but that's does not look bad. I'd also propose to try without colored border.
Or maybe use a box shadow like: box-shadow: 0px 0px 15px 3px rgba(65,232,23,0.54); (for green)
OK, here's another try: brighter colors, no borders but colored shadows. This time I copied the styles to jsfiddle to let you try it yourself and fiddle around with it: http://jsfiddle.net/F984A/
~Thomas
Or maybe use a box shadow like: box-shadow: 0px 0px 15px 3px rgba(65,232,23,0.54); (for green)
OK, here's another try: brighter colors, no borders but colored shadows. This time I copied the styles to jsfiddle to let you try it yourself and fiddle around with it: http://jsfiddle.net/F984A/
Looks great! The dark works great with these colors.
Cor
On 11/18/2013 08:06 PM, Cor Bosman wrote:
Looks great! The dark works great with these colors.
Too fancy for me. See this http://jsfiddle.net/68T7K/
On Monday 18 November 2013 20:15:00 A.L.E.C wrote:
Too fancy for me. See this http://jsfiddle.net/68T7K/
I prefer this without border glow as well.
Kind Regards, Torsten
A.L.E.C wrote:
On 11/18/2013 08:06 PM, Cor Bosman wrote:
Looks great! The dark works great with these colors.
Too fancy for me. See this http://jsfiddle.net/68T7K/
fancy = more visible, no?
~Thomas
On 19-11-13 12:52, Thomas Bruederli wrote:
A.L.E.C wrote:
Too fancy for me. See this http://jsfiddle.net/68T7K/
fancy = more visible, no?
I like Alec's version more, the contrast of the text versus the background is slightly better and I don't think the colored glow of Thomas' version really contributes to the visibility of the messages.
Kind regards, Geert Wirken
Geert Wirken wrote:
On 19-11-13 12:52, Thomas Bruederli wrote:
A.L.E.C wrote:
Too fancy for me. See this http://jsfiddle.net/68T7K/
fancy = more visible, no?
I like Alec's version more, the contrast of the text versus the background is slightly better and I don't think the colored glow of Thomas' version really contributes to the visibility of the messages.
Thanks for the feedback!
I think we're getting closer to a conclusion. See the latest update with a slightly larger font here: http://jsfiddle.net/F984A/10/
~Thomas
Hello,
I suggest bigger font size, ex: 14px ? And a little bit wider box: 295px
Rgds, Gabor
On Nov 19, 2013, at 5:04 PM, Thomas Bruederli thomas@roundcube.net wrote:
Geert Wirken wrote:
On 19-11-13 12:52, Thomas Bruederli wrote:
A.L.E.C wrote:
Too fancy for me. See this http://jsfiddle.net/68T7K/
fancy = more visible, no?
I like Alec's version more, the contrast of the text versus the background is slightly better and I don't think the colored glow of Thomas' version really contributes to the visibility of the messages.
Thanks for the feedback!
I think we're getting closer to a conclusion. See the latest update with a slightly larger font here: http://jsfiddle.net/F984A/10/
~Thomas
Roundcube Development discussion mailing list dev@lists.roundcube.net http://lists.roundcube.net/mailman/listinfo/dev
On 11/19/2013 05:04 PM, Thomas Bruederli wrote:
I think we're getting closer to a conclusion. See the latest update with a slightly larger font here: http://jsfiddle.net/F984A/10/
So, you're proposing 12px instead of 11px used for text in Larry. I'm not sure we need messages text to be bigger. I see still some small padding fixes to be done and probably some alignment of right/bottom of #messagestack, but you can implement what we have now.
On 20 Nov 2013, at 09:11, A.L.E.C alec@alec.pl wrote:
On 11/19/2013 05:04 PM, Thomas Bruederli wrote:
I think we're getting closer to a conclusion. See the latest update with a slightly larger font here: http://jsfiddle.net/F984A/10/
So, you're proposing 12px instead of 11px used for text in Larry. I'm not sure we need messages text to be bigger. I see still some small padding fixes to be done and probably some alignment of right/bottom of #messagestack, but you can implement what we have now.
This will work instead of the current messages right? No need to change any code for plugins?
Cor
On 11/20/2013 09:19 AM, Cor Bosman wrote:
This will work instead of the current messages right? No need to change any code for plugins?
Well, #message.statusbar style will be not needed anymore, but we should re-use current <div id="message"> element. Maybe we should just remove #message.statusbar style. That should be backward compatible change, I think.
.iframebox 'bottom' style will be changed to 0.
A.L.E.C wrote:
On 11/20/2013 09:19 AM, Cor Bosman wrote:
This will work instead of the current messages right? No need to change any code for plugins?
Basically, yes.
Well, #message.statusbar style will be not needed anymore, but we should re-use current <div id="message"> element. Maybe we should just remove #message.statusbar style. That should be backward compatible change, I think.
The #message.statusbar usually was nested in some containers whereas the the new messagestack has to be on top level.
Just to keep things compatible for plugins, I'd leave these styles in css.
~Thomas
On 11/19/2013 05:04 PM, Thomas Bruederli wrote:
I think we're getting closer to a conclusion. See the latest update with a slightly larger font here: http://jsfiddle.net/F984A/10/
Now when I see it live I think 12px is too much. I'll change to 11px with some small improvements.
A.L.E.C wrote:
On 11/19/2013 05:04 PM, Thomas Bruederli wrote:
I think we're getting closer to a conclusion. See the latest update with a slightly larger font here: http://jsfiddle.net/F984A/10/
Now when I see it live I think 12px is too much. I'll change to 11px with some small improvements.
I don't agree. Colored text on dark background is less readable than black on white. The larger font is supposed to compensate that which it IMO does.
And what are "some small improvements"?
~Thomas
On 11/22/2013 09:52 AM, Thomas Bruederli wrote:
I don't agree. Colored text on dark background is less readable than black on white. The larger font is supposed to compensate that which it IMO does.
I do not think the text is less readable, but if so maybe make it more brighter.
And what are "some small improvements"?
well, I'd like to move container few pixels to the left (so right border is not above other element border) and move info icon a few pixels down (it's not aligned with text). I'd also consider smaller (not much) opacity value.
A.L.E.C wrote:
On 11/22/2013 09:52 AM, Thomas Bruederli wrote:
I don't agree. Colored text on dark background is less readable than black on white. The larger font is supposed to compensate that which it IMO does.
I do not think the text is less readable, but if so maybe make it more brighter.
Making them brighter will result in pastel colors which I don't really consider adorable. But that's probably a matter of personal taste.
And what are "some small improvements"?
well, I'd like to move container few pixels to the left (so right border is not above other element border)
Done.
and move info icon a few pixels down (it's not aligned with text).
Done.
I'd also consider smaller (not much) opacity value.
I'm using the opacity value from your jsfiddle ;-) By smaller you mean less opaque and more transparent? That would again reduce readability...
~Thomas
I really think it's fine now seeing Thomas's latest version. Details is something you can endlessly discuss, but with design, 10 people will have 10 opinion. You can always tweak things afterwards based on user response. The main problem has been solved.
Cor
Am 22.11.2013 10:47, schrieb Thomas Bruederli:
A.L.E.C wrote:
On 11/22/2013 09:52 AM, Thomas Bruederli wrote:
I don't agree. Colored text on dark background is less readable than black on white. The larger font is supposed to compensate that which it IMO does.
I do not think the text is less readable, but if so maybe make it more brighter.
Making them brighter will result in pastel colors which I don't really consider adorable. But that's probably a matter of personal taste.
And what are "some small improvements"?
well, I'd like to move container few pixels to the left (so right border is not above other element border)
Done.
and move info icon a few pixels down (it's not aligned with text).
Done.
I'd also consider smaller (not much) opacity value.
I'm using the opacity value from your jsfiddle ;-) By smaller you mean less opaque and more transparent? That would again reduce readability...
28 messages already about colors, pixels, opacity, transparency, brightness, font size - I'd wish I'd have your problems... (in German: "Eure Probleme möchte ich haben...").
Is anyone still open to a discussion about the more technical side of things? E.g. indicating attachments in the message list of multipart/alternative messages with a nested multipart/mixed part? Or "least invasive" charset declarations (e.g. declaring "US-ASCII" or "ISO-8859-1" rather than "UTF-8" if "US-ASCII" or "ISO-8859-1" would be "just enough" - and yes, I know that "UTF-8" is always correct)?
Cheers and <sigh>,
Michael Heydekamp Co-Admin freexp.de Düsseldorf/Germany
On 11/23/2013 11:19 PM, Michael Heydekamp wrote:
28 messages already about colors, pixels, opacity, transparency, brightness, font size - I'd wish I'd have your problems... (in German: "Eure Probleme möchte ich haben...").
Well, nothing new here. Simple subject gets more feedback.
Is anyone still open to a discussion about the more technical side of things? E.g. indicating attachments in the message list of multipart/alternative messages with a nested multipart/mixed part? Or "least invasive" charset declarations (e.g. declaring "US-ASCII" or "ISO-8859-1" rather than "UTF-8" if "US-ASCII" or "ISO-8859-1" would be "just enough" - and yes, I know that "UTF-8" is always correct)?
Not much to discuss here.
Am 24.11.2013 09:50, schrieb A.L.E.C:
On 11/23/2013 11:19 PM, Michael Heydekamp wrote:
28 messages already about colors, pixels, opacity, transparency, brightness, font size - I'd wish I'd have your problems... (in German: "Eure Probleme möchte ich haben...").
Well, nothing new here. Simple subject gets more feedback.
Ah, THAT is the rule...! Didn't know that, expected it to be vice versa.
Is anyone still open to a discussion about the more technical side of things? E.g. indicating attachments in the message list of multipart/alternative messages with a nested multipart/mixed part? Or "least invasive" charset declarations (e.g. declaring "US-ASCII" or "ISO-8859-1" rather than "UTF-8" if "US-ASCII" or "ISO-8859-1" would be "just enough" - and yes, I know that "UTF-8" is always correct)?
Not much to discuss here.
I beg to differ.
Cheers,
Michael Heydekamp Co-Admin freexp.de Düsseldorf/Germany
I'd like us to consider also removing redundant jquery-ui dialogs on error messages or display only dialogs.
I don't have a strong opinion about which one to choose, but we should choose anyone.
There's also a small issue with this, the jquery-ui dialog disapears sooner than the message in right-bottom corner. Not a problem if we decide to remove one of error message elements.
On Friday, November 22, 2013, A.L.E.C wrote:
I'd like us to consider also removing redundant jquery-ui dialogs on error messages or display only dialogs.
Yes, that's indeed something to consider.
The reason these popups appear on errors is because of the previously less visible status messages. That now has improved and maybe it's good enough without popups. But still, errors should not happen and if they do, the error messages must not be missed by the user. That's why I decided to keep them even after the recent improvements.
I don't have a strong opinion about which one to choose, but we should choose anyone.
Displaying dialogs for every message, especially confirmations is definitely not the way to go. That would be way too intrusive and annoying.
There's also a small issue with this, the jquery-ui dialog disapears sooner than the message in right-bottom corner. Not a problem if we decide to remove one of error message elements.
That's true and it always was that way. The popup is meant to catch the user's attention about an error and it then moves away towards the right (previously towards the status bar at the bottom) where the error message is still visible and can be read again and again. I don't think that's too bad.
~Thomas
On 11/22/2013 06:42 PM, Thomas Bruederli wrote:
Displaying dialogs for every message, especially confirmations is definitely not the way to go. That would be way too intrusive and annoying.
We display dialogs for errors only, but still these are redundant. I propose to keep error dialogs but get rid of error messages in right-bottom corner.
There's also a small issue with this, the jquery-ui dialog disapears sooner than the message in right-bottom corner. Not a problem if we decide to remove one of error message elements.
That's true and it always was that way. The popup is meant to catch the user's attention about an error and it then moves away towards the right (previously towards the status bar at the bottom) where the error message is still visible and can be read again and again. I don't think that's too bad.
Well, that was good for status bar, but now we have two popups with same content, it looks more strange.
-
A.L.E.C -
Cor Bosman -
Geert Wirken -
JugITer WebHosting -
Michael Heydekamp -
Thomas Bruederli -
Torsten Grote