Login:
Password:

Concept video from Mozilla Labs gets developers thinking, talking

By Scott M. Fulton, III, BetaNews

June 13, 2008, 11:49 AM

A typical developer may often leave a major developers' conference thinking that most everything relating to how a graphical operating system works, has already been invented. But a new video from Mozilla Labs blows away that illusion.

A new set of conceptual videos produced by Mozilla Labs engineer and user experience chief Aza Raskin -- the son of the late, legendary Apple Macintosh and Xerox PARC user interface designer Jef Raskin -- offers some completely new ideas for how a Web browser, ostensibly a future version of Firefox for mobile, would work on touch-capable handsets.

But in so doing, Raskin has actually opened the door for some bold rethinking of the entire nature of Web "browsing" -- if it should still be called that -- on all platforms.

Raskin envisons an environment where Web pages -- the things that Mozilla currently says are displayed in "tabs" -- are actually elements resting on a zoomable desktop he calls the infinite 2D plane. The meaning of "tab" changes in this environment, becoming more like a document the way his father often envisioned, except the document is represented not by an icon or a little graphical tab...but by a document, just zoomed down.

Once the document is zoomed into view, all the control and functionality features relating to the document (toolbars, menus, things a mobile user may want to do with one touch) reside along the top and bottom edges. But this isn't a window, and the page doesn't scroll "beneath" a region framed by these functional elements that stay rigid. Rather, the address bar and navigation features scroll away when the user drags the page down, and the functionality features (for instance, a place to embed "Digg This!") crop up along the bottom once the user has scrolled to the bottom of the page.

That way, when the user is reading the Web page, there's nothing on the screen but the page itself. The trick is to make the system as functional and sensible as it was before, without much extra bother on the user's part, while reducing or even eliminating screen clutter.


A screenshot of an open document appearing in Aza Raskin's 'infinite 2D plane,' a conceptually new environment for Firefox on mobile devices.
A screenshot of an open document appearing in Aza Raskin's 'infinite 2D plane,' a conceptually new environment for Firefox on mobile devices.

Scrolling up and down is an obvious process for a mobile user with a single-touch screen, but what about zooming out? Do we need a separate key for that? Raskin's goal was to put all the functionality in the environment, leaving nothing to the outside. So he created a concept called "throwing" the page, which takes place when you zoom left or right beyond the document margins. The user sees an arrow marked "zoom out." Touching this region throws the document back onto the desktop 2D plane; and this enables a kind of half-circle wiping gesture that makes the throw take place in a split second.

A slight exception occurs for throwing to the left, because tucked away outside the left margin of the open page is a functions bar for items such as "Back," "Forward," and bookmarking. Accessing this bar is a matter of throwing "gently," while zooming out requires throwing more briskly. The distinction between the two, in practice, may be difficult for some to explain or master.

Another design element worth questioning is, why rely on a single-touch system? Why not think toward a multi-touch design, like what's currently available on the Apple iPhone and what Microsoft's experimenting with in its Surface laboratories?

As Raskin wrote in an explanation alongside his video, "Why not multitouch? Because Firefox should be able to run on the least common denominator of touch devices. Especially for touch-enabled interfaces direct manipulation is key. Along that line of thought, the interface should be operable with a finger. Switching between input methods is time-consuming and annoying, so the user shouldn't have to switch to a stylus or other secondary form of input."

Though the source code for Raskin's project is publicly available, he didn't waste any time during his video or within the accompanying explanation, talking about platforms or operating systems or specific SDKs. In keeping with the work of his father, his demonstration was more direct, concentrating first on what could be done before addressing the obstacles of why it can or cannot.

Raskin's business line of work is as president of the software design consultancy Humanized. His services as "user experience lead" at Mozilla were first retained last January, along with two of his Humanized colleagues.

Add a Comment (7 Comments)

BetaNews reserves the right to remove any comment at any time for any reason. Please keep your responses appropriate and on topic. Foul language and personal attacks will not be tolerated.

Name (required):

E-mail (required):

Enter Your Comment:

By MikeTechno

edited Jun 14, 2008 - 12:34 PM

Ok, want to seriously impress me guys? How about this. I hate "gestures" in an interface like this. I don't want to have to remember them and I don't want to have to be limited by them. Do this for me. If you want to do slide-out/scroll away nav controls to make better use of the screen, fine, do it, but don't make me have to rember special gestures on the screen to do it.

Put sensors off the sides of the screen, around the bezel of the screen so that when I want to pull back a nav bar from the side or the top, I simply touch the side or top of the screen....on the bezel of the screen, not on the screen itself!

Samsug did this type of thing perfectly on the virtual buttons on the NV10 digital pocket camera. You simply slid your finger along the row of buttons to scroll through your images. The idea of a touch sensitive surface is great, just stop limiting your context for this to just the display screen. Recall as well that ANY touch screen smart phone is ALWAYS held by TWO hands when used for browsing like this. Has anyone even bothered to consider that the other hand could be used in some way (while holding the phone) to control some of the funtionality/utility of the application?

I think all of these designers have all gotten seduced by the screen as the only possible touch sensitive place on a device that can be useful for controlling an app in this environment. Not the case at all.

I think in this case the touch interface guys need to start "thinking outside the screen".

Score: 0

By iamtux

posted Jun 13, 2008 - 1:49 PM

Its important to remember that this was for the mobile user and isn't supposed to be desktop class. I think this was an excellent proof-of-concept and would be interested in testing it out should a build be released. This could take Safari on the iPhone a step further.

Score: 0

By JeremyGNJ

posted Jun 13, 2008 - 12:58 PM

So basically all this "revolutionary stuff" amounts to minimizing the browser gui...as Microsoft has started to do....and implementing a "thumbnail" view.

Brillant?

Score: 0

By DigitAl56K

posted Jun 13, 2008 - 12:56 PM

Nav controls that scroll away with the top of the page sound extremely annoying. I want my nav handy at all times, along with my rss bookmarks and so forth.

Score: 0

By DonGato

posted Jun 13, 2008 - 2:45 PM

Considering the price of real state in such a small PDA Window, moving controls are a necessity. They will most probably be able to be fixed by an option but you will lose a lot of screen.

Score: 0

By DigitAl56K

edited Jun 15, 2008 - 7:11 PM

That's not true. I don't see why there have to be nav controls there at all, why can't I hit a button to toggle a nav control overlay on, and have it automatically disappear again when I make an action, like entering a URL?

Score: 0

By DonGato

posted Jun 17, 2008 - 10:08 AM

You're being confusing. You want your controls and at the next minute you don't. -_-;

Score: 0