Creating a New Look for Mozilla.com

We’ve been working on a Mozilla.com redesign to coincide with the Firefox 3 launch for a few weeks (check out my earlier post for a refresher on project goals and other details), and now have four early-stage design directions to consider. If you’re interested in this sort of thing, definitely take a look at the options and let us know what you think. It wouldn’t really be a Mozilla project without community input, and and your feedback (along with thoughts from Mozilla Japan, Mozilla Europe, etc) will be extremely helpful towards us deciding which direction to pursue.

The key thing to remember as you review is that this is the first step in a long process rather than a vote between four final choices. In other words, these are design directions rather than final designs, so it’s best to consider the overall look & feel rather than focusing on specifics like photography, text, etc. That stuff is mostly placeholder and almost certainly will change before all is said and done.

With that caveat in mind, check out the options and leave a comment below with your thoughts. Thanks!

Filed under: Design, Mozilla.com, PlanetMozilla — John at 10:05 pm on Monday, December 17, 2007

43 Comments »

Comment by Mike

December 17, 2007 @ 10:26 pm

Agile seems the best to me so far but all of these options seem very noisy and hard to look at. Maybe if you make Agile simpler, and add some gradients in a few spots, it would look great.

Comment by graydon

December 17, 2007 @ 10:37 pm

I prefer Open, with Agile second behind. But I agree with Mike: they’re all far far busy. Too many design elements competing for space, too many typefaces, too many shifts in color, too much being said in too many disconnected places on the screen.

Also, all the photos of people with logos on their faces seem (imo) very creepy.

Comment by JT

December 17, 2007 @ 11:38 pm

John– great stuff.

I personally like the World Wide Wonderful version… maybe all the people are a bit much, but I really like the overall layout and feel of that page.

That said– highlighting the “tabbed browsing” concept is a cool way to go about it too.

Very exciting… look forward to seeing what you come up with.

JT

Comment by Eric Shepherd

December 17, 2007 @ 11:41 pm

I have to agree with the previous commenters — these designs are too busy.

Global is way too wide. I’d have to make my window practically full screen on a 1280×1024 display to see the whole thing.

Agile is okay, but still too busy and the blue is awfully intense. In addition, you’d practically have to make two versions, one for Mac and one for Windows (and probably a linuxy one, too) or you’d get complaints.

Open is also way too wide. And to my eye, there are too many different sizes and styles of fonts. Makes it look very cluttered and hard to read.

By the People is just… wow, that’s just hard to look at. The bright backgrounds behind the text are hard on the eyes, but the fact that they’re rough-edged the way they are (not rectangles but bounded by each line of text instead) makes them look to my eye unprofessional. Plus, again, it’s just too wide.

Comment by Alex Faaborg

December 17, 2007 @ 11:52 pm

In your last post you lay out the overall strategy:

>Although the current site has served us very well in terms of driving lots of
>Firefox downloads, we still haven’t successfully used it to tell the story of
>what makes Mozilla so special. We want the new site to reflect Mozilla’s
>unique personality…that we’re a public benefit organization that relies on
>the active support of thousands of worldwide contributors to help keep
>the Internet open and free.

I think Amy Hoy did a great analysis of the Firefox 1.5 home page in comparison to Opera’s in her article “Product pages: so much suck, so easy to fix”

http://www.thinkvitamin.com/features/design/product-pages-so-much-suck-so-easy-to-fix

I believe all of the points she made are relevant to the new design, and we should learn from the past versions of the site both in terms of what we did wrong, and what we did right.

Small graphic design criticism: none of the design proposals pass the squint test of locating the download button.

Much larger critique of the strategy (my apologies if this comes off as overly critical, but I want to make sure that we throughly vet the strategy):

I’m concerned that “telling the story of what makes Mozilla so special” will mess up our download rate and confuse potential new users.

