M&S Scan Pay Go

Prototyping a mobile web app for customers to scan their shopping and self-checkout all on their phone

"A prototype is worth 1000 meetings"

@jmj - Jeff Morris Jr

Background

M&S, like many large organisations, has consistent frustrations building digital projects. Getting products and features into the hands of customers typically takes upwards of 9 months and costs hundreds of thousands of pounds.

Leading the design team for Zone Digital, we wanted to demonstrate that it is possible to get a product into the hands of real customers making actual purchases in a matter of weeks using lean, agile methods.

Role

Product Design Lead - Zone Digital

Team

John Coghill - Project Manager

Alex Baulch - Developer

Rhiannon Jones - UX Writer

Zara Huddleston - Illustration & Icon Design

Dates

August - September 2017

The Problem

M&S want to help them tackle the problem of long lunchtime queues in urban areas. These cause a number of issues:

  • The long queues snake through the aisles of the store blocking access to shelves

  • Customers are turned away by the sight of such long queues

  • Staffing is challenging because the 2 hour lunchtime peak is su much busier than the rest of the day.

M&S Scan Pay Go

Experience map with associated tests and and measures

M&S Scan Pay Go

Workshops with M&S stakeholders

Process

We followed Lean product development principles and incorporated elements of Agile development and user centred design. In practice this meant a few keys things:

  • Understanding our customers: M&S already had extensive customer research which we could build upon as a foundation.

  • Understanding the context of use: It was crucial for this project as the in-store context was so specific and restrictive.

  • Defining hypotheses and testing against them: We were clear about what we wanted to measure at each stage of the process and tried to measure it in the leanest possible way.

  • Prioritising learning over outcomes: Our approach focused on answering the most important questions to discover whether the concept was feasible and develop a deep understanding of what would be required to implement it.

  • Building a MVP and iterating it: We had to be clear about what minimum meant for the project with each iteration and only develop what was needed to progress our understanding.th staff.

Research & Data

We spent time examining customer purchase data to define the scope for the trial including which products should be available, and what should the basket limit be.

We took a highly iterative prototyping approach for this project testing with friendly users at first and gradually working up to real customers incrementally:

  • User Journey: Our first tests were of individual parts of functionality and the overall flow with InVision prototypes.

  • Ergonomic Testing: In parallel, we also tested ergonomic elements to understand the difficulties of scanning barcodes using a phone camera, while holding the product to be scanned. This helped us understand the physical challenges customers will face using such a service in a busy store, and some of the solutions they come up with organically.

  • Staff Trial: We next ran a M&S staff trial in the branch closest to the head office, gathering qualitative feedback about the experience and the sometimes uncomfortable feeling of leaving a store without paying at a till; and looking at analytics to understand the speed of scanning in the app.

  • Store Trial: We next ran a customer trial in a single store at Bankside, this helped us to understand gather shopping and behavioural data about what people purchased, what times of day they used the app, how much they spent, some simple experience metrics about how they found using the app.

  • Multi Store Trial: Our final stage of the project we scaled up to 3 stores to ensure we could reach a range of types of customer and store and better understand the impact on store flow, connectivity in store and interactions with staff.

Outcomes

The project was a success on two fronts:

  • It demonstrated to the organisation that it's possible to build products and get them in the hands of real customers in time frames that are dramatically quicker (and cheaper) than previously believed possible.

  • Scan Pay Go was a viable solution. Since then the product has been further developed and scaled up. It is now called Mobile Pay Go, and available in 50 stores. In the 6 stores that the service was first trialled, there's a Mobile Pay Go transaction every 3 seconds at lunchtime. During the pandemic this became especially relevant as a social distancing measure.

Learnings

This was a project which demonstrated the power of lean and the philosophy of done is better than perfect. There were sacrifices we had to make to the user experience and technical standards in order to get the product live in a tight time frame. These included:

  • Making the service a web app instead of a mobile app since the turnaround times of getting approvals on the app store were limiting

  • Restricting the service to iPhones using Apple Pay.

  • Emailing stores a list of products that had been purchased so that stock could be manually updated, purchases properly accounted and resupplies ordered.

  • Limiting the product selection since expensive items and alcohol have security tags.

We were able to learn a huge amount, create a business case for further investment and have a much better understanding of where the challenges will be for the next stage of development.

This was also a project where the challenges of visual design and interaction design were relatively straightforward but the human and system problems were much more nuanced.