Discovering Add-ons in Firefox 4

Back in March I blogged about an idea to make the Get Add-ons pane of the Add-ons Manager in Firefox 4 remotely hosted and much-improved. It would help users learn about and discover new add-ons through fresh content and recommendations. This afternoon we launched something extremely close to that:

screenshot of Discovery Pane

You can see it for yourself by opening the Add-ons Manager in a Firefox 4 beta or nightly build and going to the Get Add-ons pane. (Note: if you see the homepage instead, switch to the Extensions pane and back to fix it. This bug has already been fixed with today’s nightly build.)

There are a few things to keep in mind when exploring this page:

  • Only add-ons compatible with your browser are shown, so if you’re using a nightly build right after a version bump, you may not see many featured add-ons for a couple days.
  • The pane still has a number of features and improvements left to be implemented, including an add-on details page that loads in the pane instead of a new tab.
  • The theme/styling of the Add-ons Manager (the area surrounding the Discovery Pane) is not yet fully implemented.

Screenshot of single column pane

Because this page is only viewed in Firefox 4, the web developers working on it were able to take advantage of two recent CSS features. Instead of JavaScript, the promotion module uses CSS transitions for its rotation and arrows. We’re also using CSS @media queries to make the page flow to a single column when the viewport is not wide enough to show both columns.

It’s really exciting to see this come together thanks to the help of many people. Be on the lookout for more improvements over the next few months leading up to the release of Firefox 4.