• Bring Mobile Add‑ons to Firefox OS Users

Challenge
Add‑ons for the Firefox browser let millions of Firefox users enhance their browsing experience. We wanted to create a similar add‑on ecosystem for Firefox OS users inside the Firefox OS app store (called Marketplace).

Solution
In collaboration with the Firefox OS team, we created a consistent experience between the Firefox OS phone and Marketplace to allow users to easily browse, select, install, and manage their Firefox OS add‑ons.

Contribution

Firefox Marketplace Home Screen

As a new feature of Firefox OS, we wanted to encourage users to try out the new mobile add-ons.

Marketplace editors could curate a special collection of mobile add‑ons to feature on the Home Page.

View larger image »

Add‑ons Sub‑category Page

We created a new sub‑category for "Add‑ons" beneath the existing "Personalization" category.

In addition, Marketplace Editors could create special collections for mobile add-ons. For instance, a collection of add-ons, wallpapers, and ringtones with a seasonal "spring" theme.

View larger image »

Add‑on Detail Page

Like browser add‑ons, Firefox OS add‑ons could modify a range of OS or application-specific capabilities.

Some add-ons worked only with specific OS versions. Others worked only if specific applications were already installed.

So the add-on detail screen page needed to help users understand these dependencies before they installed an add-on that wouldn’t work on their device.

View larger image »

Upload Add‑on

To support the new add‑ons for consumers, we also created a new add‑on submission flow for developers. Developers began the process by uploading their add‑on to the Firefox Marketplace.

View larger image »

Enter Add‑on Details

Next developers entered details about the capabilities of their add‑on, including support and contact information.

As with Firefox OS apps, we also asked developers to provide information about the apps that the add‑on would modify, the privacy privacy, and the images or video that would appear on the add‑on detail page in the Marketplace.

View larger image »

Add‑on Published

We made the Add‑on management interface consistent with the existing Firefox OS app management interface, so that developers would have a familiar experience.

Developers managed their add‑ons in the same way they managed the Firefox OS apps they'd submitted, including the ability to submit new versions, hide the add‑on, or delete the add‑on.

View larger image »

Overview
I was the Lead UX Designer on this project. I led a team of engineers and product managers through the process of developing the content strategy and user experience for the new Firefox OS Add-ons content within the Firefox Marketplace.

View additional UX artefacts from this project »

UX - Updated Mobile Navigation

In order to include the new mobile add‑ons as part of the existing "Personalization" category, we needed to update our navigation scheme to include sub‑categories.

We experimented with a few options for the mobile navigation. One example is shown here.

View the UX prototype »

UX - Install Add‑on from Firefox OS Device

As shown in this flow, Firefox OS users could browse for new mobile add‑ons by opening their device settings and tapping to go directly to the Add‑ons sub‑category page in Marketplace.

View larger image »

UX - Install Add‑on from Collection

Alternatively, users could open the Firefox Marketplace app on their device. When they opened the app to the Marketplace home screen, they would see the Mobile Add‑ons Collection at the top of the screen. After tapping to view the Add‑ons Collection, users could install any of the featured add‑ons.

View larger image »