These proposals follow the strategy of being about Mozilla instead of being about Firefox, and this overall direction stems from the creative brief and brand insight (http://people.mozilla.com/~jslater/brandinsight.html). I’m concerned that this direction does not mesh well against the viewer’s actual intention and questions.

I personally believe users are going to decide to download Firefox or not based on the attributes of the software itself, not the attributes of the organization that produces the software. These proposals feel like they are aimed at recruiting new contributers, not new users. Also, people who are going to choose Firefox over the competition based on ideology instead of quality have already switched to us. I think our home page needs to read considerably less like eff.org or creativecommons.org, and a lot more like http://www.apple.com/macosx/features/safari.html

In particular, I think the vast majority of our users don’t care if Firefox is created by people that are good, they care that it is a better piece of software than the browser that came with their computer. In fact, I believe that in general mainstream users have a “you get what you pay for” attitude when it comes to open source software (once they understand what that means), and focusing on the free, open source and international aspects of the organization could actually scare off xenophobic capitalistic users who only trust “real” companies that they can invest in. Usually people are surprised to find out that we are a non-profit, and don’t know what open source means. I don’t think these are problems we need to address, the fact that we are not preparing for an IPO isn’t part of user’s decision making process to download Firefox or not. I know this will get me flamed, but I believe that telling people our product is developed by a distributed community of volunteers will instill more doubt than trust in our current environment (even though this is assumption is certainly not true, fair or accurate). People aren’t going to care what “good for the Web” means, they want to know if Firefox is “good for my computer.”

Instead of analyzing the brand, we need to analyze the product. We should assume the question in the user’s mind is “Should I download Firefox?” and every aspect of the page should drive towards “Yes, because Firefox is…”

-customizable
-secure
-fast
-respects your privacy
-easy to use
-…

The page needs to be about the relationship between Firefox and the user, not the amazing story that is our larger organization.

I think we should note that product pages for third party OS X, Windows and Linux applications are very different, and we should consider customizing the page both in terms of graphic design and messaging tone based on the user’s platform for a better chance at appealing to them.

I also think we should considering leveraging the brand insight and creative direction for a mozilla.org redesign.

Comment by Paul Kim

December 18, 2007 @ 12:20 am

Keep the feedback and comments coming folks; this is exactly why we shared these early concepts.

@Alex: You noted that “These proposals feel like they are aimed at recruiting new contributers, not new users” and that “The page needs to be about the relationship between Firefox and the user, not the amazing story that is our larger organization.” With the caveat that none of the copy/imagery is final, I did want to point out that the Firefox main pages in each of the concepts are indeed structured to focus on product attributes:
http://people.mozilla.com/~jslater/1_4.html
http://people.mozilla.com/~jslater/2_6.html
http://people.mozilla.com/~jslater/3_2.html
http://people.mozilla.com/~jslater/4_7.html

To one of your other points, specifically that “we should considering leveraging the brand insight and creative direction for a mozilla.org redesign”, I completely disagree. But rather than use what is certain to become a long and unwieldy comments thread to explain why, I’ll plan on posting more background at my blog Tuesday.

Cheers,
Paul

Comment by Gary

December 18, 2007 @ 2:22 am

I’m with Agile, not because it was really worthy of being the champion, but rather the rest were too clogged up, and it was comparatively less cramped, with slightly more suitable colours etc.

Agile would still need lots more work IMHO.

Comment by David Naylor

December 18, 2007 @ 3:15 am

I was surprised to see four designs so cluttered. I think it would be a mistake to make mozilla.com look like those four. I think the prioroties must still be as follows:

1. Provide a download
2. Provide more info

The number one reason to visit mozilla.com must surely be to download Firefox? That’s why I also think it would be a big mistake to not use a large *green* download button, which has become something of an industry standard.

Comment by Justin Dolske

December 18, 2007 @ 3:17 am

Brief/general late-night thoughts:

Both “Global” and “Open” grab my attention. Global, in particular, is appealing for its direct simplicity. Global feels more organic, Open a bit more formal. Both seem to have a lot of jumbled text on the bottom half, though, and my eye isn’t settling on anything in particular there (other than the photos).

Agile… meh. The download link is very non-distinct, and the Firefox Window graphic feels busy and cluttered. The rest of the page looks very sleek and clean, though, so perhaps reworking the Window thing would make this ok. (eg: 2_8.html)

Thumbs down to For the People… Extremely busy looking, too many fonts going on. The blocky unaligned text backgrounds makes it look as if it’s a poorly designed page. I actually loaded in FF2 just to make sure I wasn’t just seeing some kind of layout bug in FF3. I think I see the reasoning behind the style, but it doesn’t work for me. And probably sends the wrong message as to community projects looking unrefined. :)

