Iryna Isenko ← All work

Case study 04

Esso Extras: loyalty you can play

Four years designing Esso Extras, the loyalty program of Esso in the Netherlands: a new account and app, the website, and the end-of-year games that gave members a reason to come back.

Client
Esso Nederland
Role
UI/UX design · usability testing · illustration · motion
Product
Esso Extras website, app and campaigns
Timeline
2018–2022
Esso Extras end-of-year game on a laptop and a phone: a slot machine shaped like a fuel pump on a winter landscape
01

The program

Esso Extras is the loyalty program for drivers at Esso stations in the Netherlands. Members collect points with their Esso Extras card at the pump and spend them on gift cards, days out or a discount on fuel.

My work covered the member’s whole relationship with the program: the website and the app, emails and campaign sites, and the illustrations and animations that tied them together.

02

One account, kept safe

Points are worth money, so Esso wanted two-factor authentication to protect member accounts. I led the design of the feature from discovery to launch: researching user needs, mapping the flows, wireframing, prototyping, and usability testing the login and verification steps.

Every login now asks for a random six-digit code, sent by text message or a voice call to the member’s phone. I worked closely with product managers, developers and QA so the extra step fit Esso’s existing systems and stayed easy to get through.

Esso Extras 2FA workflow: registration with a card, registration without a card, and login, each step leading to two-factor setup
2FA workflow · registration with and without a card, and login
Detailed registration flow with 2FA: welcome, phone number, verification code, account, email confirmation, login, cards and account merge
Registration with 2FA · detailed screens and paths
Welcome screen with a choice to create an account or log in with an email
01 · Welcome
Keeping your points safe with your phone number
02 · Phone number
Six-digit verification code sent by SMS
03 · SMS code
Create your account with personal details
04 · Account
Email confirmed, with 100 Extras points to spend
05 · Welcome bonus
03

Cards and old accounts

Many members had more than one card, and some still had an account in the old system. In the app they link a plastic card or merge an old account in a few steps, and the points move with it to one balance.

My cards with a plastic card linked and an option to add another
01 · My cards
Merging an old account by entering the card number
02 · Merge an account
Home after merging, with the points moved to one account
03 · Merged
Password change protected with two-factor verification
04 · Two-step login
04

Website and app, one balance

The website introduces the program and sends people to the app. Inside, the balance comes first: points, recent transactions, and time-limited bonus offers with a countdown, so filling up again feels worth it.

Esso Extras website on a laptop and the app on a phone, inviting members to download the app
Two phones with the points balance, transactions and a bonus offer countdown
05

End-of-year games

Every year-end, Esso Extras ran a themed campaign site where members could win prizes and gifts. I designed and illustrated them as one winter world: snowy hills, cars on the road, a slot machine shaped like a fuel pump and a present to unwrap.

Desktop · slot machine
End-of-year campaign landing page with a slot machine, prizes, gift cards and questions
Mobile · gift
Mobile version of the campaign page with a gift to unwrap
Gift campaign · save 20 points and open your present
06

Spin the machine

Members spun the machine for a chance at €5 or €50 worth of Esso Extras points. These are my original animations, running live on this page. Give it a try.

Esso Extras Win Spel

Three of the same in the middle row wins.

Just for fun here: no real points.

Outcome

4
Years of releases, 2018–2022
3
Channels: web, app and email
4
Animated outcomes for the slot machine

A loyalty program members could play with, designed as one system across the website, the app, email and campaigns.

Next project

ARLO Submissions