Our Craigslist

Wired MagazineThe cover story for the September 2009 issue of Wired takes a look at the current state of Craigslist and the challenges it faces as it continues to evolve. In a sidebar, the magazine’s amazing art director Scott Dadich invited several designers to re-imagine and redesign Craigslist itself.

In addition to inviting contributions from SimpleScott, who was the former design director at BarackObama.com, Matt Wiley of Studio8 Design, and Luke Hayman and Lisa Strausfeld of Pentagram, Scott was kind enough to ask me for my take as well, and I leapt at the chance. I conscripted two colleagues from my design team at NYTimes.com to help me: Anh Dang who provided an invaluable sounding board for the information architecture and interaction design, and Paul Lau, who helped turn around the visual design literally over a weekend. You’ll see the mock-ups we submitted on page 104 of the magazine or, here at this link.

A magazine sidebar of course has a finite amount of space in which to show and explain the ideas that went into this design. Thankfully, someone invented blogging, which is not similarly space deprived — and so I shall now use the medium to indulge myself accordingly. Here, then, is a closer look at the mock-ups we submitted.

Basic Concepts

First, a caveat. We tried to approach this design problem pragmatically, being as realistic as we could about the design decisions we made — as realistic as one can be with only a superficial understanding of the constraints, of course. Any truly serious redesign of Craigslist would inherently look very different from what we produced, and we kept that in mind from the very beginning. And, yes we took some artistic license, too, which is why it’s probably more accurate to call this a re-imagining than a redesign.

Home Page

Home Page

Section Page

Section Page

Our Thinking

Because we only went as far as rendering our ideas in these static comps, a lot of the functionality we had in mind could only be implied in the interfaces, and not demonstrated. So I put together a Keynote deck to walk Scott and his editors through the ins and outs of our concepts. Here they are, in smallish but I hope readable form.

Slide 1
Slide 2
Slide 3
Slide 4
Slide 5
Slide 6
Slide 7
Slide 8
Slide 9
Slide 10
Slide 11
Slide 12
Slide 13
Slide 14
Slide 15
Slide 16
Slide 17
Slide 18
Slide 19
Slide 20
Slide 21
Slide 22
Slide 23
Slide 24
+