I’d really like to see a design like this, though.

Pingback by Mozilla.com estrenará nuevo diseño que se estrenará junto con el lanzamiento del Firefox 3 :

December 18, 2007 @ 3:42 am

[...] Según informa la web intothefuzz.com, ya se está trabajando en el nuevo diseño de la web de Mozilla.com, que coincidirá con el lanzamiento de Firefox 3 (previsto para dentro de un par de semanas)… [...]

Comment by George Hite II

December 18, 2007 @ 4:39 am

I personally think that all the designs are not polished enough for a professional web site. The two designs that are further along are (Global) and (Agile). Out of those Two I lean to (Global). I think what bothers me on (Global) is the heaviness of the people photograph… and I know you said not to pay much attention to the photograph but I can not… I like the rest of (Global) and think it is coming along nicely.

I think (Agile) has potential but like stated earlier I think it needs some more work. First I think it looks incomplete specially in the tabs area… What I do like is the firefox wrapping around the browser… That is a nice touch.

The design I do not like at all is (For the People by the People). That design is not professional looking at all and shouldn’t even be put in the fold. That design has no direction, is confusing to look at, and well is not esthetically pleasing…not a bit. I hope this does not hurt anyone personally I just commenting about the design.

Thank you for giving us a chance to comment and thank the designers for their hard work. I know it’s not easy coming up with designs and it takes some time to develop them.

Comment by Jonathan

December 18, 2007 @ 4:50 am

Slightly related, have you thought about the “You’ve updated to .. ” page? I think it would be an ideal place to push a little SVG, canvas (see CAKE: http://glimr.rubyforge.org/cake/canvas.html) or even some HTML video :)

Pingback by Cominciano i preparativi per Firefox 3, Mozilla.com avrà un nuovo look

December 18, 2007 @ 5:04 am

[...] Le discussioni sono appena iniziate, speriamo in un buon Firefox 3 che faccia effettivamente uso di una minor quantità di Ram (confermi la Beta) e che si riveli maggiormente stabile del suo predecessore. [Link: Into The Fuzz] [...]

Comment by Manuzhai

December 18, 2007 @ 5:07 am

I prefer the lightness of Global, but all the people are really too much. I think Agile is way too blue; the background should be pretty much (off-)white with some color accent, in my opinion. For the people by the people is much too busy and unstructured. I like the structure in Open, but the background colors feel to dark to me.

Comment by Axel Hecht

December 18, 2007 @ 6:57 am

I’d stay away from shiny happy people in general. Shiny happy people are used in insurance commercials, I guess due to “if you run out of arguments, put shiny happy people on it”.

I agree with Alex that it should be product first. I disagree with the rationale, though ;-), way too many assumptions that are really en-US focused, IMHO.

We should back up some of the product claims, in particular security, by brand attributes, whichever those are :-/.

From my personal agenda, I’d like to see focus on these, in this order:

Firefox

Download

Download in your language
Rationale

The latter two run a closer race than the first two.

Regarding the clutter, I’m torn, and this will likely be an international problem. I guess that youngsters need some level of noise and signal overload to not get bored, while grown ups will likely be irritated.

