Friday, June 13th, 2008

Mozilla Week: From Client (Firefox 3) to Server (Weave) to Mobile (Fennec)

Category: Browsers, Firefox, Mobile

It has been a busy week for Mozilla. We have seen news across the board of their technology.

First we have the news that Firefox 3 should be available to download on June 17th. They are having a download party to kick things off.

Stuart Parmenter had a proxy post that delves into the world of fonts and text:

When Mozilla developers decided to incorporate the Cairo subsystem and build a new graphics layer from scratch, they also decided to completely rework the system that renders text in the browser.

Text is an incredibly important part of the Web. While graphics, audio, and video are increasingly common, we still spend the majority of our time on the Web just reading stuff. All the words you read in a web browser are rendered using a font which contains a set of glyphs used to form individual letters. For more simple written languages there may be a straightforward one-to-one mapping of characters to glyphs, but for more complex languages, one glyph may represent multiple characters.

Ben is a huge fan (a.k.a. anal) of this type of thing. Fonts and rendering can make a big difference, and the post goes into detail on what is going on in the new Firefox 3 engine. It discusses kerning, ligatures, hinting, font smoothing, anti-aliasing, and more. After reading this post you may want to watch Helvetica the movie!

Then we go to the mobile side, where Aza Raskin has posted concept video on the new touch screen interface that they will be building for Fennec. There is a ton of detail in Aza’s writeup including design principles:

Touch. This concept prototype for Firefox mobile (code name Fennec) is being designed for a touch screen. 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. Firefox will work on non-touchscreen devices, but that’s out of scope for this demo.

Large targets are good. The same fingertip that controls the interface takes up between 1/5th to 1/10th of the vertical/horizontal height/width of the mobile touch-screen. In other words, fingers are fat: hitting small targets is like trying to touch-type with your elbow. All actions should be represented by targets that are large enough to be fast, easy, and (at the very least) not aggravating to hit.

Visual Momentum and Physics are compelling. Nothing shouts “sexy!” like pretty animations and a physics engine. Beyond marketing appeal, there is a strong argument that such physicality helps the user build a mental model of the interface, and that interface physics yields consistency. We are wired to track the movement of things and to be able to remember where they’ve gone, as long as they don’t appear and disappear, which doesn’t happen in the real world. Of course, copying every physical metaphors blindly gets you interfaces like the multi-million dollar blunder that was Microsoft Bob, so we need to select our metaphors carefully.

Typing is difficult. This means we want to minimize the amount of keystrokes required to get anywhere or do anything.

Content is king. With restricted screen size, every pixel counts. As much of the screen as possible should always be dedicated to content, not controls or cruft.

Then we move to the server side with a Weave status update that should be shipping with Firefox 3. It includes new features around data types, bookmark sharing, and a Web client view. Check out the Wiki for more details.

Posted by Dion Almaer at 1:35 pm
1 Comment

+++--
3.3 rating from 26 votes

1 Comment »

Comments feed TrackBack URI

Opera?! Opera 9.5 was released yesterday?! This is MOZILLAAAA WEEEEK!!!

Comment by mrmass — June 13, 2008

Leave a comment

You must be logged in to post a comment.