Lily Bather
UX Designer

Mobile Checkout

Scan, Pay and Skip the Line
A Mobile Checkout Experience by 7-Eleven

🛒 Mobile Checkout

 

The Project.

As part of 7-Eleven's 2018 goal to become a Customer Obsessed and Digitally enabled company, Mobile Checkout launched its pilot program.

The experience is very straightforward, you scan your products using your phone's camera, pay digitally using Apple Pay, Google Pay or Credit Card and then Scan your confirmation QR on your way out. Cashless, paperless and quick.

No more waiting in line!!

When I joined the team, the project was in Test Mode, only available at the 7-Eleven store in the Store Support Center, available as a Beta only to 7-Eleven employees.

The general goal of Scan&Pay was to increase store visits and drive incremental sales through a seamless mobile experience.

PROBLEM

Customers said one of the main detractors from shopping at 7-Eleven were long lines.
This was especially true in dense cities.

THE IDEA

A feature in the 7-Eleven app with which Customers can avoid lines by using self service.

MY ROLE

Strategic design
Visual design
Experience design

The first thing we did was audit the user flow and the existing product.

Understanding the User and the Customer Journey

To understand how customers use and interact with Mobile Checkout we performed several User Interviews and Observational Studies. 
One interesting observation about this project is that the control group gave very positive reviews of the product upon trying it for the first time. Very soon we realized that the problem was User Expectations, Barriers to Adoption and General Awareness of the feature.

🛒 Mobile Checkout

LeAnthony Holliness, - A User Researcher on the team- performing user intercepts in the store

Our Research Team 

Our research team was instrumental in understanding our Customer base, their motivations and use cases.  

How can we...?

-Improve the onboarding flow to make users understand how this feature works?

-Make the payment flow easy and quick for users to complete their payment with the least amount of friction.

-Generate awareness and incentive customers to try Mobile Checkout for the first time?

The Real Challenge

A Psychological Factor

After performing Generative research we found out that Users find the Mobile Checkout easy to use, but leaving the store with products in their hands makes them anxious because they don't want other people at the store to think that they're stealing.

This and many other societal conventions are part of what we call Store Etiquette.

🛒 Mobile Checkout

Mobile Web Permission Flow

Whiteboarding

A technique we used to get alignment with the team on processes and collaboration.


🛒 Mobile Checkout

*Me facilitating an Empathy mapping workshop

Design Thinking Workshops

One of the methods used to bring the team together and co-create alongside Product teams and Researchers was through Design Thinking sessions in which we would ideate, sketch and come up with different ideas.

Some of the sessions I facilitated:

-Brainstorming

-Empathy Mapping

-UI Audit and Heuristic Evaluations

-Design Reviews

How can we generate awareness and promote
Mobile Checkout?

The Result

After a successful Test at the SSC, Mobile Checkout expanded to 12 Stores in the DFW area and in 2019 it expanded to NYC and Seattle.

Promotional video by 7-Eleven on Vimeo

🛒 Mobile Checkout

Rated as 4.8 in the App Store, #33 in Food and Drinks with 219K Ratings

7 of 10
People hate waiting in line
3,500
Stores with Mobile Checkout
87%
Conversion Rate
4.5
Star Reviews

❤️

Contributors to this project

My wonderful teammates.

Image alt tag

Ahmed Tellez

UX Design

Image alt tag

Megan Tom

UX Research

Image alt tag

LeAnthony Holliness

UX Research

Image alt tag

Michael Tinglin

UX Manager