A note on 100% Organic, that’s a very focused cultural plot. Might work in the US at its current market share. Won’t win new users in Germany, I guess, and it’s completely irrelevant for China or India.

Agile is coming in first for me right now, but that’s elderly Germans, I’m probably ranking “silver surfer” soon. Good target audience, though :-)

Comment by Justin Scott

December 18, 2007 @ 7:50 am

I like Global the best. Agree with above comments about way too much going on.

Comment by Jacques

December 18, 2007 @ 7:55 am

I’m with Agile too.

I think that from now you should work on Agile and branch it in two or three forms (color variants, layout, simplicicity versus busy, etc.).

Comment by mcdavis941

December 18, 2007 @ 7:55 am

Out of all the choices, I like the feel of Concept 3 / “Open” the best. It doesn’t do much to communicate “Open” (yet) that I could see, and it doesn’t look very Firefoxy, but it has great overall balance, great progression from general to specific from top to bottom, and it’s easy to focus on what you’re trying to focus on. It’s the most simplified and unified out of all the treatments. It feels natural and organic. Those colors aren’t what I would have expected for a Firefox site, but at first glance they work, and overall, that one feels great.

I guess also, in general, I’d really like to see the brick color deemphasized. I realize it’s part of the logo, so it would be appropriate to use it as an accent color, but maybe it could be limited to lines and dividers and such, rather than used in a major design element as in the people in Concept 1 / “Global”. To me it’s heavy and dull … like a brick. I’d rather see something with more energy.

Agree about the logos on skin being creepy.

Is Flash on the table for this site? Just wondering about fonts and internationalization.

I don’t know if it’s reasonable to expect the look for a major site like this to reach final form even this year. Many of the major sites I’ve seen have evolved into maturity over years, not weeks and months. I realize mozilla.com has been around for a while, but we’re reaching for a new level with this and it’s going to take time.

Thanks for making this an open process.

Comment by Geof Harries

December 18, 2007 @ 8:00 am

Global is the only one headed in the right direction. It simply needs some refinements, including less focus on the people and more on Mozilla and its products to make the design truly sing. Also, I wouldn’t say these are “shiny happy people” as there’s a clear difference between the genuine photographs used here and lame stock photos that you’ll find everywhere else.

As far as the other concepts, I find Agile too boring. Mozilla equates to the energy of people and there’s barely any zip in this comp.

Open is way too drab and depressing. It does little to communicate the Mozilla brand.

As for the final design - For the people by the people - it is too dark, not enough hope. It also feels really, really geeky and there is no strong call to action.

Comment by untied1968

December 18, 2007 @ 9:19 am

Everyone loves Agile so much but personally I feel the browser in a browser is too literal and using parts of the logo in the design is a bad idea.

Agile does have a simplicity about it but overall I think simplifying either Global or Open would render the best results. There is a sophistication there that could really elevate the Mozilla brand.

But yes, they could all use some simplifying.

Comment by Seamus

December 18, 2007 @ 9:26 am

First of all it is really quite amazing that you are living by the “community driven” mantra enough to engage in this type of open feedback for early design concepts. It is very brave on a human ego level, and I wish you the best in terms of rewards for your efforts.

Trying to look at the high level directions of the designs with respect to strategic goals as I think you were asking…

Global: Seems very natural as progression for the FierFox brand while still being somewhat new. I think it does the best job of making me feel like I recognize where I am when hitting the site, rather than maybe the “oops, I’ve stumbled on the wrong page.” The Organic and people concept is a good one for implementing the strategy you discussed before, but I’ll mention more on this in a sec. On an aesthetics note, I think the balance on the FireFox landing page is more effective than on the Mozilla homepage; obviously for the ‘download this logo’, but even for absorbing the meaning of the group of people as it relates to community built/used software.

People4People: In the minority by far of the responders here, but I think this direction is the most intriguing. I was jarred by it at first glance, but I think the dynamics work well for the messaging.