35 Comments

  1. Mike: I definitely remembered that, and remember thinking they did a really nice job. In fact, I forwarded the link to Scott Dadich when he first approached me about it, just as a point of information. When I sat down to do our redesign though, I purposefully avoided going back to that SXSW presentation so as not to inadvertently steal their ideas.

  2. Very nice redesign. I remember that SxSW preso as well, and thought it had some nice elements for its solution. I haven’t seen the Wired article this relates to, but I really like what you’ve done here with your re-imagining.

    I’d also like to point out that I really like your Keynote presentation in demonstrating/explaining the design.

  3. Excellent job as always, Khoi. I saw the Wired web article last week via Twitter, so I’ve seen all the redesign examples. This reminds me of your subtle redesign of Gmail, using padding to make the design much more easy to reconcile.

    I’ve always wondered why Craigslist looks the way it does. One excuse I’ve posited for the lack of change on the part of Craigslist is bandwidth costs. Estimated revenue is now at $150 million according to some (see sources on Wikipedia page), but of course Craigslist wasn’t bringing in that much in its initial years. I’m wondering if the basic design is partly to save on bandwidth costs (which is why I’m confused by Studio8’s redesign), although if they are approaching $150 million in revenue that’s kind of an irrelevant point. Just a thought.

  4. Beautiful work. It’s nice to see your thoughts on this project in further detail. I was leaning towards sans-serif more than serif in my redesign of Craigslist. Furthermore, I thought having everything blue creates a sense of being overwhelmed with choices, whereas if you change visited links to blue and make everything else a grey, the path which you have been before is highlighted for you like a lit trail.

    Look forward to meeting you tonight. I guess I’ll have to post my ideas document in the next few days now.

    ; )

  5. Great work, Khoi. Love that you just stuck with the blue and white. Feels like Craigslist still, and I think that’s important.

    My question isЁ is the calendar such a key element to the Craigslist experience that it deserves a non-moving piece of real estate, always at the bottom of the viewer’s display? I can’t once think of a time I’ve looked for events on CL. My understanding is most people used it to buy/sell/find jobs.

    I like the MyCL functionЁ easy tracking of viewed/interesting posts. Don’t know exactly how it’d guess what I’m interested in without some serious coding. Whimsy, I know. But it’d be easy enough to make that entirely user-made. Like “Favorites” on Twitter or FlickrЁ just click a star in a post to keep it handyЁ or maybe a pin icon to go with a pin/pinboard analogy? This could very useful. Could also use “saved searches” here, useful to people who don’t know what RSS isЁ (since you can today get RSS feeds of searches, a killer feature for the power user).

    (of course all these questions are from only reading a slidedeck, and not actuall seeing it in action)

  6. Really nice work! When I opened my copy of Wired a few weeks ago, your team’s design was clearly the best. (Not the wittiest though — everyone needs to thank Hayman and Strausfeld for that!)

    But I have to ask you, “The Craigslist Taxonomy: A true organic folksonomy that works perfectly well for countless people” — are you serious? I still don’t know how a “Gig” is different from a “Job” and it’s probably because the people posting to those categories don’t know either.

    But no matter. Posts like this one are incredible. And to echo Terry, above, the deck is great.

  7. Great concept, and an equally impressive presentation. You were able to maintain the almost brandable UI that we’ve all become familiar with, but brought in a useful, web application feel to it.

    Nicely done, Khoi!

  8. @Mike Rundle: Caught this on DF, thought it was in reference to that old SXSW presentation.

    Khoi, I think this is fifty times better than any other version, true or conceptual, that I’ve seen. Brilliant UI. It’s too bad Newmark is such a d-bag (or at least he certainly comes off that way in just about every interview of him I’ve ever heard or read) or else we might see some improvements to the site.

  9. Too much stuff up on top. I know it’s craigslist I don’t need a bigger header. Keep the fancy css and javascript out of it, it’s gonna break

  10. Great design, but for some reason it looks like a mirror image of the correct design. It looks like a left-handed design to me.

    Also while minimalism is definitely one of the goals, there is no need to use the standard ugly “internet blue” just because it’s minimal.

    Greys would be easier on the eyes, browns would better reflect the hippie origins, and the only colour branding they use now is the rather dynamic tie-dyed colours on the logo.

    The real site would be peppered with colourful advertisements, and your interface would be hard to see as a result.

  11. I personally think that craigslist is the best site out there. Its so easy to scan, I like that theres no visual clutter. I can search and scan, very fast. I think its good what you’ve done, at least you haven’t completely butchered the site, and kept the same look and feel as today, just some minor enhancements.

  12. @Dan Boland: Wow, that’s the first time I’ve ever heard Craig called a douchebag. I guess we disagree about how much he should be more like you.

    Khoi, etc: the adaptive “MyCL” stuff would be neat, but I really don’t see any of the other changes as improvements. Perhaps if you’re trying to attract new users with a slightly prettier site, this would be a step…but that doesn’t seem to be a problem in real life.

    Many people don’t seem to realize this, but if you’re frequently performing searches on CL, you can set up an RSS feed for your area and search terms… This is an adequate replacement for MyCL for all the situations that I really care about…some loss of serendipitous discovery, perhaps, but acceptable.

  13. @Andrew: Don’t get snippy, complete stranger. I happen to believe that he’s usually unnecessarily coy and evasive when asked simple straight-forward questions by interviewers.

  14. Thanks for the comments folks. I can’t emphasize enough though how truly pretend this exercise was. Its main goal, really, was to provide a bit of provocative food for thought in the context of a printed magazine. As I said, if one were to ever to undertake a real, honest-to-goodness redesign of Craigslist.org under the auspices of Craig and his team directly, the end result would look much different. Heck, even if I were to redesign the site for real, it would be much, much different from what you see here.

    Regarding the My Craiglist feature, Andrew wrote:

    Many people don’t seem to realize this, but if you’re frequently performing searches on CL, you can set up an RSS feed for your area and search terms… This is an adequate replacement for MyCL for all the situations that I really care about.

    The point of the feature is that most people will never figure out RSS much less figure out how to capture an RSS feed for Craigslist. In fact, though RSS is adequate for the situations you really care about, it’s not for you at all. It’s for users who use the site frequently but don’t have the technical expertise to use it more efficiently.

    Brain Christiensen asked:

    …is the calendar such a key element to the Craigslist experience that it deserves a non-moving piece of real estate, always at the bottom of the viewer’s display? I can’t once think of a time I’ve looked for events on CL.

    You’re right that it’s probably not a key element, and in practice having it persistently occupy that bit of real estate might be too aggressive a method to promote it. Still I think it’s quite a nice feature that doesn’t get enough attention, and my thinking was that more people would find it more useful if more people could find it. Again, it’s all just whimsy.

  15. Very nice! This is almost exactly how I would redesign the site as well. Craigslist is currently a clusterfuck of bad design, layout and usability. I have no idea how it remains so successful – I think it has more to do with it being there first and people have been with it for so long, combined with the simplicity (calling craigslist simple is sort of funny though, it’s simple to use, but not simple to be useful).

    They need to pay you guys to implement this now. Or someone needs to finally make a worthwhile competitor.

  16. Hmm, I don’t care for it. The reason I use craigslist at all is because it’s mercilessly ugly and practical. When I’m looking at a page, except for 1 line of text at the bottom of the page, and 2 lines of text at the top, the *entire* page is content I care about. There’s nothing extra. That’s not incidental — that’s what makes it great!

    On this hypothetical redesign, the bottom footer grew to 2 lines, the top grew by a couple lines, and the right 1/3 of the page is stuff I don’t care about at all, and would never click. It’s only marginally better than Flash banner ads, to my eye.

    I think of craigslist as “my city’s neverending garage sale”. This redesign is trying to make it into “my city’s social network”. This would frustrate existing users, who love its spartan utility, and not offer any real draw for Facebook/Ebay users.

  17. I’m glad you posted this Khoi, thank you. Very nice case study for us all to reference in the future.

    I forwarded the link to Scott Dadich when he first approached me about it, just as a point of information.

    I’m very curious why Scott never mentioned the Design Eye for the List Guy work or the story of his reaction immediately following the presentation in Austin. It would have only added support to the main article’s story.

  18. A scrolling region within a window? Not a good design.
    If I knew anyone here, the words I’d use would be “utter crap,” heh.

    What makes craigslist great is it A) loads fast, B) uses the minimum possible resources, and C) doesn’t include gratuitous changes. The update to the routine to flag items a couple years ago is an example of how to change something correctly.

    I suspect the above also makes it work well on the widest possible range of web browsers.

  19. A scrolling region within a window? Not a good design. If I knew anyone here, the words I’d use would be “utter crap,” heh.

    According to who, you? Questioning this quality of design is akin to you saying Van Gogh sucks while you’re selling black velvet unicorn paintings out of the side door of your van.

    Also, if you had testicles you wouldn’t be worried about using the words “utter crap”.

  20. And I thought you guys just slapped your Craigslist redesign together in one evening over some drinks. 🙂

    As a follower of subtraction and nytimes.com I knew you guys had put a ton of thought into your contribution. Little did I know how much.

    I had read the article in Wired and I’m happy to know so much more about how you approached this challenge.

    Now when will Craigslist implement it? 🙂

  21. @Dan, re: Craig being “coy and evasive”.

    I find Craig straightforward and direct. He gets asked a lot of questions that are contextually incoherent. Again, you seem to come from a different angle, where those questions are reasonable, and I’m glad Craig does not.

    @Khoi, re: discoverability/usability of RSS. Yes, excellent point. The direct equivalent would be a MyCL that showed you “recent searches” without trying to be adaptive and show “relevant listings”, which seems to usually fail (and from a usability standpoint might be overwhelming — 300 listings paged across (e.g.) 10 bits of a scrolling div…yikes). This could be done without login, of course, which I think would be a huge usability barrier in itself.

    I’m pretty happy with CL as is, but I wouldn’t be disappointed if “recent searches” were offered as direct links (with RSS icons!) on the front page. There are privacy implications though, so doing nothing is probably a better choice.

  22. Great article. I’ve always been fascinated by Craigslist since spending a summer in New York.

    One thing that’s always occurred to me with any redesigns, is that people always fix Craigslist’s rough-edges. I thing that Craigslist is a bit like a dive bar, or a cafж with wonky tables. It’s slightly hobbyist look and rough design make it more credible and trustworthy than something polished.

    I think improving the information architecture is a good idea, but I do wonder if things like age, timeliness and worn character can ever be replicated on the web. Our normal visual cues fade away when anything can be manipulated with ease.

  23. Khoi, great realign of CL! You went into great detail in explaining the thought process behind your changes. And not alienating users and creating a new learning curve… very nice!

    I’d say that the design looks pretty ‘blue’… but I think I remember reading somewhere that many of the most successful and trafficked sites employ the standard blue-color link. Anyone else hear anything like that?

    Haha, had a good laugh at Mr. Storey’s reaction to Greg…

  24. One thing I would have inserted on the backend, but decided via design, is to make force Post Titles in CamelCase (with some basic exceptions) to ensure “New Magnavox TV 32′” would never be “NEW MAGNAVOX TV 32′”.

    That alone would be a huge welcome visual relief.

  25. Very nice. It would be nice If there would be a few more extra changes added to this design though but nonetheless it would surely make Craigslist look more alive. You stayed with the same color that we’re accustomed to when we think of Craigslist.

Thank you! Your remarks have been sent to Khoi.