Doing Good Deeds, Mozilla-Style

Like a lot of people at Mozilla, a big reason why I was drawn to this job was the opportunity to be part of an organization where the primary motivation was working towards a worthy cause rather than the financial bottom line. So, I’m particularly excited that we’re taking that commitment to doing good deeds to the next level with the recently announced Mozilla Service Week.

The concept is really simple: connecting people who know a thing or two about technology with people who could use their help. It could be anything from writing code for a non-profit that lacks that expertise to teaching senior citizens how to use the web…Mary, Jane, David and Mark have all given more thorough examples over on their sites.

On the design side of things, we had a good time figuring out how to translate the concept of the program into a visual theme. We were torn between doing something super-clean and functional, like a modern Web 2.0 site, and something more humanistic and cause-oriented, like a 1930’s WPA mural.

In the end, we decided to split the difference: we brought in our friends at The Royal Order and asked them “If the Internet had existed in the 1930s and a company like Vimeo had hired Diego Rivera to design their site, what would it have looked like?” (I always enjoy crazy hypotheticals.) Rather than running screaming in the other direction, they went to work and came up with the look shown below…I’m a big fan of how it turned out (especially the guy riding the biplane wing). We also brought in copywriter LaDonna Willems to explain everything in clear and engaging language.

Mozilla Service Week isn’t until September, but there’s lots you can do between now and then: you can already pledge your volunteer hours, or you can sign yourself or your organization up to be helped. Plus, be sure to start tagging related materials with “mozservice09″ on sites like Twitter, Flickr and Delicious to spread the word.

The Mozilla community has achieved some amazing things in the past, so I can’t wait to see what we can do this time. Should be good!

Mozilla Service Week

Filed under: Community, Design, Mozilla, PlanetMozilla — John at 2:28 pm on Tuesday, June 16, 2009

Old School Design + New Age Technology

Chris Blizzard and the Mozilla evangelism team recently launched a site called hacks.mozilla.org, devoted to showing off a variety of Firefox 3.5 demos over the next 35 days. Although the demos are undoubtedly extremely cool, my personal favorite thing about the site is the throwback-style design by Mozilla Labs’ Sean Martell.

When we were planning this site, our goal was to update Shepard Fairey’s classic “hack” artwork in a way that retained the original charm while reducing the “happy worker” iconography that understandably rubbed people the wrong way (much like with our “Mozilla: 10 Years” piece from last year). I’m really happy with how it turned out (big thanks to Sean).

The most exciting thing for me about all this is the realization that, just as Mozilla has built up a rich history of software development over the past decade, we’re also establishing a very nice visual design tradition. It’s a great sign for where we are as an organization that we can both draw on ‘classic’ styles that hold a lot of instant meaning for people while also creating new favorites like the Firefox robot or the mozilla.com illustrations. It’s a good place to be, and bodes well for a lot more coolness coming in the future.

hacks.mozilla.org

Filed under: Design, Mozilla, PlanetMozilla — John at 2:09 pm on Tuesday, June 9, 2009

The Hot Air Balloon Race is On

The Browser Wars are old news, and even the Browser T-Shirt War isn’t generating the headlines (ok, one blog post) that it once did. These days it’s all about the Hot Air Balloon Race.

Mozilla.com homepage, June 2008-present:

Hot Air Balloons, Mozilla-Style

Microsoft’s Bing.com homepage, June 2009:

Hot Air Balloons, Microsoft-Style (pt1)

In the “quirky illustrated version” category, here’s one more for good measure.

(h/t: RWW)

Filed under: Design, Mozilla, PlanetMozilla — John at 7:43 am on Monday, June 1, 2009

Caption of the Day

Mike Beltzner caught this hilariously wrong caption during John Lilly’s recent interview with Fox Business News. It’s funny in so many ways:

Caption of the Day

Filed under: Mozilla — John at 10:18 am on Thursday, May 28, 2009

For Your Clicking Pleasure

Just wanted to share a few links (mostly Mozilla design stuff) that have been populating my tabs lately:

* Alex Faaborg talks about refreshing the Firefox icon…like all his posts, it’s extremely thought-provoking. The comments are interesting, too.

* Looking back a bit, Mary Colvig reports that last year’s amazing Download Day campaign has won a People’s Voice Webby! Great news for a project that was a career highlight for all of us who were a part of it.

* Looking back a bit more, Asa Dotzler has resurrected the classic Hack artwork as a desktop wallpaper.

* David Boswell continues his series of updates on the mozilla.org redesign…so great to see how they’ve involved the community in every step of the process.

* A Kansas information architect named Sean Tevis has created a bit of an online stir this week with his innovative and generally awesome methods for using the web to create a grassroots movement. Check it out because a) his tactics remind me a lot of Mozilla, and include ideas we can learn from, b) there’s a browser reference right at the top of the page and c) cool cartoons!

Filed under: Design, Mozilla, Politics, Random — John at 9:11 am on Friday, May 8, 2009

Mozilla Creative Collective Site Design: Round 2

Last week I posted the initial design direction for the Mozilla Creative Collective site for review. I was extremely pleased with Airbag’s work, but based on your feedback as well as our own internal thoughts, I asked them to make a few additional tweaks:
* fix the type treatment in the header (between the headline and the logo we had “Mozilla Creative Collective” written in two totally different fonts, which felt weird)
* make the top navigational elements more prominent, as they were getting a bit lost amidst all the designy coolness
* reduce reliance on graphic text to make it easier to localize someday

