Proto
March 15th, 2008
The new mac theme is pretty good, except for the parts that aren’t. In particular, the back/forward buttons don’t look very good. I don’t have a problem with a big back button, but the current design doesn’t do it well.
- This depressed, dark area must peak out from the back button to balance the dark area on the right.
- The large dark area exists solely to make a place for the drop arrow. The dark area is confusing because it’s not a clear hit area. The drop arrow is is aligned with the forward button, so it looks like the forward arrow points directly at a down arrow.
- The menu that does drop down isn’t under the large back button. It doesn’t even look connected.
- All of this stuff on the left pushes the location bar further to the right than other browsers, and our location bar is pretty crowded due to the chrome stuff we’ve added. The chrome stuff has highlighting that doesn’t work all that well. For instance, HTTPS sites with blue favicons suffer.
- The light grey location bar doesn’t fit in. The tab color doesn’t match the toolbar if you have the bookmarks bar hidden. Continuing the dark color from the top area will work better when we fix the bug about going lighter when not in focus.
I probably won’t convince everyone, but I thought I would write down my opinion anyway.
March 15th, 2008 at 11:11 am
I agree with you on all points, except 4.
Although I like they keyhole concept, the dark area behind the back and forward buttons must be removed. I would also remove the history button and make sure that click-hold on the back and forward buttons would display the history menu.
Proto looks unfinished.
March 15th, 2008 at 11:21 am
I agree, that back-forward combo looks stupid.
March 15th, 2008 at 11:47 am
I find myself constantly moving left to the back button then right again to the drop arrow when I realize that I want to go back more than one page. Surely from a usability point of view the drop arrow should be in the middle.
March 15th, 2008 at 12:53 pm
The Proto theme need a lot of work to be compatible with RTL layouts (Arabic, Farsi and Hebrew). The latest beta release have not released for mac users in some regions due to bug 364536. Help wanted.
https://bugzilla.mozilla.org/show_bug.cgi?id=364536
March 15th, 2008 at 1:49 pm
I for the most part agree with all of your points, here are the changes I think we should make:
-(for 1) Remove etch to the left of the back button
-(for 3) move menu to the left
-(for 4) visually combine stop and reload so they are pushed together (not literally combine, although I’m in favor of that as well) mockup here: http://people.mozilla.com/~faaborg/files/20071114-iconicForms/controlLayoutAndShape_i4.png_large.png
-(for 4) turn on browser.identity.ssl_domain_display so that the blue favicon conveys actual information
-(for 5) Fix the tab color problem if the bookmarks toolbar is turned off
Here are the few things I either disagree with or don’t think we can necessarily fix:
>it looks like the forward arrow points directly at a down arrow
The original design had the drop maker in between the buttons and feedback was universally negative. We could go back and try it again, but I would anticipate we will get a similar reaction. There is also a technical issue that with placing a low hit rate button directly bordering two higher (and one much higher) hit rate buttons, in terms of accidental hits. The forward button doesn’t pick up as many accidental hits in the current design because it is often disabled. Of course accidently hitting the drop down arrow is easy to undo.
>Continuing the dark color from the top area will work better
I think this might make the toolbar see a bit more ominous. The lighter color strictly speaking doesn’t appear anywhere else, but it certainly has the same general style and feel as the rest of the UI, and the very slight reflection line makes us a appear a little more polished (literally) than safari.
March 15th, 2008 at 1:59 pm
> turn on browser.identity.ssl_domain_display so that the blue favicon conveys actual information
That doesn’t solve the problem. The problem is that you can’t see the favicon, because it’s blue-on-blue.
> I think this might make the toolbar see a bit more ominous.
You didn’t give a solution for matching the tab color when there is no bookmarks toolbar. It just looks broken right now.
March 15th, 2008 at 2:26 pm
With regard to 1., I think it peaks out too much to the left. The width of the spacing on the left side of the big button should be equal to the spacing on the right side of the big button (inbetween both buttons).
On Windows, this much peaking-out makes the depressed area hit the side of the screen, which looks pretty bad if you ask me. There should be some space added to the left of it.
~Grauw
March 15th, 2008 at 8:29 pm
>On Windows, this much peaking-out makes the depressed area hit the side of the screen, which looks pretty bad if you ask me. There should be some space added to the left of it.
I’d assume that it extends all the way to the left to make it obvious that the whole area is clickable.
March 15th, 2008 at 10:35 pm
>You didn’t give a solution for matching the tab color
>when there is no bookmarks toolbar. It just looks broken
>right now.
Sorry, forgot about that. It is just a bug that Stephen and Kevin are working on, not really any design decision needed there.
March 15th, 2008 at 11:47 pm
Please get rid of the depression. The drop down arrow doesn’t need any additional styling (it doesn’t have any in IE7 or Fx2). In fact, the depression just makes the back/forward buttons AND everything else look more awkward. Also, please fix the small icons spacing.
(I’m on Windows.)
March 16th, 2008 at 6:46 am
Please use standard Mac OS X back/forward buttons. The idea that a “keyhole” silhouette is necessary to establish Firefox as a unique browser is ludicrous. Add compelling features, not non-standard shapes, to differentiate Firefox.
March 16th, 2008 at 9:40 am
Simple solution was to use one of the GrApple themes instead.
http://www.takebacktheweb.org/
March 17th, 2008 at 5:06 am
-(for 4) visually combine stop and reload so they are pushed together (not literally combine, although I’m in favor of that as well) mockup here: http://people.mozilla.com/~faaborg/files/20071114-iconicForms/controlLayoutAndShape_i4.png_large.png
Strange thing is, that glyph is included in toolbar.png. Its just never had the CSS put in to enable it.
March 18th, 2008 at 11:21 am
Rob – you might appreciate appreciate this:
https://bugzilla.mozilla.org/show_bug.cgi?id=422959
Following a comment in the bug I’ve just selected ‘Use small icons’. It’s a revelation. I am now able to use the back button in Firefox 3b4 without grimacing…