A 10,000% increase in sales over 5 years. Sounds incredible doesn’t it. Just to make that an even more incredible, their average customer is in their 80s! Who said the elderly don’t use the internet.
When we started working with Wiltshire Farm Foods their monthly revenue was a 100th of what it is today.
Of course in reality that success was not down entirely to us. Matt Curry, our client at Wiltshire Farm Foods has put his heart and soul into that website and as I say in Chapter one of the Website Owners Manual, it is the site champion who makes or breaks a site.
The organisation has recognised the importance and power of the web for their business and continually invested in it both for development and also in site promotion. If they had not had the foresight to do that then the site would have failed.
So what do I put the sites success down to? Well, honestly that is hard to say. There are so many factors. However below are 8 things that have without a doubt made an enormous difference.
1. Remove clutter
Too many ecommerce websites are overwhelming. Everything is screaming for the users attention. There are offers, deals and recommended products wherever the user turns. Amongst all of this confusion it is hard to find what you want.
Amazon is like this and so we all naturally presume it must be right. However, one of the first conclusions we came to when working on Wiltshire Farm Foods is that they are not Amazon. Nobody is. You cannot presume that what works for one will work for all.
The emphasis of the Wiltshire Farm Foods website was on helping users find and buy the products they wanted. It is not in anyone interest to overwhelm them with stuff that only we wanted them to buy. It has to be the customer first.
This meant simplifying the site. With so much content shouting for attention, users could not find anything. We had to remove distraction and focus them on key tasks.
Take for example the site’s navigation. We actually hide away some of the ranges offered by Wiltshire Farm Foods. Insanity you might think. Surely this made it harder for users to find what they want? Admittedly for a small minority it did. However, hiding the less popular ranges (like soup) we could highlight the ranges that accounted for the vast majority of sales.
The same was true for product listings. Some users were interested in a lot of different information from dietary content to customer ratings. However, this additional information made life harder for the mainstream users who were only interested in a photo, description and price.
We therefore decided to move all of this additional information on to the product details page. That way it was accessible for those who wanted it without distracting the majority.
The final area we significantly simplified was the shopping basket and checkout process. As I explained in my post on ecommerce lies, once the user has made the decision to purchase you need to remove all distractions.
The shopping basket is not the time to up-sell or cross selling. It’s not even the time to provide a navigation bar to other products. At this stage you want the user to do one thing and one thing only, proceed to checkout.
Talking of the shopping cart, we also focused heavily on getting it to stand out on the page.
2. Make sure the shopping cart stands out
Too many websites hide the shopping cart away. However, this is a crucial step in shopping and the first of the checkout process. In affect the shopping cart is an ecommerce websites primary call to action.
With this in mind we wanted to make the cart as prominent as possible. We achieved this in three ways:
- We made the shopping basket button visually different from the rest of the site using colour
- When items were added to the basket it was visually updated (see providing visual feedback video)
- We tethered the basket summary to the top of the screen so that it would always be visible even when the user scrolled (see below)
As you can see from the video below, the tethering proved particularly effective and makes the call to action obvious at all times.
3. Provide visual feedback
One of the primary questions in the mind of users when interacting with a system like an ecommerce website is “did I do that right?”
Whether it is adding an item to the basket or filling in a login and password, users are concerned that they are doing things wrong. This is particularly true with a more elderly audience who have not grown up using computers.
It is therefore important to reassure users as they progress through the site. This can be achieved by providing visual feedback when the user takes an action.
For example on the Wiltshire Farm Foods website when an item is added to the basket the user gets multiple types of feedback to reassure them the item has been added:
- The photo of the item is highlighted
- The ‘add to basket’ button updates
- The image of the item visually moves towards the basket
- The basket itself updates
As you can see from the video below, the user is in no doubt that the item has been added.
However, the visual feedback does not stop at the basket. When the user is confronted with a form they are clearly shown what fields are required, and which have been completed correctly or incorrectly. This information is updated without the need for page refresh.
4. The bigger the better
An image can say a thousand words. It is therefore unsurprisingly that the product shots on an ecommerce site are massively important. Even if your audience are not the elderly with failing vision, it is still important to have nice, big, clear shots of your products.
In the case of Wiltshire Farm Foods we have taken this principle to the extreme.
As we saw earlier the product list is essentially a grid of images with the addition of some basic product information. The image sells the meal in a way words never could, and the grid allows us to have large images. However, we did not stop there.
As you can see in the video below, clicking on a product listing displays an even bigger image in the product details. We also allow users to click on this larger photo and display an even bigger version that expands to fill the width of the page. This leaves the user in no doubt about what they are getting.
Of course this is dependant on having decent shots of the product. If you can only invest in a single thing for your ecommerce site this would be it. Spend money on getting the best photography you can. Its worth every penny.
5. Make buttons and links obvious
A continuation of the ‘bigger is better’ thinking can also be applied to buttons and links. Admittedly this might be exaggerated by the Wiltshire Farm Foods audience, but in my years of user testing I am constantly amazed how often users fail to spot important links and buttons.
You will therefore notice how ridiculously big some of the links and buttons on WFF are. However, size isn’t everything (no innuendo intended).
We also gave a lot of attention to appearance and wording too. For example, notice in the image below how the link looks like a link. Also we did not rely on the link alone because the wording of the link doesn’t communicate the action. We therefore added a button that communicates how clicking it will allow the user to ‘view all of our beef meals’.
The descriptive nature of buttons can also be seen elsewhere on the site. We are very conscious that users do not always read copy explaining buttons and so the button itself needs to communicate all the information required.
Take for example the image below. If all you read was the two buttons you would know exactly what choice was available. The surrounding text is entirely optional.
6. Always be there to help
An ecommerce transaction raises a lot of questions in the minds of users:
- Is delivery free?
- What if I don’t like the product?
- Is my credit card information secure?
In addition there are questions about the site itself and how to use it.
Surprisingly many ecommerce websites seem reluctant to help their customers. Delivery and return policies are buried. Reassurance about security is limited to a tiny badge or padlock. And most importantly you have to search high and low for a phone number.
We were determined to address these problems on the WFF website. In the end we settled on three approaches:
1. The one stop solution
Our first move was to bring together all help into a single section of the site that was prominently displayed in the navigation bar. This avoided the user having to hunt around for different pieces of information.
We then looked at the enquiries received by WFF customer support and used these to identify the top issues. These where then prioritised and presented on the help homepage.
As you can see the top question was “how do I contact you” so we prominently featured the telephone number. This was then followed by questions about ordering and the website.
2. The getting started guide
We also took an idea from the video games industry and provided users with a tutorial. However, the idea of the tutorial (which we called a getting started guide) was to guide users through their first transaction.
This is displayed prominently on the homepage and gives users who are overwhelmed by the site a starting point.
3. Context sensitive help
Finally, we also wanted to provide context sensitive help throughout the purchase process. These are small pieces of microcopy found throughout the site nudging users in the right direction.
7. Handle errors gracefully
No matter how well designed your site or how much help you provide, things will inevitably go wrong.
If you do not want to lose the sale, you must handle the error gracefully and reassure the user they can still continue.
This is particularly important when working with the elderly audience found on Wiltshire Farm Foods. However, it is always wise to give users as much help as possible and not make assumptions about their abilities.
Below are a couple of examples of how we handle problems on the site.
The first example is an error message that appears when the user fails to login. There are several such messages across the website. However, they all have two characteristics in common:
- The message is highly visible – This is achieved either by strong visual branding (as above) or by positioning the message next to field being edited (as in context sensitive help) .
The message tells the user what to do – It is important that messages clearly communicate how the user can overcome the problem.
The example above is probably a little wordy for most websites. Fortunately, our user testing has shown that a more elderly demographic actually reads instructional text! We can therefore take some liberties.
The second example of an error message appears when the user has entered a search term that returns no results. The danger in this situation is that users will conclude the site does not have whatever it was they searched for and so leave.
In reality there are number of reasons why no results might be returned. In such situations provide some guidance on searching. We also went one step further by including a phone number in case all else fails.
8. Communicate your value add
The final lesson we have learnt from working on WFF is the importance of communicating what extra you offer customers.
The problem is that there are so much choice for consumer. How for example could an organisation like Wiltshire Farm Foods compete with such a well known brand as Tescos?
Tescos sell frozen meals and a lot more besides. They deliver to your door and have a much broader range of products (although admittedly not frozen meals).
What enables Wiltshire Farm Foods to compete is their value added service. These include:
- Police checked delivery staff
- The option to pay cash on delivery
- The ability to place your next order with the driver
- Delivery staff will even unpack meals and place them in your freezer
When you are trying to each an elderly audience, these kinds of extra services are a real selling point.
Of course, these USPs are no good if users are unaware of them so considerable effort has been put into clearly communicating these on the site. In fact we are in the process of doing even more work in this area.
What are your USPs and are you clearly communicating them on your site?
Is that all?
So if you follow these 8 guidelines will you increase your sales by 10,000%? The answer is probably not.
In reality there is a lot more that affects the success of an ecommerce business than its website. There is the ongoing communications, customer service, fulfilment, and marketing to name but four.
The 10,000% increase makes a good title for a blog post! However, the percentage growth is not really the point. What matters is that by following the advice here you will be guaranteed to see growth and that is what matters.
However, if I could leave you just a single thought it would be this. Wiltshire Farm Foods looks a million miles away from the busyness of Amazon and indeed many other ecommerce websites. Do not just blindly follow the crowd (or even the advice in this post). Instead learn what your users need and give it to them. It really is that simple.
Of course, you might need some help doing that, but even the answer to that is simple. Give Headscape a call ;-)
- 5 exercises to engage clients and stop you wireframing alone
- Call to Action: The 10 Most Effective Techniques
- How to tell if you are a design snob