New Firefox Icon: Iteration 10

Note: this is a draft icon rendering for Firefox 3.5, subsequent iterations will be posted every 24 hours or so.

This tail is essentially a blending of iterations 8 and 9. The top of the tail features the dimensionality and highlight lines of i9′s design, and the bottom the tail softly transitions into the fox’s fur, leveraging the continuity and balance of texture found in i8′s design.

Additionally there are some small modifications to the shape of the tail, and this iteration also introduces an OS X style shadow. The OS X shadow is just for some additional context, for the release candidate icon we’ll be customizing the shadow by platform, using an upper left light source on Vista and Windows 7.

Shiretokofirefoxicon-I10

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.

Background Information on the Project

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

37 comments

  1. Thomas Stache

    This is shaping up to be really nice! One thing I would like to see changed is the fur on the head, the old icon and Stephen’s concept didn’t look so bald as all the latest Iconfactory designs. In those the head just looks like a circle, and I don’t like that too much.

  2. It looks just great now. Is it the last iteration?

  3. Looks great! I love the way the world peeks through the tail; it really emphasizes the concept of ‘wrapping’.

  4. I like the OS x style shadow and the highlight transition is done well.
    The 2pm, 3pm, 4pm and 5pm wrapping around of the tail could do with a little tweaking. Maybe removing either the 3pm or 4pm gap, so that the intervals between fur and gap are not so regimented?
    The errant tuft of hair also needs tweeking.
    I also don’t like the dark landmass at the bottom. Maybe needs to be not so dark?

  5. Can’t really think of much else to say about the details. Think this looks good.

  6. Will be buying the t-shirt for sure, once all is done. I wonder what FF4 will have in store for our Foxy friend?

  7. Lorenzo Orlandi

    very good! that’s coming along very nicely :)
    as Nitin pointed out, the “flames” wrapping the globe are still very similar…
    the highlighting of the globe is still a bit weird too :/
    great job anyway!!!

  8. IMO this one is perfect.

  9. You dismissed Horlander’s design saying that “the icon is a little less of a departure from the previous shipping version”

    The very same could be said about this design! Perhaps even more so.

  10. Platform-specific shadows and light sources will be a big improvement. I think you guys have hit the nail on the head with this iteration.

  11. Kurt (supernova_00)

    Alex stated before that focus was on the tail for now and then maybe work on the rest of the icon if there is time.

  12. I like it a lot. Especially the tail and how it blends into the body.

    And even if the nose haven’t changed for a while, I have to say that I really like how it looks.

    I’d still add a bit more texture to fur so that head and body would look a bit hairier than they look now.

    In current (Firefox 3) icon the patterns in the fur are more visible and there are few tufts of hair on top of the head. I’d like to see something like this. Of course with the style of the current design (iteration 10), you can’t really compare the firefox 3 icon with the current iteration.

  13. sans.sin.cera

    Agree with the other comment here that the head needs some stray-away fur so that it goes better with the ears and nose. Aside from that, the tail is now perfect, and so is the globe, and body of the fox. Just fix the smooth head and your done.

  14. Take a close look at the fox’s arm… it doesn’t really look like it’s connected to the fox in any way. Isn’t there a way to make the arm more a part of the fox instead of just a samey colored worm like appendage?

  15. I think I really like this. Also, I finally “get” the perspective: The world is wrapped in the furry “flames” of the Fox’s tail and his upper body is pawing and examining it in front.

    The blue border on the left above the Fox’s head looks out of place. It throws off the lighting and also makes me think of the O in Opera, only blue.

  16. can’t see a significant difference b/w this and iteration 9 however I expect that is a good thing :)

  17. That’s perfect!

  18. very good work! it’s the best so far from iconfactory. as a suggestion, note how almost all bits of fur in the tail follow the same direction: I would make it a bit more messy (horlander’s version gets this better).

  19. The tail looks pretty good!

  20. it looks excellent
    the only comment i have is that the globe is rather pale, unless you meant it that way

  21. At first I also thought the globe was a bit pale. But on second thought, it really matches the fox!

  22. This absolutely nails it for me, except for the rather long transition line between one of the flames and the body around 6pm. That transition looks unnatural, and should be shortened around 40%.

  23. I second post #9 by commenter “C”:

    “You dismissed Horlander’s design saying that “the icon is a little less of a departure from the previous shipping version”

    The very same could be said about this design! Perhaps even more so.”

  24. Hey this is something that I could live with. Nice! But…
    A few iterations ago, I had started creating a diagram to support my argument(s) for better overall balance and symmetry that took several hours but I stopped knowing that the icon’s design would change several more times and I was hoping that the issues would be addressed. The globe does look much better, actually great, and at this point and where the icon stands, the tail is going to look good no matter what, but the fox’s head should be made to be brighter to provide visual balance.

    The things that we notice first when looking at things are usually the lightest and brightest and those which contrast elements in its surrounds. Then we process the details and move on.
    So we look, focus, process, it registers, and then we move on to the next element.

    The first thing that is most noticeable when looking at the icon here (and others) is the brightness and colors of the globe. When viewing the icon at smaller sizes, few details can be made out so we look at it and move on to the next brightest thing, the tail. That has the most details and so it will be viewed longer to focus on it and process the details. Then, the head is last because it’s the darkest element and since it doesn’t appear to have many details at smaller sizes it will only be viewed for a very short period of time.
    After that, a person may scan the logo a few more times before realizing that they have other things to do with their life. :)

    All of this occurs within fractions of a second and processing is done subconsciously.
    The mind can be tricked so to speak by making something appear to be the same as a whole at first glance, and then we’ll dig in and process the individual elements of an object but there needs to be symmetry in either, light, shape, or color. You can look at a tree as a whole without being drawn to a specific element of it before seeing and processing individual elements of it like the leaves, branches, and trunk. Same applies to most everything else that we look at.

    To be a bit more technical, “Visual perception is the ability to interpret information from visible light reaching the eye”
    “vision is due to light from objects entering the eye” so it would only make sense that lighter objects are seen first and if an object’s lightness (color, shape, etc) is balanced, then there won’t be a dominating element or draw. There really shouldn’t be one in this case anyway since an overall symmetrical shape (circle) is being used.

    All that just to get the fox’s head lighter. :)

    One last thing, when viewed at smaller sizes and especially against a white background, little can be seen of the land masses at the top of the globe behind the fox. Perhaps moving the land mass a bit to the right or bringing all of the land masses at the top closer together would close the large gap seen when the logo is viewed at smaller sizes but I’m more concerned with the fox’s head.

    Thanks again so much for the opportunity to add my 2, well 48 cents, well, $850.00.

  25. It’s perfect now — don’t move a single bézier node :)

  26. I like it! The tail looks much better in this version.

  27. Very nice – it’s much better with the tail/flame almost exclusively curling ‘in.’ Some of the last iterations turned outwards, and it just looked strange.

  28. In my opinion the head now looks way too uninteresting in relation to the tail. I think the tail looks perfect the way it is, so my feeling is that something needs to be done to draw some attention to the head.

  29. It looks like the original icon. Where is the vision? All I see is minutiae changes. The evolution of the IE icon, that was something else.

  30. Seriously, it looks like a Photoshopped version of the first. When are you going to CHANGE it?

    All of this open-sourcey dopey stuff is well and all.

    Look at IE, Safari, Opera. Professional, ungeeky.

    Whatever, do what you want.

  31. I think that my comments and critiques are more productive contributions and just plain kinder.

    I also belive that this is so very close to done. After taking comment #24 into consideration of course. :)

  32. “The evolution of the IE icon, that was something else.”

    Which one? The dull flat blue one to the shiny blue one with the slice in it? Or the shiny blue one with the slice in it to the shiny blue one with the piss yellow and orange earring or whatever that starts an orbit at the bottom of the e and ends up somewhere out into infinite space?

  33. This is the best so far. Just replace the tail with Stephen Horlander’s and it’s good to go!!

  34. Best iteration so far but I think it looks a bit too light at the top of the globe element.

  35. The lowest (southest?) continent looks like a hole in the planet though. Especially at lower sizes.

  36. I agree with others like “C” and “L4Linux”.
    Put on Horlander’s tail. Now that design… that was something special. This one looks good, but it is boring. I’m very disappoined that you refused to try out Horlander’s tail design!