In the spirit of its open-source initiatives, Mozilla, the maker of the Firefox open-source browser, decided to be completely transparent about its entire rebranding process, documenting it extensively online. The project is being executed in partnership with Johnson Banks, the London-based brand identity agency, and the public is invited to observe its development and comment on the process.

Firefox set a milestone in web typography by being the first browser to support the WOFF webfont format that made the webfont boom possible. Shortly thereafter, in October 2009, Typotheque became the first foundry to launch a webfont service, and license its entire collection for both print and web. So when Mozilla’s creative directors Yuliya Gorlovetsky and Tim Murray approached us to define the typography of the new wordmark we were thrilled to contribute to this project.

Mozilla 12jan 1500px logo2

We started by looking at our collection of existing typefaces, identifying Tesla Slab as a suitable basis for the new wordmark. Tesla was only a starting point, however, and all letterforms were modified to create an entirely new design. Here is the process that led to the final form of the wordmark:

mozilla logo development

With the wordmark finished, we were asked to design a complementary typeface to match the personality of the new logo. Starting again from Tesla Slab, we crafted a new typeface specifically for this project: Zilla.

johnsonbanks Mozilla zilla type 2

Graphics by Johnson Banks

Once it is finalised Zilla will become a freely available open-source typeface. At this moment, we are defining which styles the family will contain and what language support it will include.

It has been an exciting project, and since Mozilla engaged with the design and tech community throughout the design process Zilla has been warmly welcomed by the public on the internet, a rare feat these days, when everyone is a critic. Perhaps the method of giving a voice to users early on through times of change is an idea that we can all learn from.

Animation by Johnson Banks