branding firefox

09 Feb 2004

screenshot of the new about window

Shortly before Christmas, I had an email from a chap called Steven Garrity, who works for Silverorange, and runs a blog called ‘Acts of Volition’, in which he publishes a radio show on regular basis. (really worth a listen BTW). He asked if I would like to join a recently created Mozilla branding team, with the immediate aim of producing a new logo identity for the Firebird browser, soon to be renamed firefox (Ben Goodger has written up the reasons and process for the name change). The branding team came into being after Steven wrote an article recommending changes to Mozilla’s existing branding. I jumped at the chance, and today Firefox 0.8 is finally released, and the work is no longer confidential.

Over Christmas (thanks Steven!) ideas and concepts were put forward. The timescales were tight (the design would chosen 2nd January), and the concept difficult to illustrate. A firefox is actually a cute red panda, but it didn’t really conjure up the right imagery. The only concept I had done that I felt happy with was this, inspired by seeing a Japanese brush painting of a fox:

first idea for the firefox logo

The final chosen design was a concept from Daniel Burka and sketched by Stephen Desroches, which I then rendered using Fireworks MX. I’ve been using Fireworks over Illustrator or Photoshop for icon design as I love the way I can work in vectors and see the result in pixels, rather than smooth vectors. The updated gradient tools in MX make this possible too.

the original concept sketch and the final logo

As with all icons, the smaller the resolution, the harder it is to create a legible icon. OS X icons start at 128×128 pixels, Windows XP uses 48×48 whereas 95-2000 only has a maximum size of 32×32. Starting with the 128×128 version in all its detail, I scaled this down to the various sizes, and began removing excess and simplifying the shapes.

The different pixel resolutions of the firefox icon

As you can see, once you get down to 16×16, which is used in areas like the windows taskbar and OS X list views, its nearly impossible. I still have some work to do on this and other Mozilla branding, so the project continues.


0.8 is also the first milestone release to have the gorgeous new OS X aqua theme. If you’ve not seen this yet, Kevin Gerich has posted screenshots of all the different screens so that you have proof of all its lickability. Better still, download the 0.8 release and try it out.


Update: Forgot to mention that there is a page of promo graphics on the Mozilla Site – get linking! You can also read more about the project from Steven Garrity

Recent Posts

Differences between Icon and Logo Design on This is HCD Podcast

10 Apr 2018

Twelve South PencilSnap

01 Apr 2018

The Infinite Canvas

09 Feb 2018

Blade Runner 2049

14 Oct 2017

iPad Pro Pencil loop

11 Oct 2017

Troika #32: Tearjerker

04 Oct 2017

Instagram Hickstagram

  • 19 May 2018

  • 18 May 2018

    Loads of flowers on the clematis this year

  • 16 May 2018

    Scott Matthews performing at St John the Evangelist in Oxford. Sublime!

  • 16 May 2018

  • 14 May 2018

    The joy of local news

  • 13 May 2018

    Shillbrook woods (woodland trust)

  • 10 May 2018

    Lille Weekend Day 3 (last day 😥): Palais des Beaux-Arts #latergram #lille

  • 10 May 2018

    Lille Weekend Day 2: the rest, with Mimi the clown and a drink of ‘Sudden Death’ #latergram #lille

  • 10 May 2018

    Lille Weekend Day 2: Lille Cathedral #latergram #lille

  • 10 May 2018

    Lille Weekend Day 1 🤗 #latergram #lille

Contact us

Call Jon on +44 (0)7917 391536, email or tweet @hicksdesign.

Alternatively, pop in for tea and cake at the studio…

Hicks
Wenrisc House
Meadow Court
Witney, OX28 6ER
United Kingdom