I think actually the first slide does a bit of a disservice for this evaluation via the hand painted animals image. I really like the use of color with the black and grey work. I think as this design is refined and does become cleaner it could be the most compelling of the new directions. It has a rock music feel to it.

A slight suggestion on making it more balanced…Perhaps consider, reducing the color in the photos, as either black and white images or color reduced images so that only one color is used. It was image http://people.mozilla.com/~jslater/4_5.html that really appealed to me and I think that was because the news was shorter, so the balance of the blue from the thunderbird bricklet, really makes the color palette more striking. In my mind when I see this with greyed images and just the color in the logos and backing the text, maybe even more black padding between bricklets, it is really engaging. Maybe even moving the news elsewhere.

Agile - has the feel of being too corporate. Perhaps it is the blue, perhaps it is the tight boxed layout, but I get the general sense of the standard $5-$10 million revenue commercial software vendor, that I have just seen one too many times. It conveys a great sense of professionalism, which is important, but not what I think you are striving for. I also haven’t picked up on the main messaging in this one, or how it relates to the design.

Open - Is just a little too drab. Very Linuxy, circa 2002. I think the concept of “open” too is possibly passed its relevancy, in terms of a major draw to anyone other than developers. I am not sure how much of a connection your visitors will make on this one.

On strategy…
Alex F. raises some interesting questions about where Mozilla and FireFox are with respect to Brand development and Product development. I imagine you guys are having conversations inside the foundation about this rather often.

There are many indicators that now is a good time for Mozilla to explore customer growth via the brand, as the product has established a great track record. Simply being at Version 3.0 tells you something.

If all you have is ‘our product is better” than if someone comes out with a better product one year (or simply more features), then you could experience a large customer base shift. Think Yahoo users who switched to Google. If Yahoo had offered me some sense of identity, some badge of honor, for the fact that I Yahoo, I would be less likely to suddenly start to Google. Compare that to Apple, where I am an Apple user, no matter how good a product comes out of the PC arena, I would not give up my identity as an Apple user. (This was a hypothetical)

The community development aspect of Mozilla should lend itself tremendously well to this type of Brand-Consumer identity development. I think the idea that you try to elevate a user of FireFox to be just as much of a participant in this community as a developer/contributor is a participant, is highly compelling, and I think will ultimately garner a greater audience.

Of course you have to have a good product, and Mozilla has a few. It can work. Netscape held out for a long time by just being “hey, by using us you aren’t a Microsoft drone”. I think even in the early days FireFox proliferated on a idea espoused by its users. I think the opportunity is there to craft a very positive identity on what it means to be a participant in the Mozilla movement at many levels.

Keep up the great work, everyone.

Comment by George M. Harkin

December 18, 2007 @ 9:39 am

I would vote for #3, then maybe a close #2.

#3 looks very professional, while in #2 I just want to click somewhere.

Comment by John

December 18, 2007 @ 9:49 am

4 is ew

I like 2 most.

Comment by FuzzyFox

December 18, 2007 @ 9:52 am

I like Global, i think the others a less web 2.0ish and as a web developer i think that Global is also the most interesting with the idea of the “real” Mozilla community being seen not just text on a web page. I also like Global more as sorry for this, my mother, who has no idea what a web browser is even though i try and explain likes the look of it and said that it was more trusting for her and made her want to click and look around even though it was just an image and she new that it was before seeing it.

The others had much less of an impact on her so…

Just before u think she is “old” i am only 15 and she only 35 so…

Comment by Seth Kinast

December 18, 2007 @ 11:08 am

Global does the best job of staying true to what I’ve always seen as the trademark Mozilla “look”, and as such, seems like it would have the least amount of work to whip into shape, design-wise. Content-wise, I don’t know what Firefox is from looking at this page. The giant collage could be replaced with some useful info about what Firefox can do.

Agile is ok but the background is hideous. I do like that it’s much more focused on the browser itself rather than the other three’s emphasis on “community” and such. It’s the only design in which I would know immediately that I was downloading a browser.

