The Mozilla Mobile Team is working tirelessly to make Firefox awesome on tablets, and I wanted to take a moment to share some of the design decisions we’ve made with the UI thus far. Firefox for tablets is an evolution of its phone based predecessor, with some added enhancements that take advantage of a tablet’s larger screen size.
Firefox looks right at home on Android 3.0, drawing its overall theme from Honeycomb’s minimalist design language. Of course, this is still Firefox, so we’ve made sure to keep familiar visual elements in place, like our signature big back button and a distinctive tab shape.
Our Awesomebar uses the same tabbed menu to allow quick access to bookmarks, history, and your synced desktop activity. Users of the current phone version of Firefox will notice that the tabs have been moved off to the left, which makes them easier to reach and increases the number of results that can be displayed above the keyboard.
On Firefox for phones, we meticulously tucked away all of our UI elements to free up the screen for unrestricted browsing. On a tablet, the bigger screen let us to bring some of those helpful elements back onto the screen, like tabs, for example. In landscape mode, tabs exist in a persistent left bar, allowing for quicker browsing. You can switch through tabs with your left thumb, and scroll through web content with your right. In portrait mode, this tab bar gets rolled up into a menu item at the top of the screen, to free up browsing space below. So whether you like keeping lots of tabs open and quickly switching back and forth between them, or if you prefer to just open a page and see nothing else on the screen, Firefox has you covered.
If you’d like to see more about our design process, check out these links:
- my ongoing Flickr set of tablet mocks
- Brian’s blog post on tab design
- Brian’s tablet wireframes
- Brian’s first sketch of Firefox for tablets
- Madhava’s presentation on tablet design from April 2011