1. Blog
  2. Earn Money
  3. Technical

14 cracking UX features of online supermarkets

Picking which online supermarket you prefer to park your trolley in can be based on little more than which supermarket you regularly visit in the real world.

It’s the one you’re used to, the one you’ve got a loyalty card with, it’s also probably the one that’s closest to your home.

We sometimes forget that we needn’t be beholden to such boundaries when we’re shopping online for groceries. We have the whole of the nation’s biggest food retailers to choose from and each has their own particular conveniences.

You’re decision on which ecommerce store to shop with may purely come down to which offers the cheapest products, reasonable delivery charges and the availability of a convenient delivery window.

However if all these things are moot, it may also come down to which offers the best user experience.

This post is not meant to definitively suggest which supermarket out of Tesco, Asda, Sainsbury’s, Waitrose or Morrisons is the best, it’s just meant to highlight various UX features and tools that make for a great customer experience, features that other ecommerce site designers could learn from.


Mobile continuity

The dream of multichannel integration is here! After filling up a basket on the desktop site, leaving it and picking up my mobile to download the Tesco app, I was overjoyed to see that the contents of my basket and reserved timeslot are all present and correct.

Barcode Scanner

One of my favourite features of Tesco’s mobile app is the barcode scanner, which cleverly integrates the smartphone’s camera.

Of course to show you the barcode scanner at work, I have to screenshot a none barcoded item. Here’s my LEGO colleague instead.

The scanner works instantly, and you’re taken directly to a product page. 

More barcode scanning

Tesco’s barcode scanning technology isn’t just used for adding products to your basket but when you register you can use it to scan your Clubcard in rather than typing in the 18 digit number. 

Clubcard integration

Another brilliant, if slightly unnerving, feature is that when you register your Clubcard, the homepage is immediately populated with products you have bought already offline.

I would show you a screenshot but I’d rather you didn’t find out that I spend all of my money on tinned chilli con carne and My Little Pony stickers.

Device consistency

To provide consistent UX even outside of the site itself, the layout of the calendar mimics that of the iPhone.


How to shop

Asda remembers that not everyone that arrives at its website will be as web savvy as everyone else, so the first link in the first drop-down menu is a guide on ‘how to shop’.

Which takes you through to this well written, easily navigable step-by-step guide.

Delivery area check

Upon registering, the first thing Asda asks you for is your postcode, which it then uses to tell you immediately whether it can deliver to you or not. This potentially saves you wasted form-filling time.

Although it actually took me a while to find a postcode Asda would struggle to get to. Turns out it’s in the Outer Hebrides. Even then, Asda still reminds you that it also offers a Click & Collect service. Even if the nearest store is 84 miles away.

Receipt Upload

This feature allows you to type in any previous Asda receipt number from an offline store. It will populate your favourites list with every item from the receipt, which you can then either delete, or move to your basket.

Customers also bought…

Tonic for your gin?

Gin for your tonic?


Image based cart

On the Morrisons mobile app I very much appreciate how images are used instead of text, also I’m a big fan of how the products are categorized by locations in the kitchen.


Also note the running total of how much you saved in the top right corner.


Import products you’ve purchased elsewhere

After you’ve booked a delivery slot, a pop-up appears asking if it’s your first time and whether you’d like to import your favourite products from a rival supermarket website. 

As long as its Tesco, Sainsbury’s, Ocado or Asda.


On the homepage there’s a notepad that you can quickly write your shopping list down on, hit search and Waitrose will find these items for you.

The results are really quick, and the relevancy is down to how much detail you give initially.

Tesco’s digital & personalised marketing director Tom Daniell will be speaking at our Festival of Marketing event in November, a two day celebration of the modern marketing industry featuring speakers from brands including FT.com, LEGO, Barclays and more.

No Comments
Comments to: 14 cracking UX features of online supermarkets

Recent Articles

Good Reads


Overview VipsPM – Project Management Suite is a Powerful web-based Application. VipsPM is a perfect tool to fulfill all your project management needs like managing Projects, Tasks, Defects, Incidents, Timesheets, Meetings, Appointments, Files, Documents, Users, Clients, Departments, ToDos, Project Planning, Holidays and Reports. It has simple yet efficient layout will make managing projects easier than […]


Turquoise Jewelry is one of the ancient healing stones used for personal adornment and astrological benefits. The rare greenish blue-colored pectolite is celebrated for its enchanting powers among many crystal lovers. It is a hydrated phosphate of copper and aluminum that ranks 5 to 6 on the Mohs hardness scale. It is deemed a protective […]