Open’s main focus is the market-y drivel at the top. As a consumer, I don’t care about open source and “something wonderful”, I want to know what’s in this thing I’m downloading. The color scheme is a bit meh. Looks kind of corporate.

FPBP needs to go away… looks very Myspace-like / retro underground garage band / unfinished. Not much that I like.

Ditto the earlier comment that people with logos on their faces are creepy :)

Comment by Paulo Raponi

December 18, 2007 @ 11:41 am

The big “Download button” (like http://people.mozilla.com/~jslater/3_2.html) is very, very cool!!

Comment by Geof Harries

December 18, 2007 @ 12:25 pm

This is definitely deserving of a submission to Digg.

Comment by Per Thulin

December 18, 2007 @ 2:18 pm

The open one is wonderful!

Comment by Ville

December 18, 2007 @ 4:18 pm

Ok. Hope I won’t offend too much with my style here…. First I’m gonna do a bit of echoing here: designs are too noisy, Global’s too wide (though it’s #1 for me, open is #2 ’cause it’s just boring), community seems to be the focus (we, we, we!), when it should be you, you, you! There were good reasons to separate MoCo from MoFo - keep it that way.

And then my more original bits:
Who is this design targeting? To me it seems clear all the designs are targeting young, techy, … dare I say.. americans. Europe with up to 30 % market penetrations will be in trouble if the new site looks anything like what they are in the drafts. Geeeeky is really what came to my mind wrt all the designs apart from Open (which I find uninteresting). How should these pages instill confidence with the tech illiterate, older people or girls? (these people are few or not visible in the pictures —- yes, I understand this is just a mockup, but I have to assume it reflects the ideas behind the design)

In a more constructive vein, global would be real nice, if the community aspect would be toned down, the people graphics a bit less “blingy” and with no (or at most! one) geeky fan-boy/girl with a Firefox “tatoo”/sticker. Also, the if the organic joke/theme lives on, it must be only one of many. Most of which are more universal (hell, you could even try asking for concepts of a similar type from m.d.l10n!). In the old Firefox 2.0 design I loved the way it didn’t give a clear picture of what kind of a person a Firefox user is.
The background picture knew its place.

Also, thanks for the opportunity to voice our concerns!

Comment by omic

December 18, 2007 @ 5:01 pm

Global was the best theme form me. People from everywhere are having fun using a great product. They are cool and relax that what inspire the product. I juste love the impression of depth too… I definitively don’t like the fourth concept. Too dark.

Comment by David B Haun

December 18, 2007 @ 7:41 pm

I like the the webpage theme introduced on http://en-us.www.mozilla.com/en-US/firefox/3.0b2/whatsnew/ webpage it is a winner.

Comment by Toe

December 18, 2007 @ 8:22 pm

I’d be lying if I said I liked any of them.

Global: This would be great for a social networking site for geeks. The rest of humanity will run away screaming.

Agile: Well there’s a lot of blue and there’s a white spot and there’s this big orange thing. My poor eyes have no idea where they’re supposed to be looking.

Open: I dunno, were you trying to go with a casual, ‘blue jeans’ feel here? I could only see that working with some home users. With other users, and especially with businesses, something a little more formal would be needed.

For the people: You know how I said Global would scare away everyone but geeks? This one will scare away the geeks too. Just awful.

I know these are more or less just sketches, of course. Any of the first 3 could maybe be developed into something acceptable.

If you fixed up Global a bit, you’d probably be left with something a lot like what mozilla.org’s front page looked like prior to the transition to mozilla.com. Which kinda begs the question of what exactly was wrong with that design.

I think Agile has a reasonably good overall idea, but the implementation is SEVERELY lacking. Tone down the colors a bit, and give a better focal point to the design. The Firefox logo draws way too much attention to nothing in particular at the left edge of the page. Why is the browser window so faded? This is ultimately the thing that matters here, isn’t it? Stop and consider the movement of the eye for someone who opens the page, where do you want it to start? Then consider what MUST be the place where movement of the eye stops: the download button.

As I said, in its current form Open is a bit too casual and grungy, as well as busy. As others have said, those interested in ideology have already switched, but it might make a nice feel-good sidebar story or something. But the focus should be on the browser and the download button that people will use to get the browser.

By the way, with all the platform customizations in Firefox 3, how about checking the useragent and showing the viewer what Firefox will look like on their computer?

Comment by Gen Kanai

December 18, 2007 @ 8:34 pm

Of the first-pass designs, I like “Open” as a design the most, although I don’t think the color palate is appropriate and I think a number of further iterations would be necessary. What I like about “Open” is that it is the most conservative design (of the 4) and such I think that it would appeal to a wider cross-section of people who would come to the site, vs. something like “for the people” which seems to be targeting mainly Mozilla’s community.

The main challenge I see with all of these designs, is that they are all using photos of people, instead of the silhouettes that the Mozilla.com site uses now. The photos of people are a major design change and the challenge is to have photos that really show the broad diversity of people who use Firefox (and I don’t mean just racial diversity, but types of users as well.) What photos will be used will be absolutely key to the image conveyed. I realize that the images in these comps are not the final photos to be used but actually the final images selected will be key to the message conveyed.

I truly believe one of the current site’s strengths is the silhouettes. Whether you’re a Firefox user in South Africa, or China, or Brazil, or Germany, you can imagine yourself in front of a laptop or an LCD monitor using Firefox. The current site is very “global” in that way. If we were to go with photos of people on the new site, I think each locale would need to strongly consider having a set of photos of users from their region for use. For instance, in Japan we _might_ want to use more photos of businesspeople in suits to appeal to that demographic (since the younger demographic spends more time on mobile phones than on PCs.) So a site that allows for not only localization of the language but localization of the imagery to an appropriate extent would be an important consideration for us.

Comment by Tara

December 18, 2007 @ 10:35 pm

Hi John

As you already mentioned… these are ‘general’ design directions and therefore I will try to focus on the look and feel as oppose to specifics which can easily be modified in later versions…

I think the “look and feel” of a piece is something that is communicated fairly quickly, and the audience will at least on a subconscious level already have made their judgment within the first moments of interaction with the site… so first impressions are important.

With that said, as I glanced at the different design concepts, I immediately found Concept 1 “Global” and Concept 3 “Open” to be visually more appealing than the rest – with Concept 1 being my top choice.

Both “Global” and “Open” had a cleaner and more professional layout while still communicating the mozilla brand. The others, Concepts 2 & 4, looked more like a cluttered mess, with tooo many visual elements competing for attention. I personally wanted to leave those pages the moment I clicked on them.

I think simplicity works best in today’s world and appeals to a much broader audience. As we all remember, Google showed everyone how less is more… by maintaining an overly simplified yet effective homepage against the flashy competition…Ask has also redesigned their site for a similar appeal. Facebook’s success against Myspace is also related to their more simple page layout. It definitely works.

I also took a look at Microsoft/IE’s website for a quick comparison. Although their website is somewhat boring to me, the soft color palette and simple layout make it visually more appealing and easier to navigate.

Concept 1 “Global”
——————–

* Simple and clean layout, stronger unity within the elements on the page

* Soft color palette. Blue and orange hue selections are consistent with the firefox logo. Referring to the color psychology, blue is a more global color and represents openness, loyalty, and calm spirits, while orange is a more attention grabbing and energetic color. Both colors tie in nicely into the mozilla/firefox brand, therefore creating a more consistent look and feel to the website.

* Collage photograph illustrates the diverse/global community involved in the product, communicates the fun anti-corporate culture of the brand. But the detailed photographs covering most of the space can also be confusing, if not a distraction from the more important elements on the page. Perhaps simpler graphic images, or silhouettes would create a better result. I noticed some silhouettes used in the 3rd page of this concept design.

Concept 3 “Open” was second on my list mainly due to its simpler design layout. But I believe the color palette is a bit dull–>making it look and feel more like a tech-support site than one representing a fun Internet brand.

As general design concepts, I think “Global” and “Open”, along with their variations were stronger.

Comment by Lionel

December 19, 2007 @ 12:17 pm

For what it’s worth, I think…

Worldwide has a slightly culty feel (mostly because of the stickered faces which aren’t obvious at first—and then think of someone who hasn’t really seen the firefox logo much).

Open: I think it looks great. Great idea, which kind of dawns on you as you read it (though the different meanings of ‘open’ will be hidden to most). But the grey makes it look mechanical and slightly geeky.

I agree that the pages look slightly cluttered. But it’s great to make it much more of a portal to ‘all things mozilla’.

Comment by John

December 19, 2007 @ 12:29 pm

Thanks to all for taking the time to write such thoughtful comments. Being able to put these pretty raw designs in front of the community for early-stage feedback has been very worthwhile and informative…we (Mozilla marketing) definitely look forward to doing more of this.

We will continue to refine and improve what we’ve got so far, and I’ll share the results as we go. Stay tuned, and thanks again!

-John

Pingback by Firefox 3 Website Redesign Mockups

December 20, 2007 @ 3:11 pm

[...] Slater, the Creative Director over at Mozilla, has given some early insight into the Firefox 3 website redesign process. Just like with Firefox 2, a new website will be [...]

Pingback by Asroone » طراحی جدید سایت فایرفاکس 3

December 20, 2007 @ 10:55 pm

[...] طراحی موزیلا امروز اعلام کرد که در حال کار بر روی طراحی جدید سایت موزیلا در زمان [...]

Pingback by Los bocetos del nuevo diseño de la Web de Mozilla.com :

December 21, 2007 @ 12:49 am

[...] John Slater, director creativo de Mozilla, nos ha enseñado alguna de las ideas que tiene la empresa para el diseño de la nueva web de Mozilla.com. Esta nueva web rediseñada será lanzada a principios del 2008, en la que existe en la actualidad cuatro bocetos de diseño… Slater nos advierte de estos diseños son conceptos, y el que salga elegido, seguramente pueda sufrir cambios de menor importancia… pero al menos nos podemos hacer una idea de cómo será la nueva web. [...]

Comment by Ali

December 22, 2007 @ 4:51 pm

Please….
I find them all inferior to the current peace of art that is done by Nobox.

I suggest hiring Nobox to do the job.

(All of these mockups are really bad)

Comment by Ali

December 22, 2007 @ 4:53 pm

I meant to say “piece of art”, sorry.

Comment by Kaori Negoro

December 27, 2007 @ 11:15 am

It might be too late to make a comment here but I want to provide my honest feedback. I appreciate your caring about global concept and worldwide community. I agree these are the important differentiation features of Mozilla and Firefox. However, saying directly that we are global and worldwide community does not mean we truly communicate this message. People understand how global we are when they see we work globally. There should be a better way of communicating “we are global” rather than wording “World Wide Wonderful”, which is difficult to translate in other languages with keeping what you mean in English. For example, when I see language selection at the webpage, I feel the company or the product is released in many countries. This kind of important message needs to be fact base. Direct wording sometimes makes the message cheapen.
Trying to be different from others as well as to be global should be very challenging. Global requires simpleness so that any of the culture can accept. For the next version, I appreciate if you consider this part. Thank you for the hard work!

Pingback by Taking a Closer Look at the New Mozilla.com: Look & Feel | intothefuzz.com

August 7, 2008 @ 4:48 pm

[...] other key addition, of course, was the illustrations. After our early-stage round of public review, our big takeaway was that the site needed a central visual theme to tie everything together. It [...]

RSS feed for comments on this post. TrackBack URI

Leave a comment

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>