April, 2011

Apr 11

The Firefox Home Tab

Many of the mockups of Firefox’s new interface, dating all the way back to August 2009, have featured a small home tab.   But up until now, I haven’t had a chance to explain the various ideas surrounding Home, elaborate how it fits into our broader cross platform and cross device strategy, and answer some really basic questions, like what will happen if the user has already customized their home page.


Firefox Home: Your First App Tab

Well, at least that was the idea since we were planning on introducing Home at the same time as introducing the concept of App tabs.  Now it will probably be your third or fourth App Tab in terms of order of creation, but "Home: Your Left Most App Tab!" doesn’t really have the same ring to it :)  Either way, Home is an application created by Mozilla that runs in Firefox, and it helps you manage your online life. 

Home is built on top of Sync, acts as a launch pad  to all of your encrypted personal data, your personal Web.   Our goal is to provide a consistent Home experience on every OS, including the classic desktop environments of Windows, Linux and OS X, as well as the mobile environments of Android, Maemo, and iOS:

We launched our Home iOS app last July, and the desktop Home app tab is still currently being developed, but nonetheless the two are part of what will eventually be a unified cross platform strategy.  Home will be available on every single platform, including platforms that are restricting us from shipping the full Firefox browser.

But home is more than just a consistent cross device experience for users, it’s also going to be one of the things that makes Firefox truly unique in the marketplace.  In a competitive landscape quickly heading towards interface commoditization (back+forward+fast!), Home  will provide Firefox users with a personalized experience unlike anything else on the market.  Going beyond an ever decreasing browser frame, Home provides users with a dashboard to their life online.


What Types of Data will Home Provide Access To?

The UX team is still in the process of determining Home’s initial feature set and interface, but we’ve definitely had a lot of time to brainstorm the types of personalized data that we may be interesting in surfacing to users.  Here are just some of the things we are looking at, from design work by John Wayne Hill (Firefox UX intern), Madhava Enros and Stuart Parmenter (mobile), and Kevin Fox (web apps).


A Mechanism for Application-Level Notification

Another nice advantage of the Home Tab in desktop Firefox is that it introduces a less intrusive and more ambient way for Firefox to provide users with notifications for particular events, like a security update being available, or you needing to provide your new Sync password.  Similar to how email clients glow when you receive a new message, the Home Tab will glow when Firefox has something to ask you.  These types of asynchronous notifications are considerably friendlier and more respectful than throwing up a large modal dialog box:

Introducing Users to The Concept of Tab Browsing

One of the really nice properties of surfacing home as an Application Tab, is that anything launched off of it will open in a new tab.  What’s great about this is that many users who have always relied on the home button in Web browsers (past and present), haven’t discovered the advantages of tab browsing yet, and tend to follow very linear and singular navigation paths.  For instance, a common start up sequence for these users might be:


In this sequence, the user only has one tab open, because they are relying on clicking the home button for navigational Google searches, and by default each new task overtakes their current task.  It’s like an OS that can only have one window open at a time.

By switching these users over to the Home Tab, the same sequence of actions (relying on the house icon) produces three separate tabs.  As users notice that things like their email, auction, and baseball game are still present, they can quickly pick up the core advantages of tab browsing: reduced load time and multi-tasking on different things simultaneously.


Following the practice of "show, don’t tell" this interface introduces even the most stubborn IE6 users to the advantages of tab browsing, without them having to read a single support document or manual.  Note that users who rely heavily on the current Home Button for search still haven’t transitioned to the always available search bar, so there is already a strong correlation between relying on the Home Button, and navigational sequences that are common to pre-tab browsers.


What if the User Has Already Specified a Custom Home Page?

Because we want to place Firefox UI inside of the Home tab (like session restore, or access to your online accounts), we need to make some changes to how we deal with customized home pages.  This is partly to make sure that these aspects of Firefox’s UI are always available (unless the user has actively removed the Home tab), and partly because we want to have consistent support documents that don’t include too many if-then clauses.

A custom home page (or pages) will become app tabs.  But the experience of launching the browser will be the same.  For instance, if you like many users  have set Facebook as your home page (now called "start page"), it will still be the active tab when you launch Firefox:

The only real difference is that you’ll need to click on the Facebook icon instead of the house to get back to it.


The Home Tab Versus New Tab

The Home tab and New tab are both launching points to a new destination on the Web, so what’s the difference between them?

This is actually going to be the topic of my next post, but the short version is that I believe the Home tab and New tab represent two very different use cases.  One is primarily a mouse driven browse-based interface, and the other primarily a keyboard driven search-based interface.  One is complex, and the other is simple.  One is the place you go when you are bored, and other is the place you go when you happen to already know your next destination on the Web.