Etsy, a playful site with a great, simple design

April 10, 2007

Pamela Poole, a fellow moocher who lives in Paris, suggested I take a look at Etsy.com, a site that allows individual artists to sell their hand-made works, for ideas on community and “web 2.0 stuff”.

I absolutely fell in love with this site. The layout and color scheme is beautiful, simple, yet under-designed. I like what they’re doing with typography, using 3 color (black, orange, blue). The only use of drop shadows is on the buttons, which makes sense. They group things with light grey borders. They sucked me right in, and I went through 24 screenfuls of teapots, ending up buying three, which is something I never do.

Il 430Xn.1309400Il 430Xn.5820110Il 430Xn.5820243

Look at how cleanly they group the shopping cart information, with boxes around each product, and a green checkbox to indicate a successful order.

Etsy1

I’m writing about Etsy because this is the kind of feel I’m trying to do with BookMooch.

Looking at a book detail page like this one:
Bdet

there are similarities, with the soft colors, search at the top, and clarity of layout.

However, they’re doing a lot more with typography, grouped details using background colors and a lot fewer linked items (all those linked topics in BookMooch are perhaps a bit overwhelming) to distract. Note how they use a pale blue for hyper-linked items, so they don’t _scream_ at you visually like the default dark, underlined blue at BookMooch does.

The clincher is the hilarious photo page of the Etsy staff, in their white lab coats and little signs with their names on them, and the personal touch of a signature.

Etsyp

Now, what I didn’t see a lot of is the “web 2.0” community stuff Pamela was suggesting I take note of.

Anyone have suggestions for community/outreach/web 2.0 stuff that they’d like to see at BookMooch?

-john

2 Responses to “Etsy, a playful site with a great, simple design”

  1. John Alwyine-Mosely said

    Hi, agree with the layout and design as they managed to combine tabs, buttons and links at the bottom without making it seem busy or complicated to navigate. A site that illustrates how not to do it is http://www.writing.com. I would love dearly to be part of the writing community but it completely confuses and baffles me on the few occasions that I go on.

    As a non-techie and mere humble user of sites, the Web.2 goes over my head but I think it could mean Bookmooch repairing the map tool so we can see where our books go and come from but linked to our individual pages so I can see this when I link on to their page. Possibility of 1-2-1 or group discussions about book topics and content rather then the processes of getting books. Video clips for bio details. More detailed feedback linked to agreed common condition guidance. Members give links to other sites they are members of with handles etc. More competitions that are book content focused such as reading challenges, or why a book is good or bad linked to fun polls

    John A-M

  2. I’m not sure I see the web 2.0 bits either, unless they become obvious during checkout (which I haven’t done… yet). Perhaps the tags? Could those be pulled in from LibraryThing, I wonder?

    I do like the idea of letting users list other site memberships… LibraryThing, LaLa, and Peerflix come to mind. (Like my books? Trade my music….)

    I have often thought the blue links were a bit in-your-face, so I’m glad to see that’s on your radar. I think a dotted bottom border is a good way to make link underlines less prominent, although you’re stuck using the IE7 javascript suite to get around IE6’s inadequacies when you use that trick.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: