UX Evolutions: How Firefox Has Changed over the Last 14 Years
In the second part of our new series UX Evolutions, which explores how the user experience (UX) and user interface of some of the most prominent online services have changed over the years, we’re examining how Mozilla’s open-source browser Firefox has evolved since version 1.0 launched in 2004.
Firefox has gone through many changes (60 versions to be precise), and one of the most recent ones, Firefox Quantum, has been widely seen as one of the most significant refreshes, and heralded as a comeback to compete with Google Chrome.
We talked to Stephen Horlander, principal designer for Firefox at Mozilla, about evolving the UX of the browser, the role of user research and prototyping, and what’s next for Firefox.
What was Firefox’s user experience like at the very beginning?
Firefox (initially called Phoenix) was an intentionally pared-down experience. The goal was to distill the complex Mozilla Suite into only the essential components needed to browse the web.
The result was a more accessible and faster browsing experience. The flipside was that this meant a lot of the features that had evolved over the years were either discarded or reverted to more basic functionality.
While this meant that some features people were used to were no longer available, it also allowed for new opportunities. It created the space to add new things that could make the modern web more manageable and enjoyable, like pop-up blocking, tabbed browsing, and a search bar for directly using a search engine from the browser toolbar.
How has the UX changed over the years?
While many things have been added (and removed) over the years, the core functionality and focus on navigating the web have remained consistent. Most of the changes have been in building features and functionality to support that foundational experience.
Since Firefox started off as a reimagined take on what a web browser could be, many of the pieces could be rebuilt based on current needs and changes to how people used the internet. This resulted in key user experience changes, like a more expansive library for storing and retrieving the things you find on the web; the ability to restore your browsing session, making it easier to pick up where you left off; and the “Awesome Bar,” an improved location bar that adapts to your behavior and surfaces the most relevant item — whether that is a URL, a history item, a bookmark, or a currently open tab.
The web has changed a lot over the 14 years since the first release of Firefox. Websites have gotten larger and more complex, and we have seen the rise of more (and more prevalent) forms of tracking users behavior online.
Firefox has adapted to these changes in the environment with tools like the Private Browsing Mode and Tracking Protection to help protect people both on their local machines and online from website trackers.
Over the same period of time, the amount and types of devices that people use to access the web have changed dramatically. Smartphones as we view them today didn’t even really exist at the time Firefox was released. Now smartphones are nearly ubiquitous and the internet is on your TV, your wrist, in your lightbulbs, and on a variety of other devices. This has made syncing your data between your devices, including your browsing data, an important means of keeping track of information and tasks.
We have also had to adapt to changes in the underlying operating systems that Firefox runs on. Many interaction and visual changes have occurred from Windows XP, to Windows 7, to Windows 10, with a similar and comparable level of changes on macOS, Linux, Android, and iOS. Firefox now incorporates system-level functionality like system notifications and adaptive interface changes for hybrid devices that have touch screens and keyboards.
The visual look and feel of Firefox have also changed several times throughout the years to reflect both the ever-changing aesthetics of OS environments, as well as expressing its own brand and aesthetic values.
Most of last year was spent working on Firefox Quantum, which is probably our most extensive refresh ever. It comes with an entirely new visual look and feel, more system integration, new UI surfaces that highlight the sending, saving, and retrieving of your data, and perhaps most importantly an updated rendering engine that is much faster and more responsive.
What are the main considerations in evolving the UX of the browser?
One of our main considerations when evolving the UX of Firefox is trying to make sure we are addressing what people need in the constantly and rapidly changing landscape of the internet. A lot of this effort involves carefully balancing the adding of new things that we think will be meaningful, with the removing or changing of things that are not as relevant or as useful as they should be.
Web browsers serve an important function for people: they are the view into the wider world of the web, they are a user’s agent in accessing and displaying a vast amount of variable content. Firefox needs to help users navigate the web, but should only help as much as a person wants it to help or needs it to help.
What role does user research play in the design process?
User research serves different roles at different stages in the design process. Early in the design process we do research to try and figure out how people use the web, what role browsers currently play, what their goals are, and what obstacles they are encountering with their available tools. We consider what other technologies and systems they are currently using to solve these problems.
Then we ask ourselves if there is any opportunity for us to solve these problems more directly, or whether we can elevate the tools people are already using to solve their problems. A good example of this for us is the Screenshots feature we recently added. Our research showed that people use screenshots as a way to remember, share, and save information. So we enabled that directly in the browser as an easier way for people to capture and share that information.
Later in the design process we use user research to evaluate how close to the mark a solution is.
How do you prototype and test the user experience at Mozilla?
We use different levels of prototyping at Mozilla. For early-stage ideas we use low fidelity wireframe prototypes to get a feel for whether something seems promising and do some user testing on those. When things are further along we occasionally use higher fidelity HTML/CSS/JS prototypes to communicate a more realistic level of functionality.
For projects that require more comprehensive testing and feedback we have something we call Test Pilot. Test Pilot lets us try experiments using browser extensions or web services. These experiments are closer to what you would actually get with a design, and we can test and get feedback from a larger audience.
What’s next for Firefox’s UX?
We are currently focusing most of our efforts on continuing the work we started in 2017 with Firefox Quantum — which means continuing work on enabling faster and more responsive web experiences. A lot of the enjoyment and utility people get from the web is related to how fast it works for them. As websites get larger and more complex, things tend to bog down. Doing everything we can to make those experiences be faster, and feel faster, is important.
In conjunction with that, we are always working to improve Firefox’s ability to increase privacy and to shield people from increased levels of web tracking. This means making our Tracking Protection technology more robust and powerful so that people can have a cleaner and faster browsing experience.
Another thing we’re focusing on is increasing options for customization. This includes expanding the capabilities available to browser extensions, like enabling more extensive tab management options. We are also expanding the capabilities of themes to include more UI surfaces and options. This will enable users to take Firefox beyond the default experience and make it look and act exactly how they want.
Also check out Part 1 about the UX evolutions of Dropbox.
For more UX insights sent straight to your inbox, sign up for Adobe’s experience design newsletter.