Sketch Day

Menu Sketch


This entry was posted on Friday, November 20th, 2009 at 12:19 am and is filed under Firefox. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.

37 Responses to “Sketch Day”

  1. xangua says:

    it looks good, remembers me opera

  2. Mike Beltzner says:

    Looks cool; thanks for sharing!

  3. Arc says:

    “Recently closed windows” and “Recently closed tabs” goes where?
    Shouldn’t “Add-Ons” be grouped with “Options” rather than “Downloads”?
    Please don’t forget about text only zoom.

    Has anyone looked into the possibility of being able to place the icon in the titlebar?

  4. Damian says:

    Could do with “Tab Bar” on bars so we can finally knock off bug 347930. And will the name be called “Menu Bar” Or “Navigation Bar”? Could try something new all together like… “Control Bar”. Dunno…

    But it looks excellent!

  5. Cato says:

    No entry for button/toolbar configuration? That is a must!

    Otherwise nice work! I’d much more prefer one button for everything than 2-3 buttons.

  6. Bo says:

    Why not combine “New” and “Open”? And “Print” and “Page Setup”?

  7. Kurt (supernova_00) says:

    I agree with the recently closed tabs/windows and the add-ons comments above.

  8. johnjbarton says:

    Wouldn’t it be cool if all of those submenus actually popped up at once when you open the main menu, with the arrows like you drew?

  9. Aleksej P. says:

    THAT long menus are awful >_<

  10. David Regev says:

    Stephen, this is a great direction. I’m glad to see Firefox moving towards richer menus.

    Wasn’t there supposed to be a application/document distinction, where commands relating to Firefox or to all the tabs go in the ‘Tools’ menu and commands relating to the active page go in the ‘Page’ menu? I’m confused as to why you didn’t maintain this distinction here. For example, you included: Save, Print, Edit, Find, and Zoom (and hopefully Private Browsing will also be page-specific in the future).

    The right pane would be a great place to display a combined view of “frecent” pages and pinned bookmarks. This would neatly replace the Bookmarks menu, the Bookmarks toolbar, and the location bar’s default drop-down results. ‘All History’ should then be changed to something like ‘All History and Bookmarks’, or just ‘Library’.

    I can see several ways of simplifying this menu. Items that are already exposed through the UI should not show up in the menu. Thus, New Window and New Tab would not appear. Instead, the New Tab button would include keyboard shortcuts in its tooltips (perhaps along with the information that one can drag a tab out of the window). Other items can be consolidated. For example, instead of a ‘Bars’ item, all that functionality can be placed in the ‘Customize…’ dialogue. Similarly, Page Setup can be moved to Options/Preferences. And I’m sure someone clever could come up with a way to integrate Print Preview into the printing experience without a separate command. And having the Firefox logo appear twice is also redundant.

    The biggest advantage of this type of menu is that it doesn’t have to be a plain linear list. You could have more useful—two-dimensional—controls. So, instead of a Zoom menu with three items, there would be an actual zoom slider that would also display the current zoom level. Other items that normally bring up separate windows can be integrated into this menu directly. Thus, hovering over ‘Downloads’ can replace the items in the right pane with a list of recent downloads and a link to ‘All Downloads’.


  11. Jordan says:

    Oh, thank you! My biggest complaint about Chrome (and thus your previous mockups) was the division into two menus that I find totally arbitrary. Whenever I try to do something with the menus in Chrome, I /always/ pick the wrong one. I know that the two menus isn’t the best UI and I’m so glad you’re thinking of other things. IMO one much is better than two.

    Questions: Is the big back button gone? How does the interaction with the right pane work? Will the back button not being on the far left throw people, and is the loss of Fittsiness worth it?

  12. Opp says:

    That’s brilliant. As noted above, it gets around the arbitrary division used by Chrome. Reminds me of the big windows button in Word (particularly the use of the FF logo). Obviously people can debate exactly what should go in the list, but it shows some real potential!

  13. Aaron says:

    I’m curious as to what thought has gone out into the emergence of a combined search box and location bar as a single unit?

    As of recent, other browsers have gone with this approach and it makes sense. Why shift focus to do search when the location bar accepts input and can do the searching too.

    Will Firefox approach this idea?

    - Aaron

  14. darkhole says:

    Print -> Print ??? This is not redundant??? Please, can you use Printing -> Print ??

  15. Shadowbat says:

    Love it! resembles backstage in Office 2010. But looks awesome and shows immense potential. The Downloads and Addons window could use the same format and might prevent addons from cluttering the erstwhile Tools menu.

    Never liked Chrome’s 2-button format, but this rocks. Keep up the good work.

  16. Dominic Spitaler says:

    Great concept, although I think the “double branding”, aka two firefox icons in the UI is not such a good idea. Also whats going to happen with the keyhole shape, when this concept will be implemented?

  17. aceman says:

    Don’t really like it. It looks cluttered and too much clicks to accomplish a simple task, like copy/paste. I prefer 2-button style because the menu structure is not so deep and nested. I think especial for new comers and occasional users is better that we have shallow and flat menu style. But on the other hand i kinda like an idea of an App button.

  18. Kamasama says:

    I thought the browser (tools) and page menus were supposed to be separate.

  19. FRiDGE says:

    It makes me feel this is a mix of Ribbon (visual style of the menus) and ultra-long Office 2003 menus with zillions of useless features. Why would I need Bars to be in main menu? I can access them by clicking on the bars etc.

  20. John Hamm says:

    Unnecessary submenus have always annoyed me. For instance, there is enough real estate to eliminate the “Zoom -> ZOOM+/ZOOM-/RESET” submenu. Replace the “Zoom ->” menu item with three inline hover icons “[+] [-] [!]” or something along those lines. Same with “Edit -> Cut/Copy/Paste” and even perhaps the “Print -> Print/Preview/Page Setup”.

  21. JPM says:

    What app did you use to generate that mock? That is one pretty wireframe.

  22. Poom says:

    I think the edit things are really really unnecessary. For instance, nobody would paste something into a text field using the menu bar when they can do ctrl+v or right click on the text field + paste. I also think the new stuff will be really redundant as well. First of, I don’t understand why someone would open a new window. If they want to, they can just click a shortcut on their desktop or quick menu. As for new tab… There’s a button on the tab bar already. Also, character encoding is missing and that’s kinda important.

  23. I think it’s still (just barely) important to have menu items or at least toolbar buttons for features like cut and paste and for showing and hiding toolbars if only for discoverability: inexperienced and even long time users may not know that context menus exist for these things, and they might not know (or remember) the shortcut keys for them. I’ve also seen some buggy javascript prevent me from using the standard action to copy or paste, so having an alternative through a menu item can be a good fallback. Lastly, there’s almost certainly an accessability angle to this – screen reader users, or limited mobility users may need as many alternatives to do the same thing as they can get.

    Is there a good UI yet for showing tips to users in a way that experienced users (i.e. users who’ve demonstrated they know about the feature) can dismiss, but forgetful or new-to-the-feature users are reminded about it frequently? If there was, this might be another way of helping out users while tucking more away into context menus.

    I’m interested to see where you suggest the menu items that add-ons add should go. Extensions like Firebug, Greasemonkey, Adblock Plus and IE Tab all add their own menu items to the Firefox 3.5 Tools menu, as do plugins like Java (for access to the Java Console). Where should they go now? Should they become new tabs on the global Options dialog?

  24. John says:

    Mimick the Windows Start menu more. Replace “Recent History” with “Most Visited Bookmarks,” and place this on the left instead of the right. At the bottom of this list should be a menu button for “All Bookmarks” (instead of “All Programs”). At the top of this list, the user could pin web applications they need easiest access to, such as web mail (where the browser or Outlook would be on the Start Menu).

  25. kretos says:

    I’m using personal menu add-on for firefox and my menu looks almost exactly as yours. My selection (i’m using polish version of FF so I translate from polish to english – it can be more or less inaccurate):

    new tab
    recently closed tabs
    private mode
    ———————– (section divisor)
    zoom (menu with items bigger, smaller, original and zoom only text)
    charset (actually I don’t remember if I use it once…)
    full screen view
    check new version

    I don’t have new windows option because I alwyas use single window, also I don’t use print option because I don’t have a printer:) I removed some shortcuts that are well known for me (like copy, cut, save).

    I don’t like the idea about mixing options connected with page with other options. Look at your picture – edit is under bars – bars option will be used rather seldom (set once and forget), edit can be used more often. Also find is under addons and downloads…

    I think that find can be moved to search window and “find in page” can be one of search engines – one can press Ctrl-f to swith to find in page and jump into find field. But in this approach there will be problem with displaying buttons for next/previous etc.

  26. SagaDarvulia says:

    Here’s a radical idea: Drop the Recent History altogether. I think for most users, be they newbies or veterans, a list of recently closed tabs/windows is infinitely more useful, not to mention easy to understand. The History is more useful in Places anyway, and to a new user a listing of recent History can look somewhat confusing.

    An alternative would be to let the user switch between, say, Recently Closed/Most Visited/History, similar to how the IE Favorites menu is structured. (Although it lists Favorites/Feeds/History instead.) The drawback to this is that it adds an extra bit of clutter, but it could maybe be an optional setting with Recently Closed as the default? This could -potentially- be a way to deal with complex menus added by extensions as well.

  27. Garik says:

    What if menu list will be populated on user experience, will show only X recently used items, i think that is very good experience that many popular software’s are using

  28. Mikel says:

    As others have stated, the proposed menu might be better if moved up to the title bar (as you are now proposing in the latest mockup).

    Also, Find was traditionally under Edit. Perhaps at least move it up two places to directly under the Edit menu.

  29. Andrey says:

    I like the idea of a one-button menu. Would be nice if the menu navigation can be organized like the Win7 start menu – clicking on a grouping item would expand the sub-items downwards (below the grouping item) preferably with a sligth indent. This will save us from the nightmare of moving the mouse to the right where the submenu opened without moving it vertically and losing the submenu. Collapsing the items could be done by clicking again on the grouping item or/and right-clicking somewhere else in the menu. Autoexpanding and autocollapsing by hovering the mouse over grouping items is a nice feature too.

  30. [...] button is set to replace the menu toolbar that Firefox users are accustomed to. He also links to a previous sketch of his, showcasing what the unified menu might look like. In the image below, you can see just how [...]

  31. Sala says:

    I digged this site up from my history, cuz that app button idea is just amazing. Id like an addon for it, like, asap. Its genius idea (not thats not like office 2010 but anything that follows more gui guidlines is huge yesyesyes).

    Cant wait!

  32. vinitneo says:

    Looks really good… can’t wait to use it.

  33. Devric says:

    hm, not to put you down, but there ain’t any innovation nor ergonomic in the design. I got one in my mind but should be more fun if it came up by yourself, hint: use the ‘opera speed dial’ but rather as a page tab use it as a buttons layout. and please don’t make a simple task button harder to reach than it should. Good luck with the fun :)

  34. [...] En af de store nye ting efter min mening er at den gamle Filer-Rediger-Vis-menu er fjernet til fordel for en enkelt orange Firefox-knap. Den gamle menustruktur stammer fra kontorprogrammer og andre redigeringsværktøjer, og har aldrig rigtig passet til en browser. Internet Explorer og Chrome er da også allerede gået væk fra denne struktur, men Firefox har tænkt sig at gå skridet videre, og kun have en enkelt menu, så man ikke skal huske hvilken menu et bestemt menupunkt ligger i. Det er planen at rydde op i menuerne, så de fleste punkter kan være i en enkelt menu uden undermenuer, som på denne langt fra endelige skitse: [...]

  35. broccauley says:

    I think larger buttons and larger icons like this would be much better:

  36. This is an interesting mockup. Can you please post a reply with what you used to create this? I would love to be able to create images like that for use on my sites and in presentations.