Skip navigation

The Firefox 3 Visual Refresh: System Integration

I am so pumped about this: Mozilla is going to ensure that Firefox 3 looks like a native Vista app when running on that system (likewise, it will look like a native XP app on Vista and a native OS X app on Apple's OS). Bravo. Here's a great post describing this move:

As we get closer to moving Firefox 3 from the alpha stage to the beta stage, testers of Minefield (our nightly builds), and people who follow the user experience team’s mockups on bugzilla and forums like dev.apps.firefox are starting to see some glimpses of what Firefox 3 may look like. Since I haven’t posted to my blog yet about our strategy for the visual refresh, I figured I am long due for a post about what we are trying to accomplish, why, and when it is going to land.

Visual Integration with the Platform

(Click image for more info)

Visual integration with Windows and OS X is our primary objective for the Firefox 3 refresh.

Fitting in to the visual appearance of the native operating system may seem like a reasonably obvious decision, but it certainly isn’t one that every cross-platform application or windowing toolkit makes. For instance RealPlayer uses a custom appearance across operating systems, as do applications built using Java’s Swing windowing toolkit. Personally I think a unified cross platform UI results in applications that at best feel foreign everywhere, and at worst don’t even feel like real applications. Making XUL appear truly native means we have to do some extra work when new operating systems are released, like Vista and Leopard, but I think this work clearly results in a superior user experience.

With this release of Firefox we are trying to achieve an even closer level of visual integration than we have had in previous releases. For instance, we are planning on having two different sets of icons for Windows: a set for Windows XP that uses the XP color palette, and will have the correct plastic reflectance, and a set for Windows Vista that will use a larger color pallet for objects, a smaller color pallet for glyphs, and the icons will be appropriately shiny. For Firefox 2 we weren’t able to ship two icon sets, so we literally averaged the two different aesthetics and created a theme that looked sort of right on each platform.

Hide comments


  • Allowed HTML tags: <em> <strong> <blockquote> <br> <p>

Plain text

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.