Firefox UI evolutiuon
Stephen Horlander and the rest of the UX people at Mozilla have been playing around with various ideas for how we could evolve the Firefox theme and overall UI in 3.6, 3.7 and Firefox 4. Some of these mockups made their rounds through the [digg/mozillazine/twitter/blogo]sphere awhile ago, but I’m not sure if we ever actually had a thread in dev.apps.firefox for discussion (also cc’ing dev.usability). So here are the links for your perusing pleasure in case you haven’t had a chance to check them out yet:
https://wiki.mozilla.org/Firefox/Sprints/Windows_Theme_Revamp https://wiki.mozilla.org/Firefox/3.7_Windows_Theme_Mockups https://wiki.mozilla.org/Firefox/4.0_Windows_Theme_Mockups http://blog.stephenhorlander.com/2009/08/17/menubar-and-toolbar-handling/ http://blog.stephenhorlander.com/2009/08/14/windows-theme-project-progress-report-2/ http://blog.stephenhorlander.com/2009/08/11/windows-theme-project-progress-report/
I’m about to post some notification mockups as well, but this is good background material that those mockups build on, so wanted to get this thread up first.
-Alex
I really like the idea of having tabs on top. I hope that if tabs are disabled then the tab layer goes away and there is more browser real estate. It would be appreciated by people like myself who don’t use or like tabs.
My only complaint is that I really hate the idea of having the menu bar going away. It’ll make things much less user friendly, in spite of the good looks. I don’t have an answer for this, so hopefully someone else will figure it out. Can you find a way to integrate the menu bar into the UI or something (or at least the elements of it)? For example you might have intuitive icons or something for file, edit, help, etc. What it appears you did with tools is a possibility.
On Aug 23, 10:59 pm, Michael Burns wrote: > I really like the idea of having tabs on top. I hope that if tabs are > disabled then the tab layer goes away and there is more browser real > estate. It would be appreciated by people like myself who don’t use or > like tabs. > > My only complaint is that I really hate the idea of having the menu bar > going away. It’ll make things much less user friendly, in spite of the > good looks. I don’t have an answer for this, so hopefully someone else > will figure it out. Can you find a way to integrate the menu bar into > the UI or something (or at least the elements of it)? For example you > might have intuitive icons or something for file, edit, help, etc. What > it appears you did with tools is a possibility.
What is it, exactly, about the menu bar that you like? So far the general consensus appears to be the universality of its appearence throughout applications. However, this seems strange to me because a menu bar in one application will have different top level items as will as different sub-level items. This can lead to, for example, “Edit” having an entirely different function in one program from another. There is no consensus on what “Edit” is or what it should contain.
Although I don’t understand the complaint, I do think there are enough people making it for it to be catered for. I think Microsoft have come up with the best solution: Hide the menu bar by default but allow it to be unhidden (perhaps as a toggle) with Alt. This way if people like the menu system, they can use it and if people don’t, they don’t have to.
I personally run Firefox with no buttons or menu items at all other than the address bar. However, this functionality isn’t baked in to Firefox; it is enabled through extensions. Therefore, perhaps the old menu system should be enabled through an extension as well in order to avoid making UI of the main program overly complex.
Fluffy654 wrote: > On Aug 23, 10:59 pm, Michael Burns wrote: > >> I really like the idea of having tabs on top. I hope that if tabs are >> disabled then the tab layer goes away and there is more browser real >> estate. It would be appreciated by people like myself who don’t use or >> like tabs. >> >> My only complaint is that I really hate the idea of having the menu bar >> going away. It’ll make things much less user friendly, in spite of the >> good looks. I don’t have an answer for this, so hopefully someone else >> will figure it out. Can you find a way to integrate the menu bar into >> the UI or something (or at least the elements of it)? For example you >> might have intuitive icons or something for file, edit, help, etc. What >> it appears you did with tools is a possibility. >> > > What is it, exactly, about the menu bar that you like? So far the > general consensus appears to be the universality of its appearence > throughout applications. However, this seems strange to me because a > menu bar in one application will have different top level items as > will as different sub-level items. This can lead to, for example, > “Edit” having an entirely different function in one program from > another. There is no consensus on what “Edit” is or what it should > contain. > > Although I don’t understand the complaint, I do think there are enough > people making it for it to be catered for. I think Microsoft have come > up with the best solution: Hide the menu bar by default but allow it > to be unhidden (perhaps as a toggle) with Alt. This way if people like > the menu system, they can use it and if people don’t, they don’t have > to. > > I personally run Firefox with no buttons or menu items at all other > than the address bar. However, this functionality isn’t baked in to > Firefox; it is enabled through extensions. Therefore, perhaps the old > menu system should be enabled through an extension as well in order to > avoid making UI of the main program overly complex. > It’s true that the contents of menu bars differ wildly from program to program, and that’s unfortunate. But my biggest two gripes about the “Press-Alt-to-toggle-menu-bar” approach are that 1) there’s no visual clue that pressing Alt will show the menubar (it presumes muscle memory for people who know how pressing Alt works, and they’re the people who least need the visual clues) and 2) it forces the rest of the page below to jog down and re-render. A third, related problem with some of the wireframes shown in the original post is that they put the menubar in the client area of the page — which makes them potentially spoofable by sites… My preferred solution, not that I know what it should look like exactly, might be something like
+———————————————————————————+ | Mozilla Firefox [-] [+] [x]| +———————————————————————————+ | [v] [Back/Forward] [address ] [page] [tools] | | [tab bar]………. | +———————————————————————————+ | page |
press the [v] behind the back/forward button… and it becomes
+———————————————————————————+ | Mozilla Firefox [-] [+] [x]| +———————————————————————————+ | [v] [Back/Forward] [address ] [page] [tools] | | [tab [File edit view ... menu bar] …other tabs in background | +———————————————————————————+ | page |
Poor asciiart, but I mean for the menubar to drop down and overlap the tab bar, while the menus are active. This addresses the three problems above — there’s a visual indicator (it’s not ideally located, but just a suggestion) and doesn’t force a distracting re-render of the page to make room for the menu bar’s appearance and disappearance, and the menus stay in the chrome area of Firefox. Note that the [v] and the [page]/[tools] buttons are not necessarily mutually exclusive, so I included both above.
Just my two cents, ~ben
On Aug 25, 6:57 pm, Ben Lerner wrote: > Fluffy654 wrote: > > On Aug 23, 10:59 pm, Michael Burns
wrote: > > >> I really like the idea of having tabs on top. I hope that if tabs are > >> disabled then the tab layer goes away and there is more browser real > >> estate. It would be appreciated by people like myself who don’t use or > >> like tabs. > > >> My only complaint is that I really hate the idea of having the menu bar > >> going away. It’ll make things much less user friendly, in spite of the > >> good looks. I don’t have an answer for this, so hopefully someone else > >> will figure it out. Can you find a way to integrate the menu bar into > >> the UI or something (or at least the elements of it)? For example you > >> might have intuitive icons or something for file, edit, help, etc. What > >> it appears you did with tools is a possibility. > > > What is it, exactly, about the menu bar that you like? So far the > > general consensus appears to be the universality of its appearence > > throughout applications. However, this seems strange to me because a > > menu bar in one application will have different top level items as > > will as different sub-level items. This can lead to, for example, > > “Edit” having an entirely different function in one program from > > another. There is no consensus on what “Edit” is or what it should > > contain. > > > Although I don’t understand the complaint, I do think there are enough > > people making it for it to be catered for. I think Microsoft have come > > up with the best solution: Hide the menu bar by default but allow it > > to be unhidden (perhaps as a toggle) with Alt. This way if people like > > the menu system, they can use it and if people don’t, they don’t have > > to. > > > I personally run Firefox with no buttons or menu items at all other > > than the address bar. However, this functionality isn’t baked in to > > Firefox; it is enabled through extensions. Therefore, perhaps the old > > menu system should be enabled through an extension as well in order to > > avoid making UI of the main program overly complex. > > It’s true that the contents of menu bars differ wildly from program to > program, and that’s unfortunate. But my biggest two gripes about the > “Press-Alt-to-toggle-menu-bar” approach are that 1) there’s no visual > clue that pressing Alt will show the menubar (it presumes muscle memory > for people who know how pressing Alt works, and they’re the people who > least need the visual clues) and 2) it forces the rest of the page below > to jog down and re-render. A third, related problem with some of the > wireframes shown in the original post is that they put the menubar in > the client area of the page — which makes them potentially spoofable by > sites… My preferred solution, not that I know what it should look > like exactly, might be something like > > +———————————————————————————+ > | Mozilla Firefox > [-] [+] [x]| > +———————————————————————————+ > | [v] [Back/Forward] [address ] [page] > [tools] | > | [tab > bar]………. | > +———————————————————————————+ > | page > | > > press the [v] behind the back/forward button… and it becomes > > +———————————————————————————+ > | Mozilla Firefox > [-] [+] [x]| > +———————————————————————————+ > | [v] [Back/Forward] [address ] [page] > [tools] | > | [tab [File edit view ... menu bar] …other tabs in background > | > +———————————————————————————+ > | page > | > > Poor asciiart, but I mean for the menubar to drop down and overlap the > tab bar, while the menus are active. This addresses the three problems > above — there’s a visual indicator (it’s not ideally located, but just > a suggestion) and doesn’t force a distracting re-render of the page to > make room for the menu bar’s appearance and disappearance, and the menus > stay in the chrome area of Firefox. Note that the [v] and the > [page]/[tools] buttons are not necessarily mutually exclusive, so I > included both above. > > Just my two cents, > ~ben
But the Alt-toggle is used in other applications and therefore will be known by a larger number of people. Additionally, we could unhide it in other ways such as with an Options checkbox. I definitely think these should be available as a minimum.
If we then want to add extra UI elements to hide/unhide the menu, this can be done in addition to the above. They need to work just like a normal toolbar button so that they may be easily removed. The menu itself should work like the Bookmarks panel and be removable also.
From reading around, it seems like the idea is to have the menubar in but hidden as standard.
I’m not saying the menu bar should necessarily be kept. What I was suggesting was integrating the menu bar into the other toolbars. For instance, the proposed “tools” button in the toolbar could replace the “tools” in the menu bar. “Help” and it’s menu could be replaced by a “?” toolbar icon with a drop-down arrow. You might even move menu items out of their groupings to use their own toolbar button. Maybe move menu items to other menus (renaming if necessary). This might allow you to condense and empty some menu bar menus so you can just remove it.
That’s an idea. I’m concerned about the less initiated though. Most of the less skilled computer people don’t use or know ANY hotkeys and would struggle to figure out using the hidden menu bar. If this route is taken, maybe it might be prudent to offer the user the choice during the installation process to keep the menu bar as visible or hidden. Then they could, as another suggested change it later by clicking a check-box in options.