With that in mind, they sent us round two (posted below) today…check it out and let us know what you think. And, while you’re in a Creative Collective mood, don’t miss Tara’s post on building social capital through a system of badges, plus her design review of what those badges will look like. Good stuff!

Mozilla Creative Collective Homepage (Rough) - Round 2

(full-size image available on Flickr)

Filed under: Creative Collective, Design, Mozilla, PlanetMozilla — John at 9:16 pm on Tuesday, May 5, 2009

Meet Mozilla Marketing

Last week Mozillians from around the world gathered in Mountain View for our annual all-hands meeting, during which time we wore name badges with the following personal info on the back: 1) what we do at Mozilla, 2) what we did before Mozilla, 3) favorite movie.

Seeing people’s answers was pretty interesting, so I started taking pictures and wound up with the compilation of badges below (it’s most, but not all, of Mozilla’s worldwide marketing team…apologies if I missed you). Any guesses as to who’s who?

Meet Mozilla Marketing

Filed under: Mozilla — John at 8:27 am on Monday, May 4, 2009

Mozilla Creative Collective Site Design: Round 1

Work on the Mozilla Creative Collective has shifted from creating the logo to designing the website, and once again we need your help. The initial mockup from the design wizards at Airbag Industries is below…take a look and let us know what you think via the comments section here, by tweeting or blogging about it, or by whatever other mode of self-expression you favor.

As a quick recap, the Creative Collective will be the online home for Mozilla’s visual design community. Users will be able to upload their Mozilla-inspired artwork into a publicly-viewable gallery and participate in design challenges on specific topics (with the winner determined by a public vote). That’s just scratching the surface, really…for a much more in-depth breakdown, check out the project’s wiki page.

A big source of inspiration for the site design was the logo itself, as Airbag incorporated its colors, style and major elements whenever possible. They also made an effort to evoke the feel of other Mozilla sites (especially mozilla.com and QMO), resulting in subtle textures, rough edges and a generally open, handmade feel. As always, the goal is to reflect Mozilla’s “people-powered” essence rather than creating something slick and corporate.

We tried to structure the homepage so it would show off as much community artwork as possible, and provide interesting ways for people to get involved or connect with other designers. Here’s a quick rundown of the key elements:
* header featuring the logo, project name and basic nav (note: this area will be smaller on the drill-down pages).
* main area of the site focuses on promoting the current design challenge and showing off a slideshow of particularly interesting recent images (challenge winners, staff favorites, etc).
* smaller mini-gallery of “hot” designs that have been favorited by the community.
* recent imagery from designers you’re following (if you’re signed in), plus a news feed of relevant blog posts.

It probably goes without saying, but all specific text and imagery in this mockup is totally placeholder and will change for the final release. So, with that in mind, what do you think? Does the site make you want to get involved? Will it appeal to designers? Does it communicate the basic concept of the project? Looking forward to hearing your thoughts…

Mozilla Creative Collective (Rough) - Round 1

(View the full-size version on Flickr.)

Filed under: Community, Creative Collective, Design, Mozilla, PlanetMozilla — John at 11:48 pm on Monday, April 27, 2009

114 Mozilla T-Shirts and Counting

Tara and I haven’t blogged about the Community Store much lately, but the inventory there just keeps quietly growing and growing: as of today it offers 114 different Mozilla-themed shirts for sale. That’s a pretty impressive number when you think about it!

Most of the new shirts (we had around 60 when we launched late last year) feature Firefox-inspired artwork contributed by our design community, but we’ve also seeded it with logos from other Mozilla projects, such as Camino, Bugzilla, Sunbird and SUMO. The idea is to be as participatory as possible, and to make sure the store has something for everyone.

So, if you’re planning on doing some shopping to round out your summer wardrobe, check out the selection in the Community Store (fashion experts are telling me that Mozilla shirts will be the hot beachwear item this year). And if you don’t see something you like, please add your own design!

Big thanks to everyone who’s contributed a design so far. Here are some of the recent ones:
Mozilla Community Store samples

Filed under: Community, Design, Merchandise, Mozilla, PlanetMozilla — John at 6:36 pm on Thursday, April 23, 2009

Talking About Open Source Design

I recently had the honor of giving an online talk about open source design as part of the Mozilla Labs Design Challenge (which in turn is part of their Concept Series). It covers a lot of the same topics that I’ve been blogging about lately (how community participation can help with the design process, organizing the Creative Collective, etc) so I figured I’d share it here.

By the way, the rest of the tutorials are really great so if you’re at all interested I highly recommend checking them out. The other tutors are some seriously smart, innovative and interesting people – Atul Varma, Aza Raskin, Alex Faaborg, Jono DiCarlo, Mike Beltzner, Myk Melez, Madhava Enros, Wei Zhou – so it was a huge honor to be included in that crowd. Big thanks to Pascal Finette for putting it all together.

Here’s the video…pardon the occasional audio problems (Planet Mozilla readers, the video is here):

(I gave a slightly different and longer version of this talk at FOSDEM and the ENSCI design school in Paris earlier this year…if you just can’t get enough of this topic, or want to hear the French perspective on it, here’s the audio of the ENSCI discussion.)

Filed under: Community, Design, Mozilla, PlanetMozilla — John at 8:58 pm on Wednesday, April 1, 2009

Next Page »