A Modest Construct

Some of the Firefox boys have been tossing around ideas for a new UI design for Firefox 2. Their ASCII mockup is as follows (not in a blockquote because of the <pre> tags

    (1) -.          .- (2)                               (5) -.
                |          |          .- (3)             (4) -.      |
                v          v          v                       v      v
.———————————————————————————————————.
| File   Edit   View   History   Bookmarks   Help             [_][=][x]|
|———————————————————————————————————|
|.—. .—.  ,.—.—————————-.—,,—,.   ,—————.—-,,  .i. |
||< -| |->| ( |^v| {} www.foo.com  v |.)||=>| ) (  google G |.O |)  -O- |
|'—' '—'  `'—'—————————-'—''—''   '—————'—v''  'i' |
|———————————————————————————————————|
|(.O) (&) (BBC News v) (Mozilla)                                       |
|.—————-,.—————-,.—————-,———————————————-|
||{} Bar     || {} Foo (x)|| {} Baz    |                               |
|——————-'           '——————————————————————|
|                                                                    |^|
|                                                                    |H|
:                             (page content)                         : :
.                                                                    . .
:                                                                    : :
|                                                                    |V|
|                                                                    //|
'———————————————————————————————————'
   ^     ^               ^       ^                                    ^

   '     |               |       |                                    |
  (6)    '- (7)     (8) -'       '- (9)                         (10) -'

From mozilla.dev.apps.firefox

A lot of things are moving inside the URL bar:

(1) The reload button [^v] moves to be inside the URL bar so that it is directly related with page which will be affected by it

(3) The RSS [.)] and Go [=>] buttons move inside the URL bar, again to emphasize their direct relationship with the page. The Go button becomes a stateful button that is either “Go” or “Stop”; if a page is not loading, or if a user is typing in a URL, the button is “Go”. If a page is loading and a user is not typing in a URL, the button is “Stop”. The lock icon (not shown) and URL drop-down control (v) would continue to be rendered as they currently exist.

This is will be somewhat strange to get used to, but I think that it’s conceptually solid. Whether or not it can actually be achieved without cluttering up the URL bar is another matter. What has been asked for—and what I would like to see—is the URL bar itself used as progress indicator, as it is in Safari. This feature allows for a more or less transparent merging of two wholly related UI widgets into one. See below for more talk of progress indicators. Obviously, the RSS button is already a part of the URL, and to be honest, I’m not even sure why we have a go button anymore. If you’re typing in a URI, isn’t it quicker to simply press enter? I can’t even remember the last time I actually clicked the “Go” button.

(10) The status bar is hidden by default, and the page resizer is in the bottom right corner underneath the scrollbar.

(5) The throbber will become the progress indicator as well as the progress meter, with a pie chart in the center filling up to indicate overall page load progress

It seems to me that if you try to take a 16×16(?) throbber, and make an even smaller portion of it the progress indicator, you might as well just poke users in the eyeballs. I am personally wary of making the status bar hidden by default, as it’s essentially the home base for metadata. A lot of extensions add widgetry there (right now, I’m looking at my Adblock button and the FasterFox timer), as well as the page status and indicator. I know that, for instance, Windows Explorer’s status bar has been hidden by default, but that’s only because Windows moved much of that functionality into the sidebar (I disable the sidebar and enable the status bar: I’m too oldschool for that sort of nonsense).

There’s a lot more small things that Mike talks about which I don’t have extensive commentary on. It’ll be interesting to see where this wireframing takes the develop of chrome for v2.