Category Archives: eCommerce Best Practices

Product as the Hero. Let them fall in love with it.

GG LegoBatman2

There’s a narrative that’s happening on your site whether you’re writing it or not. The only question is: who’s your protagonist?

In a well told story, the audience cheers for the protagonist. Is that your brand? Company founder/face? Something else entirely? Some sites are so poorly organized that people get bored and get out.

Some, on the other hand, are awesome.

Hard Graft:

I love these guys. Even from the landing page (as previously featured here), these guys are clearly all about product. They live and breathe product. And after getting you from the landing page to the product detail page, they take it to the next level.

hard graft Product 1

Crisp, uncluttered page. Its all product, a review from a dude with a Managing Director title. The leather looks so crisp you can practically taste it.

But then, if you click on the product: it takes over the entire screen.

hard graft Product 2

Full page shots. Multiple of them. Product in action, product on a desk. Product in use, product not in use. All with super-clean, focused photography. I don’t even need an ipad/laptop case, but i’ve got so much depth and detail on this thing, I can’t help but want it.

Now, is it crazy to suggest that you put product pictures on your site? Of course not. The crazy observation is that sites with focus on the product, rather than lists of features, expounding copy, and other extraneous picture are better at creating an emotional link between you and your customer.

Take a hard look at your product page. Do you have tiny pictures? Do you have paragraphs and paragraphs of text and bullets that no one cares about? Do you do that weird zooming thing where a magnifying glass follows the mouse pointer? (you know who you are.)

Get back to the basics, clean it up, and let your product be your hero.



Telling stories: There’s a reason we love your brand

Old Book 2

The landing page. Its the start of a narrative, the beginning of a relationship, and if you’re good — the opening of a great story.

Sometimes, the product is the hero. Sometimes, its something else entirely. However, the common thread is that the great sites start showing you the road to walk down, paved with yellow bricks and all.

In the first example above, we’re looking at The North Face:

Landing rotation The North Face

The story is clear, and comes at us from all directions. The North Face isn’t just slinging product — they are collaborating with top athletes from multiple disciplines to bring us awesome stuff. Cool photography and immediately believable.

It’s about adventure, adrenaline, and athleticism — in some out-of-the way spots all around the world.

The second example above is from the Yoox site over the holidays. landing color voice

Here, the story is a little different. It’s colorful and fun. Its evocative of the holidays, and the heartfelt silliness that comes from hanging out with our loved ones. Its playful, hints at presents (and who doesn’t love presents) and extremely interactive. Each color had a different scene with relevant product and a similar spirit.

Indeed, you can click right on the scenes to start getting lost in the store.

Finally, one of my favorite storytellers: J.Crew.

J.Crew Landing 1


Sure, the landing page shows you product, and good landing pages do that. But it does more — it starts telling you about the reason you came there. Were you looking for a cashmere sweater => come right this way.

No? That’s okay, maybe you came looking for a suit.

J.Crew Landing 2

You’re thinking about fabric, and the clothes, and before you know it, you imagine the places you’ll go, and the things you’ll see in the sharp new threads that you could have in a few clicks.

Ultimately, it doesn’t matter whether the shopper was looking for cashmere or a suit. The juices are flowing, the pictures are inviting, and the story of what might happen has begun.


Content use on Oki-Ni

oki ni Landing 1

As you may know, one of my favorite things in the world is a solid, contextual play for content-meets-commerce. I’ll tell this to anyone who will listen. In a retail experience, you can build story through the fixtures, the layout, furniture, artwork, and the clothes worn by store associates. On the web, you can actually build stories.

Oki-Ni does a solid job of getting their point of view out there. As soon as you land, they have product, for sure — however, there are tiles just as big dedicated to designer stories, travel reports, team members opinions and more, all with consistent, well mixed photography. Plus, there’s a lot of it. It keeps scrolling at just the right speed, so just as you might have been about to lose attention, they hit you with something new and pull you right back in.

oki ni Landing 2

Content and Layout on & Other Stories

Other Stories Landing


There’s something I really like about the landing page at & Other Stories. Its loaded with stuff that keeps my ADD busy, while cleverly showcasing a ton of interesting stuff about their brand. The seamlessly mix editorial content, product, collections of product, video/animations, promotional announcements and more. If someone told me they were going to do all that at once – I’d think it would turn out to be a mess! These guys, however, deliver.

Detail-driven browsing at SO Jeans

SO Jeans Browse

Shopping for jeans on the web is usually hard enough. Like any category where the user might have nuanced and sophisticated tastes, the usual mix of pictures and words just might not be enough to get the deal done.

SO Jeans figured the way to get through to a detail-driven customer was to be detail driven themselves. In addition to being able to sort by size, color and brand (which, lets face it — for a site with a lot of product, these are table stakes) they also let the shopper sort by visual descriptions of what they are looking for.

SO Jeans image filter

Low rise? Straight leg? No problem. Plus because its visual you can be more certain that the words mean what you think they do. It also means that these guys took the time to build the data on all of their product to power a feature like this — no easy feat, and one that’s sure to earn them some loyalty.

Super colorful and playful landing at Visbyh

Visbyh Landing


Visbyh is a fun little site that sells bright and colorful cases/accessories for iphones and your other favorite electronics. They are a company all about color, and the simplicity of their product. They make brilliant use of this simplicity with their landing page that shows off their colorful flavor, with subtle mouseovers that show off just enough of the product for you to want to click in to learn more.

Visbyh Landing 2

Simple and elegant at Retrosuperfuture

Super Landing 1


I will not start by saying I think Retrosuperfuture is an amazing name/description of a brand, nor will I acknowledge the mental jiujutsu of stampung “super” on every single one of your products. Brilliant.

That said, these guys have a very clean, very simple approach to their site, and their landing page does a great job of showing you the products and recent partnerships that they’re proud of.

Fun and practical browsing on Lole

Lole Women Browse 2

Lole is a colorful, activity-driven activewear brand that really pays attention to why the shopper is picking up the product. Their selling points include the techical details of fabric and fabrication, so they really want the shopper to know that there’s a difference in the product they’ve designed for running, tennis, yoga, etc. They are aimed squarely at their active customer, and as a result, are able to play up their purposefulness. Everyone is selling tank tops, Lole is selling a better way to play tennis. Definitely a win.

To boot, their browsing experience has a ton of best practices. Merchandised focus on high-relevance product, varied layout, and mixing in of promotional messages.

Lolë Women Browse