Project “Australis“, a redesign of the Firefox user interface, landed in Firefox Nightly a few weeks ago. As it continues to be refined, developed, and tested in Nightly for the next Firefox release cycle, we wanted to explain a little further the rationale behind the design.
Australis includes a set of visual improvements to streamline and unify the browser interface on desktop, as well as new features that make Firefox more efficient to use and easier to customize. In this post, I’m going to focus specifically on why browser tools are placed where they are and why we increased the prominence of Customization.
The user experience team has a guiding principle called “The eighty-twenty-two (80/20/2) rule” that guides the new Australis redesign, which is: foregrounding functions that most people use most often (the 80% use case) in the main user-facing interface; supporting functions that most people use somewhat often (the 20% use case) with a secondary menu; and allowing functions that only some people use (the 2% use case) to be added to the default interface through further customization.
Let’s take a deeper look at these three places where most of your browser tools are:
1. A simplified main interface
The efficiency of using a browser highly depends on how quickly and effortlessly users can get to the browser functions they use. While this definitely means making features prominently and quickly clickable, every bit of interface we put on the screen competes attention with everything else. Instead of overwhelming users with all the options, we identified features that most people use most of the time based on heat map studies, and gave them primary placement, alongside the address and search fields. Features like Bookmarks and Downloads are no longer buried in a menu but are now easy to find and quick to access. Limiting the number of controls in the primary interface makes those that are there much quicker to find. Keeping the browser simple and clean also helps users better focus on content of the webpage.
2. A handy new menu
While the main interface only contains the most commonly used functions, it is crucial for users to access functions they need occasionally without hunting for them in menus with deep hierarchies. Australis introduces a new menu that opens by clicking the menu button on the far right of the toolbar.
Features like Zoom, Find in Page and Print are conveniently put into the menu, and represented by icons so that they are easy to recognize and click on. The bigger icons with more generous spacing also make this menu more touch-friendly for touchscreen laptops. The new menu panel opens when you need it, and helps getting things done instead of getting in the way.
3. An easy-to-discover customization interface
The browser is the most essential tool for people’s online life, and everyone uses it differently. While majority of users' needs are fulfilled by the default browser interface, we believe that everyone deserves a personalized browsing experience that caters to just their needs. By surfacing the customize button on the bottom of the menu panel, we want to increase the discoverability of the new customization interface that helps users customize Firefox just the way they want it to be.
The new customization page allows users to prioritize functions in the menu, toolbar, and tabbar by simply dragging them to the desired position. For instance, users who don't use the search field can simply drag it out of the toolbar or into the menu as needed. This page also contains a set of additional tools that might only be relevant to some users, including Developer Tools and Character Encoding, to be added back to the menu panel or toolbar. We also put a little bit of constraint to the interface so that users can't accidentally remove the address field or the menu button and make Firefox unusable.
Of course, there are many more tools than those that ship by default. One of the best things about Firefox has always been the availability of thousands of additional features built as Firefox Add-ons. The new customization interface allows adding and moving add-ons between toolbar and the new menu, which gives users the ability to have exactly the right set of features, built-in or added-on, in the same places in the interface. Firefox is currently the most customizable browser you can get, and you don’t know what you are missing until you try it!