in Icon design

Interview with Firefox logo designer Jon Hicks

Jon Hicks is one half of Hicksdesign and has been working as a lead designer with Opera software. He is known as the logo designer of Firefox, Thunderbird, Silverback and Mailchimp. Needless to say, he is one of the most talented and hardworking designers focusing on both icons and logos.

I’m married to Leigh, the other half Hicksdesign, and have a daughter (9) a son (almost 8) a puppy (8 months) and 2 guinea pigs (2). I live and work in Witney, a small town west of Oxford in the UK, which I moved to 10 years ago. We really like it here, it’s on the edge of a very beautiful part of England called The Cotswolds.

My big passion is for music, but I recently took up cycling and I love it. There’s a lot of geekery with bikes and bike components that appeals to me as much as the joy of riding in the country. I’m also partial to a spot of gardening and making custom Lego minifigures. My kids and I are building a Lego Harry Potter chess board based on the last battle scene in The Deathly Hallows.

You have an education from art college and have been doing wildlife illustrations. How did you end up designing an icon for an open source web browser?

Wildlife Illustration was a hard market to get into in the UK, and I needed money to live on, so I took a job as a Junior Designer instead. I learnt design on the job (I’d been taught Mac skills at college at least), and after a few jobs went freelance in 2002.

Freelancing gave me the opportunity to learn web design, but I also started making my own icons. I created an icon for Camino, which was based on the famous Hokusai painting ‘the wave’. Steven Garrity, who was charged with putting together a team of volunteers to look at the icon for Firefox and Mozilla branding in general, saw the icon and asked me onboard. The final icon was very much a team effort, with Stephen DesRoches and Daniel Burka in particular. A few years later, it was remade by The Iconfactory to support the new, larger, icon sizes in Vista and OS X.

Firefox has more than 140 million daily users. How does it feel to know that your work is seen by millions of people everyday?

It’s weird but these days I see it so much that I’m not aware of it. It was also over 7 years ago, and I’ve done so many projects since then, I forget that I had a hand in it. It also no longer feels like ‘mine’ as others have since updated it.

Last year you left Opera to try something different for a while. What have you been working on?

I’ve been working with Shopify (logo refresh), Jolicloud (iconography), Simplenote (logo, web app and mobile app design) and Skype (that big project will soon become live).

I’ve also designed a Word Press theme for The Theme Foundry called Shelf, which became one of the first premium themes on I’m also working with Opera again on UI work!

You have recently announced an icon design handbook, which I am very excited about. Can you tell us more about this new book? Why did you decide to write it and who is it for?

First of all, I decided to write this about 5 years ago, because there weren’t any books around on the subject, and there still isn’t today. It’s unusual in the tech publishing industry to have a subject that hasn’t been covered once, let alone multiple times!

Also , the conditions are right now for me to make this book. The right publisher is here (Five Simple Steps) who care about the finished product, and the right editorial team. The subject has also grown a lot in 5 years, since iOS and Android have come onto the scene. There is a greater need for icons these days.

The book will take you through a workflow of how to create icons – be they favicons, app icons or UI elements. It won’t focus on how to create them in one particular application, but rather show the thought process and technical considerations. I’m hoping to feature as many as of todays icon artists as possible – I won’t just be a book of my work. It’ll be manual, reference guide and Coffee table book in one. Something you would read to inspire as well as inform.

My favourite book when I was young was ‘The Detectives Handbook’ , and I think it’s title left a big impression on me!

There are not many design books that cover icons at all, so a whole book about it is just fantastic. Can you give us an example of a chapter from the book?

It’s still early days, as only yesterday I was revising the book structure again to show different workflows better, but one chapter is looking definite – “Icons along the user journey”.

App stores seems to be popping up everywhere and app icons seems to be an important part of the branding and possibly the success of an app. What do you think are the most important things to consider when designing an app icon?

You always need to design in context, so in the case of app icons, that means working on it with other icons next to it – a screenshot of an iPhone home screen and App Store to make sure it stands out amongst the sea of generic blue icons, and also works on a dark and light background.

How is doing an app icon different from working with a normal ui icons?

App icons are more akin to logos – and logos are meant to be unique. They don’t need to communicate a particular action (Home, Reload, Back etc.) but provide a memorable and recognisable mark for the app. It can suggest what it does, but can be as simple as a logo mark or glyph. Icons within an interface serve a different purpose however – they work best when they’re not unique, rather following existing conventions to ensure understanding.

You have made some amazing illustrations. What is the process for doing these illustrations? What inspires you and how long does is take to finish an illustration?

Wildlife illustrations would take around a month, but more recent ones like Mailchimp would be a matter of a couple of days overall, with all the iterations.

I use Google Image Search and Flickr a heck of a lot when researching and getting ideas. A process that would’ve taken days back when I was doing wildlife illustration, now takes a matter of minutes.

HTML5, CSS3 and support for formats such as SVG gives designers like you more freedom for creating great designs. Which new technologies can get you really excited as a designer?

I’m very excited and hopeful for SVG still. It has the advantage of being supported by professional drawing tools such as Illustrator, and when you see what you can do in a browser that does support it (Opera has the best SVG support). For example, it will get around the problem of bitmaps on logos an icons on different resolutions with one small file. Resolution Independence is going to be vital in the coming years.

CSS3 is also very exciting from a web design perspective, as a graphics editor is needed less and less. A lot can be achieved with CSS now, in a browser that supports it at least!

Ok, last question – You have been talking at FOWD before – will you be speaking at conferences this year?

I’m taking a year off from speaking and attending this year, to make sure I get the book written, even though I’ve had more speaking invitations than any previous year! I timed that wrong didn’t I?

I’m sure the book will make you an even more popular speaker at conferences. Thank you for your time!

You can find out more about Jon Hicks on You should of course also follow him on Twitter:!/hicksdesign<

Write a Comment