Native UI for Firefox on Android

It’s been a month since Johnathan publicly announced the native UI for Firefox on Android. So it’s probably a good time to give everyone a quick status update. In case you haven’t heard about it yet, we are re-implementing Fennec’s UI using Android’s native platform to be able to deliver a much better performance and UX to our users on Android devices.

In terms of architecture, one of the key points of the native UI is to move Gecko and XUL out of Firefox’s startup path on Android. This way, the UI can start up and respond to user interaction immediately while Gecko and XUL load and run on a separate thread. The communication between Gecko and the native UI then happens through a simple message system. This means we’re replacing Electrolysis with a lighter architecture that brings similar benefits. For the curious, Mark Finkle wrote an architecture overview with more details.

We’re landing the new code on a separate repository called “birch” which will eventually be merged in mozilla-central. Large parts of the primary browser UI have already been implemented—AwesomeBar, tabs, bookmarking, notification popups, addons manager, preferences, context menus, and more. We also have a new panning/zooming implementation that is extremely fast and smooth. The design team is bringing a new phone UI for Firefox that is both beautiful and simpler. The new design is part of a wider effort to streamline the Firefox UX on all platforms, desktop and mobile.

This is all very exciting but there’s still a lot to do to make it all feature-complete, stable, and ready for users. If you want to help us with feedback and testing, install the native UI’s nightly build on your Android phone. Don’t have an Android phone? Mozilla can give you one! Have a look at our Test Drivers program page for more information.

It’s key to Mozilla’s mission to have a strong presence on the mobile web space. We’re working hard to make Firefox the most exciting mobile browser on Android. Development is moving insanely fast and I can’t wait to see the new UI delivered to our users next year!

Get Involved in Firefox Mobile

I’ve volunteered to be a community steward for the Mobile team as part of the Contributor Stewards program that has been recently created in Mozilla. My role as a community steward is to find ways to get more people involved in Firefox Mobile.

As a first step, I thought it would be a good idea to create a Get Involved page for the Mobile team. This page is meant to have only the minimal steps to start contributing to different areas of the project—it shouldn’t feel overwhelming. For now, it only has content for hacking and testing but it will include other areas soon.

I have also compiled a list of bugs that are good for first-time contributors and assigned mentors to each of them. The mentors and other team members will assist you with any missing information and useful source code links.

If you’re still unsure where to start after reading the Get Involved page, we’re always on IRC to answer any questions you might have. Firefox Mobile is a key part of Mozilla’s future and is definitely an exciting project to be part of. Join us!

HTML5 Form Validation in Firefox Mobile

My patches to add HTML5 form validation support to Firefox Mobile have landed in trunk yesterday. This feature has been available on desktop since Firefox 4 but it wasn’t implemented in Firefox Mobile until now.

In case you haven’t heard about it, HTML5 supports automatic input validation. This means that your browser can take care of validating form fields for you—no need to write custom JavaScript code to check for required fields or validate common types of input such as numbers, emails, URLs, etc.

So, how does HTML5 form validation look in Firefox Mobile? Very similar to Firefox on desktop. If you submit a form that contains any invalid data—an invalid email address, a required field that was not filled in, and so on—the form will not be submitted, all invalid fields will be marked with a subtle red border, and the first invalid element will be automatically focused showing its respective validation message (see image above).

As far as I know, the only mobile browsers that support HTML5 form validation right now are Firefox and Opera. You can try this feature on our mobile nightly build. As usual, general feedback, bug reports, and patches are welcome!

Firefox for Tablets on Nightly

Firefox for Tablets

We, Firefox Mobile front-enders, have been working hard for the last few weeks to get the new Firefox UI for tablets in place for general testing. It has now reached a functional state that is good enough for getting some early feedback. So, how can you help us?

First of all, you can simply install Fennec’s nightly build on your Android tablet and give us some thoughtful feedback on the UI. File bugs for the missing bits from the planned design, report interaction problems, let us know about broken bits, etc.

Secondly, if you want to contribute code, have a look at our current list of tablet-related bugs—see the dependent bugs—and let us know what bugs you want to work on. Setting up a Fennec development environment is fairly simple, you can find instructions in the wiki.  Feel free to ask for help either on IRC (#mobile at irc.mozilla.org) or on the specific bug reports. Just ping mfinkle, mbrubeck, wesj, sriram, or me.

Keep in mind that this is very early stage work. There are lots of rough edges and design is continuously evolving. In case you missed it, Ian Barlow, from our Mobile design team, has blogged about the tablet UI design a couple of weeks ago—definitely worth reading. This is all looking very promising and we can’t wait to get it out to users once it’s ready!