New Firefox Icon: Iterations 11 to 14

Yesterday and today there was a flurry of quick iterations on the new Firefox icon based on all of the feedback we have been receiving. Tomorrow I’ll likely have some in context shots of iteration 14 posted (similar to the images of iteration 10 in context).

The icon is being rendered by Anthony Piraino at the Iconfactory. The design has been influenced by a conceptual sketch by Jon Hicks, and a conceptual render by Stephen Horlander.

Differences between these iterations are pretty subtle, in this set we were primarily working on the globe’s continents, texture, and lighting. Across all of these iterations the globe is darker than it was in iteration 10 (something that a lot of people commented on). The Firefox head is also a bit lighter across all of these iterations.

Shiretokofirefoxicon-I11

Shiretokofirefoxicon-I12-1

Shiretokofirefoxicon-I12-2

Shiretokofirefoxicon-I12-3

Shiretokofirefoxicon-I13

Shiretokofirefoxicon-I14

Background Information on the Project

-Creative Brief
-Evolving a Product Brand
-Thinking about Refreshing the Firefox Icon

30 comments

  1. I’m glad you FINALLY brightened up the head! :-)

    I can live with this.

  2. Man, this almost brought a tear to my eye. A happy tear that is.
    I love the entire fox and tail!

    I most definitely don’t care for anything from 12-2 to 14. The gloss/reflection shouldn’t be seen as yet another detail or part of the icon. It should just be there. It’s currently distracting and detracts from the other elements.

    I like the lighter blue at the bottom of the globe in 11 because it becomes harder to distinguish the water from the land in the same area in 12-1 when viewed at smaller sizes. In other words, it just looks like a dark blue area.

    I do like that in 12-1 the snow cap and gloss is dropped a bit revealing more of the very top of the globe to create more contrast when viewed on lighter backgrounds, but I don’t care for the overall colors of the globe. It looks over saturated and cartoonish. I liked the shades of colors in the globe in i10 quite a bit. They were more subtle yet rich and allowed the fox (even then) and tail to contrast well against the globe in general. The gloss in 12-1 is good though.

    So to wrap it up…
    Just change the colors and shades of the globe in i12-1. And please, nothing more, nothing less. It’s sooooo very close to perfect.

    By the way, great job on all of them. While this is a tough gig I’m sure, you must admit it’s an equally awesome one. :)

  3. You should post these icons at their expected size 32x32px for XP/Vista.

    All these iterations are entertaining but you’ll loose most of these details when they are rendered at size.

    In general I think these changes are too conservative. It’ll look fine on the Firefox homepage but on your desktop the change will be too subtle for most people to notice.

  4. We need to have context for Linux with iteration 14, please.

    I like 12-1, it looks great as posted but the later ones would look better at smaller sizes where the roundness would become more prominent — ie., more depth and clarity.

    I don’t know about having the highlight *and* the ice — looks like a blown-out highlight to me.

  5. When will topographic models of the globe be available?

  6. Yeah! 14 and 12-2 FTW! Perfection! The differences from the ff3 icon are less drastic, but it looks really clean and smooth and fresh while remaining familiar! I think you could probably get by if you mixed one of these with iteration 10, so that it would at least be a little more of a change, but if not it’s still great! Thank you!

  7. The assymetrical reflection on the globe in 13 and 14 looks a bit weird.

    Other than that I find it hard to choose. 11 or 12-1, I think.

  8. Nice! i really like the top border now.
    The only thing i have a concern on is the reflection line that looks starting from the fox’s nose.
    But this is really awesome.

  9. My vote goes for #12-2 or #12-3.

    If the asymmetrical reflections in #13 and #14 can be more subtle, then I might be convinced. At the moment they look a little distracting.

    Maybe also bring down the saturation slightly? Or try a different shade of blue?

    I love the way the tail wraps around the globe, but it still looks a little ‘staged’ in places. Especially the 4pm gap (2nd gap from bottom). It looks like it is being forced around the globe at that point, rather than naturally wrapping.

    But if everyone loves the tail and feel there is nothing wrong with it at all, then it must be my own personal style preferences.

    Looking forward to seeing the in-context images.

  10. 11 is my favourite. I don’t really understand the oddly shaped highlight in the last few?

  11. 12-3 is my favourite, I find the glare a bit to much in the later version, I find it distracting. I also think it will be even more distracting in the tiny 16px versions…

  12. Kurt (supernova_00)

    I like 11 or 12-1. In the rest, the top of the globe looks washed out and 13/14 the line near the nose looks really funny. I still think the “turd” should be lightened. The continent or island below his paw is distracting in smaller sized images. That is practically the first thing you notice because it is so dark. I can’t even imagine how distracting is will be in the Minefield icon (not that the trunk’s icon matters too much).

  13. I think the fox looks great.

    Not sure what’s going on at the top edge of the globe on 13 and particularly 14. Are those dark blue bits land masses coming together or a weird side effect of the highlights?

    I think 12-3 is my favourite globe.

  14. I’ve never understood why ‘Fire Fox’ has the icon with the Fox first, and the Fire second. It dawned on me that this could be the reason ‘old people’ always seem to call it Foxfire.

    What about flipping the icon, has anyone ever looked at that? So that ‘reading’ the icon left-to-right says, “Fire…Fox.’

    Just a thought.

  15. I 11 and 12-1 get my vote.
    I really want to see the smaller sizes, though, since that’s where the problem really was. The full-sized icons were good from the beginning.

  16. 11 because the globe has minimal, if any, glass reflection factor and the others appear to have some sort of motion line(s) interfering with the top of globe as if they are trying to emphasize the spinning of foxie. Interesting idea but I don’t think it works.

    Also like the treatment of foxie’s neck fur. More yellow instead of orange is nice.

  17. 11 and 12-1 are the best looking to me because the shine on the globe isn’t so harsh as the others.

  18. I like 11 and 12-1. The glare on the globe is really distracting in the later iterations.

  19. Definately 12-3!

    A beautiful compromise.

  20. I think iteration 12 – 1 is the best one and also should be the one to lock down. I can’t wait for this! :-)

  21. 11 or 12-1 (I can’t spot much difference). Darker and no highlight is good; the globe is not a billiard ball.

    Gerv

  22. 12.1 is quite good …

  23. I agree with the previous posts that the shape of the reflection in #13 & #14 looks a bit weird. The ‘S’ shape almost looks like some sort of subliminal message. Other than that, AWESOME!

  24. Wow, I’m suspired I’m the only one who likes the asymmetrical highlight, even if it’s a bit strong right now, I like the lines. It feels like it gives the globe a bit more energy and feels less like a cliched aqua ball.

    The simplicity of 12-3 is appealing though. In 12-1 The highlight seems too harsh towards the top and the added gradients on 12-3 break it up a little.

  25. The asymmetrical reflections in #13 and #14 could perhaps do with a slight gradient or diffusion, so that it doesn’t look so sharp. I like the idea, but its just not done well enough yet.

    Icon/logo design is not about creating reality. Its about playing with reality. The fox is certainly not a realistic representation of an actual fox, but one can recognize it as being a foxy and fiery character. The same goes for the globe. If it has a reflection or shine, it doesn’t matter if it has a crystal-ball look. Its about it being delightful, playful and fun. We shouldn’t judge something as ‘bad’ simply because it doesn’t look like pure reality.

  26. Iteration 12-2 looks best – nicely lit!

  27. 12.1 is my favorite ;-)

  28. My favorite is 12-2.

  29. I really like 14. The asymmetrical reflection is unique and really works, I think. The only problem with it is, as mak77 (#8) mentioned, the reflection line looks as if starting from his nose, though I hadn’t noticed this until I read mak77′s comment.

    Additionally, I think the fur on the snout is a bit too scruffy. It could be simplified some please.

  30. You’ve got to be kidding me. Why fuss so much over an icon? They all pretty much look the same to me. If you had spent more time fixing the slow startup problem, and less time worrying about tiny details to the stupid icon — you’d have a lot fewer ticked-off people right now.