Ultimate Ecommerce Store Design Tips 2021

I’ve designed with load of ecommerce stores over time. I now almost exclusively work on Saas and ecommerce stores. My client sites make a lot and save a lot of money. I’ve been fortunate enough to be involved in almost every aspect of launching a new ecommerce business.

I’ve learnt a lot about what‘s important and what's not, and over time I’ve come to understand where to focus your efforts when designing or building your store.

Things that Do Matter

  1. Navigation
  2. Product Pages
  3. Product Images
  4. Load Times
  5. Simplicity
  6. Delight With Details
  7. Social Proof
  8. Mobile

Things that Don't Matter

  1. Desktop
  2. Your Buttons
  3. Fixed Headers
  4. Brand vs Conversions

Things that DO matter

Navigation does more than just move people around the site. It’s hard to do well and it never gets enough thought. Though navigation will determine a lot of spend is the easiest item to test and iterate on your site for increase of conversions.

Bellroys navigation does a great job of educating on the product range as well as a navigation.

You want to be clear with how your products are grouped. In a previous article I explained how 2 store experiences could have quite a different navigation experience in the same industry. Both offer quite different experiences based on product line. One had 5 products, the other over 200. So giving the user a clear case to explore by categories or not is a huge deal in the buying process.

Tips

Product Pages

Having a very clear product offering that displays why someone should buy, what's included in the offer, who the offer is targeted at with a price point that fits is a customer is the icing on the cake to the ultimate ecommerce store.

With that being said it offers the most amount of optimisation tips.

Tips

Product Images

In a place where somebody can’t physically see and touch your product, great product imagery is absolutely key. This is literally the difference between someone buying your product and not. If I only had a small budget I would spend it all on getting good imagery.

Ugmonk.com is well known for it’s great product imagery. It has clean images on grey backgrounds and lifestyle imagery combined (hint: this type of layout works really well if you want to use a mix of imagery styles)

The truth is most of the time people don’t care what you’re site looks like. If the information is compelling and it’s easy to get around you’ve won 70% of the battle.

Tips

Load Times

The truth is most of the time people don’t care what your site looks like. If the information is compelling and it’s friction less to move around you’ve won 80% of the battle. I’ve found that the visual design is more about brand consistency than anything else.

Getting your load times performing well is a hard tasks for your developers, especially when you’re insisting on having 12 unnecessary plugins or app extensions on the page.

Tips

Simplicity

Simplicity is hard! Most client discussions start with ‘lets just keep it clean and simple’ because people correlate simple with easy and fast. The truth is simple is plain hard.

To me Nike always do a great job of this. When you look at their pages there’s only the information you care about and no ‘fluff’ (it helps when you’ve already built up that brand equity).

Can you remove all that copy and explain it in a single image? Do you need all that content there or is there a better way to explain it? Be ruthless on what you can combine and what you can remove all together.

Tips

Delight With Details

Now that you've simplified you store to be fast and simplified how can we delight the user. This could just be a clever piece of visual patterns or fun illustration. These make the brand more differentiated, memorable and it improves the user experience.

Casper does a great job at small details. Subtle things that you may not notice but you really feel the brand as you move through the site.

Tips

Social Proof

The thing with adding social proof is it has to be genuine. Too many people just shove quotes in and that's it, but the reality is we know you’ve cherry picked them or even made them up. Let the customers speak for themselves without forcing it too much.

Utilise reviews if you can. If you’re using Shopify there are plenty of easy options here such as Yotpo, Stamped.io or Judge.me which will send out automated emails asking your customers to review.

Tips

Mobile

Because nobody is using a laptop except you!

Not many people do mobile well but Nike and Warby Parker have pretty streamlined mobile experiences.

Mobile is harder to get right than you think. You need to strip it down to it’s simplest form, but in doing so you can also end up with a barebones desktop site so it’s a tough balance to crack.

Tips

Things that DON’T matter

Desktop

Ok so this isn’t strictly true and Desktop still has a role to play among certain audiences. But from a consumer perspective it’s dying. In 2018 I’ve seen a huge spike in traffic among all my B2C stores that now puts mobile in the 60 — 90% range.

Because we spend all our time on our laptops and that’s the device we are looking at it on, it’s easy to get caught up thinking it’s important. In most cases it’s only you and your team that are looking at it on that device.

Of course this advice has to be predicated on your audience so check that first before making any rash decisions. But if we follow the 80/20 rule (where 20% of your effort generates 80% of your results) then desktop often doesn’t warrant much of our focus.

Tips

Your buttons

I feel it’s one of those issues people love to discuss because it’s easy and measurable but the reality is it’s not as important as you may think. Sure, test it but don’t get hung up on it. You need to get out of obscurity well before you test a button for it's text, colour or size.

If you A/B test your pages with different buttons you will likely find a winner but it will also likely be by a small margin (of course you need to make sure your call to actions are visible and easy to spot regardless).

Tips

Your Fixed Header

It’s annoying, it gets in the way of things people are trying to look at. If you think it’s useful make it either very small or show only when the user is scrolling up (you can guess they are trying to get back to the top then).

As owners we tend to love features like this because we think ‘oh they’ll be able to easily get to another part of the site’. If you’ve done a good enough job on your product/brand then scrolling up a little will be no issue.

Tips

Brand vs Conversions

A brands ability to differentiate from it's competitors is far more valuable then a few small upticks in conversion.

I implore designers to have a conversion and measurement practice but I also think a brand manager can do a lot more over time to increase revenue around being different and getting out of obscurity.

So it's a trade off that pulls from one another, brand is a 30,000 foot view approach and conversion rate optimisation is a hands in the dirt approach, testing what works in the short term.

Share this page on Twitter · Back to the blog


Did You Enjoy This?

Then consider joining the other conversion curious getting the newsletter. It's a provocative look into marketing and converting customers.