Self-checkouts

Creating consistency in self-checkout interactions with a framework for designers to follow.

Background

The design team at Sainsbury's is redeveloping the hardware and design of their self-checkout experiences so they sit internally.

Currently, the design is controlled by an external company, which limits the things we can change from a copy and design point of view.

The self-checkouts project aims to define and deliver the future of in-store checkout experiences.

Brief

Within the scope of this large self-checkout project, one area I really wanted to focus on in the early stages was around interventions.

Interventions are when the customer is shown a dialog by the self-checkout service. This can be for anything from a colleague needs to approve the purchase of alcohol, or the customer has put the wrong item in the bagging area.

The reason I wanted to explore this area of self-checkouts first was because within the self-checkout experience, it's the main source of conversation and dialogue between the customer and the self-checkout.

Research

When it came to researching how we best talk to our customers during self-checkout interventions, the first thing I did was explore how we're currently talking to our customers on self-checkouts, and then how our competitors were talking to their customers.

When auditing the common self-checkout interventions that Sainsbury's customers would see while shopping, a few themes were obvious.
‍
After noting these themes from the Sainsbury's interventions, I started to look at how our competitors dealt with interventions. I focussed on the intervention that customers see when they try to buy an age restricted product, like alcohol, as it's one of the most common interventions a customer will see.

As you might notice, my way of finding out our competitor's intervention copy was to go to the store and take a sneaky picture. The following images are from Lidl, Tesco, and Morrisons.
‍
Lidl‍
Tesco and Morrisons‍
Looking at the three intervention messages from our competitors, one theme that stuck out to me was that none of the messages were very friendly, or reassuring, or even used particularly human language.

Each uses formal language like 'assistance', 'approval', 'age restricted product' that customers just wouldn't use in normal conversations. So my first thing I wanted to do when I started rewriting Sainsbury's interventions was to make sure they sounded human.

Rewriting an intervention

Because it's the intervention I'd looked into the most, as well as one of the most common, I first started looking at how to rewrite the intervention that customers see when they try to buy an age restricted product.

As a reminder, this is what the current Sainsbury's intervention for this experience says.
Just focussing on the copy, my main issues with this intervention were:
With those issues in mind, I started drafting some possible headlines where the principles of the headlines could be applied to every intervention going forward.

I saw the headline as the most important piece of copy on the intervention. It's the piece of writing the customer is most likely to read, and it needs to set the tone of the dialogue and also tell the customer what's happening next.

I felt that the most important thing to get across to the customer in this moment was that someone was coming to help them.

So the first pieces of copy I looked at sounded like this.
At this stage, I felt like 'We're sending someone your way' was the best solution out of these three. It felt the most conversational and friendly. And I really liked the use of we're and your as a way of personally connecting with the customer.

The issues I had with it still though were the use of the vague 'someone'. Plus the fact the copy was quite long without saying an awful lot. The customer still doesn't know why we're sending someone their way.

Which is why from this point onwards, along with a designer on the self-checkout project, we started looking at these intervention messages as not just headlines, but copy underneath, like below.
The addition of the sub-copy meant that I could focus on keeping the headline as friendly and focussed on one topic, while the sub-copy did the job of explaining more detail to the user.

I still felt like the headline copy here was too long and could be friendlier, and as I wasn't a fan of the 'someone' but really liked the 'we're' - I ended up with this.
I was happy now that the header was concise, friendly and because the whole intervention is full of 'we', 'our', 'your' and 'you' - I feel it comes across as a much more personal message than 'Someone is coming'.

So with the copy in a good place in my mind, the final step for this intervention was to decide on the icon that accompanied it. In the old intervention style, the intervention would have ended up looking something like this.
The red and the use of the X icon just gives a negative impression to the customer that they've done something wrong to see this message. It has the effect of blaming the user, which we definitely want to avoid.

At the time of working through this, I'd been working with a designer in the guidelines team on a project around a group of semantic colours to a guidance page. Semantic colours are a group of colours that help communicate key messages like errors (red), warnings (yellow), successes (green) and understanding next steps (blue).

The idea behind semantic colours is that they keep cognitive load low and makes for a unified and engaging user experience across our brands.
With this in mind, I suggested to our self-checkouts designer for us to use the semantic colours as a way of framing each intervention.

In the instance of this age restriction, it definitely didn't feel like an error, or a warning. And it wasn't a success message. But we were giving the customer information, and we were helping them understand the next steps.

So through a process of elimination, we went with the informational blue for this intervention message.
With this intervention defined from a copy and design point of view, the next step was looking at ways we could apply this thinking to multiple types of intervention messages at once.

Creating an intervention framework

With the copy of one intervention message agreed upon by the wider self-checkout team, I knew that I couldn't spend as much time on every intervention message (there are around 40 to date) as I spent on that one.

So I wanted to create a bit of an intervention framework.

The idea behind my framework is that every type of intervention could be grouped into a certain section, and depending on the section the intervention is in, that would impact the type of copy and design used for the intervention.

I wanted to create this framework for a few reasons.
When starting this framework, I knew my intervention categories would mirror the semantic colours of: success, error, warning, and information. So with my four categories easily decided, I could begin 'the rules' of each category, which would help define what interventions fell into each.

Success interventions
Information interventions
Warning interventions
Error interventions
With each of the four categories now defined with a set of rough guidance for each, I could now begin to use the framework in practice and start writing some of the more common interventions following the framework I'd created.

Below you can see the table I created and how each of the interventions fits into one of the categories.
Going forward, the idea behind all interventions on self-checkouts is that they will fall into one of the four categories, and then the copy attached to the intervention will follow the guidelines set out for the categories.

Next steps

As the self-checkouts project is still ongoing, at this stage I have shared the framework with the designers on the project who are starting to use and consider it whenever a new intervention arises.

The project still has a long way to go, and we're not yet at the stage where we're testing the hypotheses of this framework, but that will be coming once we're further along.

I think though, regardless of testing at this point, the hope is that this framework will help empower designers to be able to lead on writing and designing their own interventions by following the simple guidelines.

This will hopefully drive consistency and efficiency across the entire self-checkout project moving forward.

Let's get in touch  🚀

If your next big project needs to sound a little bit more human, let's work together on it.
callumkilbs@gmail.com
If you want to keep in touch, we can also connect on LinkedIn.