MetaFilter Redesign Contest
The site is over five years old and while it was one of the first collaborative sites to use CSS for positioning (the only table was the top nav area, from way back in 1999) and probably set the standard for how weblog comments worked and were displayed, the logo, chunky simple layout and fonts, and blue background are a bit long in the tooth. So it's time to redesign it and I could use some new ideas.
The Design Problem
It all started when the expansion began. First MetaTalk, then Ask MetaFilter, and suddenly the horizontal, paired-up nav on all the sites didn't quite work. I could only stuff so many options up there, and they had to happen in sets of two. Once I thought about redoing the nav to be more flexible, I knew I should probably rewrite the header, and while I was at it I might as well change the body and colors and the next thing I know, it's a ton of work to rethink the organization, layout, and branding for the sites. Plus, I'm kind of fresh out of ideas on where to go with it and would love to see a novel approach from someone else.
The front page of MetaFilter is probably the crux of the problem. It's got to have the following:
- logo and branding
- flexible navigation that can grow with the site
- a general design scheme that can be repeated for sub-sections (MetaTalk, Ask MetaFilter, etc) but still retain some separate identity for each sub-section
- front page must devote most screen real estate to posts, that's kind of a given
- need to squeeze in an ad bar for non-logged in folks
- would be nice to squeeze in another section for extra functionality like recent news about the site, saved threads, recent comments, etc
- you're also free to come up with any sort of wild ideas for new features on the front page in your design
The comment pages on MetaFilter could use a slightly different template, but almost everything on the front would need to be repeated below (except for a recent news blog).
A note about style
After considering how well functionality of the site is aided by a design, the way it looks certainly counts for something, but after the basics of a useful layout. I'd like something a bit more up to date, but would warn against jumping on the very latest trends, in order to preserve the longevity of the new design. Those triple drop shadows on the sides of a blog may look hot today, but they'll be tomorrow's avocado-colored appliances and needing an update.
I'll code the site in CSS as much as possible, but don't feel the need to limit yourself to thinking inside the CSS box. Design anything you want, something that works and looks cool, and leave the CSS layout bugs to me for final fixing. Also, don't feel the need to be stuck with the current color schemes. I would actually encourage the use of white as a background, if for nothing else, but to see something different than the heavy blue, green, and gray I've looked at for five years.
The Prizes
First off, what do you get if you win the best design? Here they are:
Grand Prize: A custom painted 20Gb iPod in any color you want (might I suggest metafilter blue, ask metafilter green, or metatalk puke?). They're not giving this to me for free, but I've always wanted to see one in the flesh, so the winner will get it (and I'll get to see the paint finish quality before I send it off to you). Also, the winner will get a link to their site in the footer of the front page, seen millions of times by thousands of people every month.
2nd Prize: 2 year pro account at Flickr. If you're a designer, Flickr's a good way to share photos and mockups publicly or privately, and this pro account basically gives you nearly unlimited storage space and uploads to the service.
3nd Prize: 1 year pro account at Flickr. Same as above, but for one year.
The Rules
You have until December 31st at midnight PST to enter (info on entering below). I'll make the final selections and keep all the submissions private (if you want to share it on your profile page, or in the MetaTalk thread announcing this, that's up to you). I'll likely post my favorite top 10 or 20 after the contest closes.
The winning design will be adapted for use in the site. I may tweak things as necessary or change minor things but for the most part the design will be used as-is. By entering you'll be agreeing to let me use and modify your work on the site, and I'd need a copy of your mockup photoshop native documents for future enhancement.
How to Enter
The ideal submission for this contest would be you sending me a link to a page on your server set aside for your entry. On this page, you'd explain why you made the choices you made and show full-sized screenshots of your mockups, or if you feel like coding it in HTML, links to mockup pages. A good submission would be something like this page from my portfolio, but imagine the copy describing why the elements of the site were placed in the layout, where you got the general design inspiration, and how it could work on infinite other sub-sites and imagine the screenshots being full-sized gifs saved out of my photoshop mockups.
To enable non-MetaFilter members to enter as well as members, I'll take submissions at this email address. I expect I'll have a lot of entries to wade through, so if you could limit your entries to one email to me, that'd make my life easier. Anyone can enter.
You have just over a month to work on it, get to it! Direct any questions to this thread.
Update: The results are in .