Exclusive: Mozilla talks Firefox 4 for Android design principles

It might look like just a little computer, but putting a good web browser onto a smartphone is about more than just dealing with a smaller screen.
Madhava Enros, Firefox Mobile UI lead at Mozilla, explained the design principles behind the new Firefox 4 for Android to TechRadar at the Web 2.0 conference - and why there's so little of the user interface.
There are some basic principles that are more important than 'make it small'. "These devices are small and portable," Enros points out, "but it's easy to forget that people using these devices are themselves mobile.
"Aside from having to leave room for a finger on the touch screen, people's motor accuracy isn't at its best because they're moving around. People are often navigating in the real world which doesn't leave them with a lot of resources for making their way through a complex hierarchy, so sadly a deep hierarchy not a solution to the small screen problem."

QUICK START: Shortcuts to get you started browsing faster on the start screen
He doesn't expect people to be glued to their phones. "The user is distractible; no matter how engaging your app or web site, people will have to look up when they have to catch their train or open their umbrella or pay attention to their meeting again.
"If you want to communicate something it can't just appear and disappear because there's no guarantee somebody is looking at the screen. People will routinely have to put what they're looking at aside for an indeterminate period of time and that should never cause a catastrophe."
Mobile Firefox is very much Firefox; tap the gear icon at the bottom and you get familiar desktop add-ons; tell the browser you don't want to be tracked and it sends the new Do Not Track header. "It's basically the same stack," Enros told TechRadar; "it's got a different user interface."
Trimming down
"On a small screen you have to be really ruthless about trimming down the user interface or better yet starting from scratch; you can't have a lot on the screen so you have to really be focused on what the core purpose of your app is.
"We wanted to maximise screen space dedicated to content; there is no single control in a browser people spend as much time on as they do on content. If you start including anything you're in competition with what people made a point of entering a URL to go and look at."
So while Mobile Firefox has a title at the top of the page, that scrolls out of the way as you move down the page. "You don't have to explicitly go into full screen mode; just by using content the browser goes away."
In fact the browser is barely there to start with because all the controls are off to the side, taking advantage of the fact that most web pages are longer than they are wide - so to get controls like tabs and the forward or back buttons, you drag your finger off to the side. "All you see is content; there are no overlays, there are no toolbars. When you're using the touchscreen you have a very physical, space-like user interface. People are using their sense of space; they know where things are!"

TO THE RIGHT: Pan right for navigation…

TO THE LEFT: …pan left for tabs
Scrolling and panning is easy; typing isn't. "It's very difficult to type on mobile devices," says Enros sweepingly; "you have a whole spectrum at the moment from BlackBerry to virtual keyboard that runs the gamut from OK to terrible.
Different to desktop
"We wanted to see what we could do around using what we know so far about how mobile browsing differs from desktop. It's much more transactional. It's not the immersive, many hours long activity; I'm in a bar, I want the trivia answer or when is my bus coming… It's quick in and out and back to my life."
Auto-suggest helps a lot, he says. "Before you even start typing, Firefox is suggesting things using 'frecency'. That's a combination of frequency and recency. It's a bit like a quick dial feature, this list becomes a list of the things you do all the time."
Start typing a search and Mobile Firefox suggests multiple search engines (although given Mozilla's financial deal with Google the alternatives are sites like Amazon and Wikipedia rather than Bing).
But what could really make a difference is securely syncing the data that comes from the Awesome bar in desktop Firefox. "You rarely have to type a full URL," claims Enros; you can see suggestions from both your PC and mobile browsing history, or just what tabs you've had open on your desktop.

IN SYNC: Set up Mobile Firefox to learn from your desktop
"I've spent years teaching Firefox on the desktop what I do all the time so I don't have to do a lot of typing. By syncing I don't have to teach my mobile browser again; it knows me. You don't have to have known at the time that you might find it interesting later - it just all syncs."
The future of Firefox Mobile
Enros suggested some directions Firefox might take in the future. Managing your identity and signing you into multiple sites automatically would be a logical progression. "It's a bit of a branching out for us as a software company into the crazy world of services. That is definitely interesting area for us."
Should that even be in the browser? "In many ways a web browser is two big buckets of stuff. One is it renders the web. That's important but there are several good browsing engines out there - and it is important there be multiple engines… The other is 'how do we be this sense-making layer between you and the huge incomprehensible thing that is the internet?' That half would be great to get at from wherever you are."

ADD-ONS: Mobile Firefox has the same add-ons you know from desktop Firefox
What Mozilla learns from mobile will influence Firefox on other devices too. "Mobile is starting to get broader. Tablets are kind of mobile - but they're also not small. Some of the things you do on a tablet start to be appropriate for a laptop or maybe we want these things on our TVs… The only thing that doesn't apply is the small screen part. The important thing is the user being mobile not the device, all of these things still apply."
More social
And because the user is mobile, social tools and context are more important - not because of the phone or the tablet, but because of where and how we use them.
"People ask 'what is so magical about mobile devices that makes people somehow more social than on the desktop?' I think this is looking at it from the wrong perspective. It's not mobile that is special and odd somehow, it's the very abstract and odd situation of a person sitting in front of a machine at a desk that is the special case.
"You can extract people from that environment and suddenly they're in their regular lives where we are social beings, we act more like human beings who are not supposed to be focused on a very particular task. You can more or less take it as a given there will frequently be more than one people involved."
The same is true for context, he says: "Mobile devices don't somehow make your apps more subject to context. Context is by definition always around us but context varies a lot more because you are in your regular life not in this very artificial setup of at a table in front of a computer.
"You can know what the time is or what's in their calendar, how fast are they moving, how bright it is… these are all things we can start to glean from rich devices that will help us design for their context."