This week, we have a guest post from Whereoware’s Creative Lead + Front End Developer, Rochelle Pennington. Rochelle has been a web designer and front end developer for 5+ years, and has helped the Whereoware team design and develop more than 50 websites for our clients. Over the years, she’s picked up a few tricks of the trade, and she knows how to spot a good design when she sees it. Here, Rochelle provides a round-up of some of her favorite e-commerce websites:
1. Barneys New York (http://www.barneys.com)
Barneys.com features a beautiful, bold product detail page design that online shoppers don’t normally get to see. Tall product images are no longer off-limits; Barneys flaunts its large photography, and includes highly relevant upsell content around the main product.
Hiding non-essential content, like the product description and specs, removes clutter and allows consumers to focus on the important stuff (like pictures and the “buy” button!). They keep the important information up above the fold, making it super easy to purchase.
2. United Pixelworkers
I love the UnitedPixelworkers.com website because it proves that an e-commerce site can be light-weight and responsive. Since it is content-light and contains only necessary product information, the site is able to load quickly, minimizing wait time for customers. In addition, the site’s advanced design allows for it to be responsive to customers’ own devices.
Rather than directing mobile or tablet visitors to a mobile site, the United Pixelworkers site is designed in such a way that the same exact website can adapt to all different screen sizes. The site’s layout is not dependent on the device, but rather on screen size, with all page content able to shift to fit in smaller screens. In terms of information, the website provides only what is actually necessary – cost, shipping, in-stock status, a description, and an image. This is true on both the mobile and desktop sites. This kind of minimalism makes it easy for customers to navigate, find what they want, and ultimately purchase.
United Pixelworkers also does something that we don’t see much of on other e-commerce sites: product availability (in-stock, out of stock, running low) is graphically represented, with a nifty bar for each product variation. The bar is shaded to represent the remaining inventory; if a product is out of stock, the words “out of stock” appear in the bar rather than shading.This achieves two ends: giving this kind of information to the customer early in their shopping experience sets expectations, and decreases the feeling of frustration they’d potentially get after adding an out-of-stock product to the cart. In addition, seeing a very limited amount left in stock may be the final impetus a customer needs to make a purchase. Pretty clever!
I find myself shopping on J.Crew’s website…a lot. Besides having great products, one of the reasons I’m so loyal to them is because they make it easy for me to spend my money – not so great on my wallet, but awesome for them!
J.Crew offers PayPal as an alternate secure payment option, which is fantastic for customers who are wary about giving away credit card information. In addition to being secure, it’s also fast and convenient because customers aren’t asked to enter their billing information again and again.
Another thing J.Crew does well is to provide a clean website design (minimizing distractions) and well-organized products. Viewing all products within a parent category would normally return an endless sea of content, but J.Crew does a great job visually breaking up product thumbnails into their respective subcategories.
Sugarpova.com is the youngest site on my list, but it’s quickly become one of my favorites. Sugarpova’s product detail pages have many things in common with Barneys’, so you can probably guess that I’m a big fan. Just as with Barneys, simple page layouts, large imagery, and minimal copy let products shine.
The minimalistic design is carried over to the shopping cart and checkout pages, featuring an easy one-page checkout process that keeps a running tab of all information the customer has entered in the right-hand column. This website just makes online shopping a breeze.
5. West Elm
West Elm is another one of my favorite retailers. If you step inside of one of their brick & mortar stores, you’ll find yourself in an insanely detailed showroom, and it’s not hard to imagine a few (or all!) of their products inside your home.
West Elm stores achieve this by showing you their products in their natural environment (i.e., your living room and bedroom). They do the same thing online, too.On their website, they offer up alternate product images* almost anywhere they can, including on the home page, category landing pages, in the quick view, and even on thumbnail rollovers. Being able to view product in context can make purchasing online less intimidating, so why not allow customers to do so at every opportunity?
While eye candy encourages customers to stick around, providing faceted search filters will help them make easier buying decisions. Faceted search is when the user performs a simple search using a keyword or two, then narrows down their search results by selecting the appropriate checkboxes or drop downs (sorting by price points, color, material, etc).
*Side note: including high-quality, professionally directed photography is an absolute must. Your website may be the only opportunity you have to make a good impression on potential (and returning) customers, so I highly recommend investing in exceptional silhouetted and/or environmental photography.
There are many factors I didn’t get to list that make a successful e-commerce website, but I’ll save those for next time!
What is your favorite e-commerce website? Why?