MDN user testing for "Command & Query" Search

I recently finished a round of user testing for the Mozilla Developer Network's "Command & Query" search UI, the goal of which is a better way for developers to search and filter content on MDN. This started off as a hackday project in Paris [ read blog post ] and is now functioning behind a waffle flag on MDN. [ try it out ]  We knew this prototype could be improved, so I ran a series of test using usertesting.com to watch and listen to users as they discovered the new UI and walked through a series of tasks. Below is a summary of what I learned and the design recommendations that followed. Follow the tracking bug to stay up to date with the changes. [ bug 1182261 ] 

Read More

Unifying Firefox. Navigation + architecture + language

It’s a bit of an understatement, but a lot has been happening at Mozilla in the past few years, especially with Firefox products and features. We recently set out to create a destination page focused on all-things Firefox & a global navigation where all top-level Firefox products could live. (which we did not have, and as a result, users were not aware of all the products and features we make) By doing so we can better support awareness of all products offered under the Firefox umbrella and an understanding of the benefits of all things Firefox. 

By promoting product awareness and ease of discovery we’ve encouraged cross-product adoption (the metrics agree!) and in turn, hope to build even greater trust among our users that Firefox will be wherever the user needs us to be.

Read More

Your first Hello.

Last week, with the Firefox 35 update, we launched ‘Hello’. Hello is the easiest way to have a video conversation with anyone, anywhere. You can now have a video conversation directly in your browser. If you have Firefox, you can invite anyone with a WebRTC enabled browser (like Chrome and Opera) to join you. So while Hello is a feature in Firefox, you can start a conversation with your friends who might use another browser. Since having a video conversation in your browser is a new concept for most, we’ve taken extra care in stepping users through creating their first conversation.

Read More

User Centered Design @ MozCamp Beta in Bangalore, India

I just returned from Bangalore, India for Mozilla's MozCamp. Mozilla has an amazing global community and MozCamps are where we come together to learn from one another, and leave prepared and motivated to spread our mission and skills with our local communities. The main focus of this MozCamp was to train our core contributors ("train the trainer") and ultimately prepare them for the upcoming FirefoxOS launch in India.

Read More

A new update experience for Australis: our process and design principles

Try it out now in Firefox Beta for desktop!

We’re excited to release a new onboarding experience for users updating to the new Firefox (Australis). We're not just introducing a new design in Firefox 29, but a new way for the web and browser chrome to interact with each other in our onboarding experience.  This will allow us to show, not just tell the users what is new in Firefox and educate them about the browser. With this new interaction we avoid relying on passive viewing of a web page and create a memorable experience that is immersed in the browser. To learn more, see the following blog posts that describe our design principles and process. Also, try it out for yourself now in Beta before it reaches our general release channel and feel free to send me any feedback.

Read More

Command & Query: a better filter and search for developers on MDN

The Mozilla Developer Network is in the process of a complete redesign. Findability and readability are 2 important focuses. Visually, we can support this with a cleaner, responsive, more flexible docs template and new styles across the site. Technically, we can support this with our implementation of elastic search and rethinking how we are tagging and providing access to our content.

Implementing elastic search was a big improvement, but what else can we do to support both the discovery of our content and the behaviors of our developer audience? Below, is a UI proposal that I am working on with Jannis Leidel and David Walsh that I call "Command & Query". Also explained are 2 additional levels of implementation. Presenting lower effort implementation options allows us to choose what variation we can implement now (our MVP) given our other priorities, launch blockers, or desire to test certain aspects of this concept, and build on after launch to reach the full design goal. 

Read More

A few UX changes. A single page. Millions of new downloads.

We recently designed, tested, and released a new version of our our primary download page for Firefox for Desktop. In our tests, we improved the download conversion rate of the top 3 non-Firefox browsers by over 12%! This alone results in millions of additional downloads annually.

Focusing on the entire funnel leading up to a product download and not just the product itself, is as important as the efforts taken to improve retention of a product. This is one of the approaches that the Websites team at Mozilla is taking to improve and support our products.

Read More

Mozilla + Design Gym Workshop #2

Our 2nd Design Gym / Mozilla Developer Network collaborative workshop was held atParsons last week. Besides our regular group of participants, we invited students from theMFA Design and Technology program to join us. Their insight (and enthusiasm!) was really invaluable to the evening. We focused on Understanding the problem, assumptions to consider designing for and questions to explore further.

Read More

Mozilla + Design Gym Workshop #1

Mozilla has teamed up with The Design Gym to hold a 3-part workshop here in NYC. What I think is interesting about The Design Gym process is that it's sort of a hybrid of a design workshop and community discussion since the audience present has some relation to the problem we are trying to solve. We had a great 1st workshop and I'm looking forward to getting farther through the process. 

Workshop #1: Kick-off & Examine 

Workshop #2: Understand 

Workshop #3: Ideate 

Read More