Closed Bug 347541 Opened 18 years ago Closed 15 years ago

Toolbar icons have too little contrast

Categories

(Firefox :: Theme, defect)

2.0 Branch
x86
Windows XP
defect
Not set
normal

Tracking

()

RESOLVED WORKSFORME
Firefox 2

People

(Reporter: mossop, Unassigned)

References

Details

(Whiteboard: [Fx2 theme change])

Attachments

(2 files)

The new toolbar icons are too light making it difficult to make out what the icons actually are. The original screenshots at http://wiki.mozilla.org/FX2_Visual_Update/Default_Theme_Update look great, but the icons shown there are actually the hover effects for the toolbar buttons. It might be better to use those as the standard and maybe use the lighter variants for the hover effect, or create even darker ones for the hover.
Lovely design but they should have deeper colors indeed.
I would argue that all of the toolbar icons look horrible when small icons are enabled. They're are extremely grainy looking and have a rushed to get done feel to them (even the large icons have that feeling). 1) Not all icons are the same size (toolbar and options) 2) Some icons show color outside the icon which looks sloppy and shouldn't be the case 3) Some icons are clipped and aren't centered properly in Tools->Options Here is a small example of the sloppiness: http://img446.imageshack.us/img446/327/reloadhv9.png Here is a professional looking reload icon that could certainly be tweaked to include shadows, offsetting, etc.: http://img446.imageshack.us/img446/6629/winstripereloadiconmodifiedgd9.png ~B
(In reply to Description) ... > It might be better to use those as the standard and maybe use the lighter > variants for the hover effect, or create even darker ones for the hover. Or just not change contrast at all when you hover over an icon. You don't need to. Just use a bevel effect. (In reply to comment #2) ... > Here is a small example of the sloppiness: > http://img446.imageshack.us/img446/327/reloadhv9.png > > Here is a professional looking reload icon that could certainly be tweaked to > include shadows, offsetting, etc.: > http://img446.imageshack.us/img446/6629/winstripereloadiconmodifiedgd9.png Bryan, Could you please explain what you mean by 'the sloppiness' there? You've scaled up a rather small raster image and compared it with a scaled vector image and I'm not exactly sure what your point is. The biggest problem I have with that particular icon is the top arrow being lighter than the bottom one. The current reload icon is nicer.
The first problem is, that the toolbar images have a default opacity of (only) 80% (100% when hovering them). The second problem is, that the small icons look like scaled versions of the big ones. They should instead be redone at the smaller size. The third problem is, that the color of the reload button "bleeds out". These buttons currently look like transparent plastic buttons and in reality it would be impossible, that color bleeds out. It looks quite unrealistic.
Attached image screenshot comparison (deleted) —
I made a screenshot comparison what it would look like if the hover state would be used instead.
Ugh. And many of the icons *still* look too washed out and lacking in colour, IMHO. Many of them have a lighter top/left than bottom/right, apparently to give this 'glass' effect. I hate it. Give me the old Winstripe anyday.
I agree, in previous versions users could use both the colour and shape of the icon to decide which was which quickly, easily and with as little thought or focus required (letting them get on with their browsing). Now with half of the buttons white, and their meanings not particularly clear from the indistinct outline, choosing the right button just isn't as simple as it used to be, which is a step backwards for a browser that should be more interested in usability than "visual refresh" gimmicks to make people realize the browser is a new version.
Nominating. "Navigation buttons look dull/dark/blurry" is the single biggest complaint I've seen about the new theme in our B2 feedback so far. Increasing contrast and saturating the colors more would definitely improve this front.
Flags: blocking-firefox2?
Target Milestone: --- → Firefox 2
http://img59.imageshack.us/img59/7366/image4lw2.png gives a comparison between the new and old buttons that makes it pretty obvious how much more saturated and "crisp" the old buttons look. I like the glass effect on the new buttons, but I think they could be significantly brightened and sharpened.
I'm not sure if this is the right place, but posting it here since it has to do with the new theme's contrast. On Linux(w/default GTK theme) the contrast on the regular/non-current tabs is very poor making it strenuous to read them. As you can see in the image below, the 3 tabs are in 3 different levels of contrast.(the first one is a regular tab.. the second one is with hover/mouseover and the last is the current tab.) http://img520.imageshack.us/my.php?image=ffox2b2qz7.png The current tab is the most legible/clear one and the only time I tend to look at the tabs is when I'm looking to switch to another tab and it takes too much effort to read the text in those tabs. IMO normal vs bold is good enough to differentiate between the current tab and others. maybe a leave the other tabs in the regular background color and make the current one white/bright. but there's no need to make the fonts duller.
(In reply to comment #10) > I'm not sure if this is the right place, but posting it here since it has > to do with the new theme's contrast. > On Linux(w/default GTK theme) the contrast on the regular/non-current tabs > is very poor making it strenuous to read them. This isn't really the right place, as it'll probably be overlooked (or not read) by anyone who can make a difference. There was cross-platform bug 350139, but that was just closed. Maybe bug 351166? Try posting there and if they think your bug is separate, open a new one.
(In reply to comment #8) > Nominating. "Navigation buttons look dull/dark/blurry" is the single biggest > complaint I've seen about the new theme in our B2 feedback so far. Increasing > contrast and saturating the colors more would definitely improve this front. > I've said it before and I'll say it again - you'd do best to forget the opacity change in the icons on mouseover. Icons should be sharp and colourful all the time. Leave their opacity alone, and use a bevel to indicate mouseover. It's a much nicer and more intuative interface than a mere opacity change.
(In reply to comment #10) > I'm not sure if this is the right place No, it's not, and this was fixed by recent changes to the tab strip images.
We're looking at making changes to the icons if there's time, but the theme is definitely in a shippable state at the moment, so this won't block release.
Flags: blocking-firefox2? → blocking-firefox2-
Whiteboard: [Fx2 theme change]
*** Bug 351379 has been marked as a duplicate of this bug. ***
Good one Mike. Just hope you're ready for the barrage of user comments along the lines of 'hey, what happened? This theme is ****!'
(In reply to comment #16) > This theme is shit!' Comments like this arent't usefull. Please read Bugzilla Etiquette - https://bugzilla.mozilla.org/page.cgi?id=etiquette.html If you don't like "new theme", you can install old theme. See: http://kmgerich.com/2006/08/05/firefox-1x-classic-themes-available/
(In reply to comment #14) Yes, the theme seems to be more or less shippable, assuming that a few bugs already marked blocking+ are going to be fixed. But it's only bug-wise. If feedback from the community and wider public on the aspect of visual appeal was ever going to be taken into consideration, then something should really be done about this bug, because as already pointed out, this is THE single biggest complaint that we receive. Especially, as it has always appeared to me that improving the attractiveness and visual appeal was the main goal in throughout.
From a PR/consumer usage point of view, this isn't going to be something you can patch up later on. If you get it wrong on the first release, you can't drastically change it, or the user base are going to ask why you're shifting them about so often. If you do change the style with a 2.5 intermediate release, you're still going to have a large number of the userbase using the 2.0 build. In short, once this goes live, it will be a big issue and it will probably put some people off (especially since it appears to have been designed primarily for windows users, alienating the linux users with many obvious bugs that are now having to be marked as blockers to the main release). The visual identity of the program should really entice people to use the new version than put them off, and ignoring the tester's level of concern over this issue just to make deadlines is probably going to be a mistake...
(In reply to comment #17) > (In reply to comment #16) > > This theme is ****!' > > Comments like this arent't usefull. Please read Bugzilla Etiquette - > https://bugzilla.mozilla.org/page.cgi?id=etiquette.html I'm just predicting what the users are gonna say when they take a look at the bleached-out icons. You just see. > > If you don't like "new theme", you can install old theme. See: > http://kmgerich.com/2006/08/05/firefox-1x-classic-themes-available/ > Yeah, but the average user aint gonna do that. They're gonna live with it, or switch to IE7 if it's bad enough. And it might just be bad enough.
(In reply to comment #14) > We're looking at making changes to the icons if there's time, but the theme is > definitely in a shippable state at the moment, so this won't block release. IS it in a shippable state though? Not technically - *technically* it's obviously in a shippable state in the sense that there's no missing icons, etc - but given the sheer level of negative feedback (see also Asa's blog replies - http://weblogs.mozillazine.org/asa/archives/2006/09/new_firefox_the.html - and especially comment #19 ) this has got to be filed under "potential disaster".
This has been partly improved by the new icons that landed recently. Especially at small sizes, the navigation buttons now have a bit more saturation. Some things, like the large size bookmarks icon, seem unchanged. Not sure whether this bug should be considered "fixed" or not.
Hummm.. - Much nicer reload button - Home button still looks weird - Copy/paste buttons really need differentiating more - I never really liked a clock for history, doesn't seem appropriate. Surely there must be a better way of showing that - Icons still too washed out. Remove the opacity change. Although you already know that one
(In reply to comment #0) > The original screenshots at > http://wiki.mozilla.org/FX2_Visual_Update/Default_Theme_Update look great, but > the icons shown there are actually the hover effects for the toolbar buttons. > It might be better to use those as the standard and maybe use the lighter > variants for the hover effect, or create even darker ones for the hover. I forgot to tell that this exactly what does the theme "Saturated" (https://addons.mozilla.org/fr/firefox/addon/3608). Maybe it could be considered for Firefox 3 ?
Status: NEW → RESOLVED
Closed: 15 years ago
Component: Toolbars → Theme
QA Contact: toolbars → theme
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: