Starbucks rewards
How to keep customer engagement and loyalty
Year
2019
Platform
2021
Project overview

Over the corse of 3 ship-a-thons the documenent expereince team at Coda worked to build dark mode to add more delighht to the product user expereince and also offer more fexailbil;ty to users surroundsings. This project was challeging considering the one week time contraint and css system.

My role

My role on the team included working closely with product and designers on thinking though the best experience for understanding and using the new rewards program. I also worked with the marketing team to understand the in-store experience and communication channels.

2 Designers
4 Engineerings
1 PM

Problem

Starbucks fails to bring in new reward members at scale.

Starbucks aims to offer a new way for mobile customers to get free stuff. Starting on April 16 2018, Starbucks Rewards loyalty program received a makeover, allowing members to earn Stars – aka rewards points – sooner, and use those points to buy more items than before.

Goal

Create a new rewards system to get more customers involved in the app, rewards and increase profit.

How the problem was identified

For Starbucks the rewards program:

  • Unlocks a digital flywheel for the business
  • Reinforces the value of the Starbucks card
  • Drives frequency
  • Provides customer data, recognizes and supports customer brand loyalty

Deliverables:

  1. Brand redesigned UI
  2. Point tracking UI
  3. Illustrations & icons
  4. Mobile animation
  5. US and UK market designs
  6. Design system

Understand

When I joined Starbucks the marketing team was in a period of re-branding as well as finding new ways to keep users engaged. To get an understanding of the project I quickly identified the key drivers influencing the success of the program.

  • Users
  • Baristas
  • Company brand
  • Business initiatives & concerns

The UX team collaborated with marketing to highlight user pain-points around the Starbucks rewards system. This opened an opportunity to explore new frameworks to benefit users and the business.

Original rewards program

In the original program, most users found the system confusing and unrewarding. Once a user downloads the app and uses it to buy Starbucks products you earn points. You have to earn 300 just to start playing and earning rewards. The first non earning level is green followed by gold at which you earn a reward every 125 points. If it sounds confusing, it is to most Starbucks customers. However, once on the Gold level we had a small subset of customers very engaged and the business found increases spending within this user segment.

Starbucks Reward users

Starbucks® Rewards Visa® Credit Card: Starbucks Coffee Company

Behaviors

  • Visits Starbucks 6 times a month
  • Usually buys an Expresso based drink
  • Visits before 11 Am
  • Most ordered a Flat white

Frustrations

  • Long lines
  • Incorrect orders
  • Late to work

Wants

  • Earn rewards faster
  • Early assess to products
"When O'm in a hurry, I just want to get in and out of line quickly. I'm not really paying attention to anything else. "

Whats next for Starbucks rewards

When the business and researchers looked into an alternative system they agreed users should be rewarded more frequently. Therefore the conversation shifted to an item based system. Less points would earn you less expensive menu items and more points would grant a more expensive items. Most customers buy the same menu item every visit so there could be a new mental model for earning towards that favorite drink.

The challenge was changing users mental model from earning any item at 125 stars to each item being worth a certain amount of stars. It was clear the design must clearly show how much customers favorite drinks were.

Starbucks baristas

Starbucks customers were not the only users we needed to consider. Any major changes to the Starbucks app needed to also be comprehensive to the baristas working behind the counter. The rewards system is a major part of the transaction process and we had to consider the payment management system UI.

Company Brand

While the design and research team was ramping up on a new rewards system, the company decided to undergo a rebrand. The goal was to unify the brand with one design and tone. Starbucks had a series of sub-brand and programs including rewards that had a brand within itself. We worked with the branding team to make sure we were in sync for how where executed our design system. The result of the branding effort was a new typeface, a new base Starbucks green and minimal use of black. This would force us to revisit our style guide.

Old state of Starbucks branding

Rebrand

Business

From a business perceptive, Starbucks was invested in growing the program to reach more people while finding more opportunities to save money as well.

Partnership with Chase

A key business partner in the rewards program in a Chase credit card. The card gives customers around 8,000 stars on sign up and a faster earn rate when purchasing through the card. We have to work in the marketing of the card as well as consider the experience when a user has such a considerable amount of stars.

Explore

We starting working with research to get a foundational understanding of how customers would understand and find value. We also worked with content strategists to build frameworks that were easy to understand. We all worked with research to do rapid iteration studies.

Program chart

50 stars

Brews hot coffee, bakery item or hot teas.

150 stars

Handcrafted drink, hot breakfast or parfait

200 stars

Lunch sandwich, protein box or salad.

400 stars

At home coffee.

The new system no longer includes a green level you have to work through. Any user of the app can start earning points. Levels start at 25 stars (spend $13) which gets you an extra shot of espresso in a drink. You earn 2 stars for every dollar you spend.

User research phase 1

The first round of testing was a 30 minute moderated interview on UserTesting.com with 12 participates. The participants were familiar with current reward system.

Research questions:

  • What are user's mental model in understanding multi tier reward tracking?  
  • What information do users want to see when tracking their stars/rewards?
  • Why do users stop using the Rewards program?
  • How doe users visualize multi reward tracking?

How do users visualize this system, what do they want to see?

User visualizing there points earned

"I think it would be like a progress bar with 3 points on it. A button you can click at 60 and show you what you can get from that.”

What are users mental modal in understanding this system?

When talking about the redemption, participants responded with currency sentiment such as:

"Do I have enough?”

“How much does stuff costs?”

“How am I going to spend them”

“How many do stars I have?”

Initial reactions on the breakdown of points

“When I check out, if I am like a certain number of points away, it could suggest to spend more, like, you will get X numbers of stars, you could be that much closer or reach the next level.”

Results

Most customers thought of the new rewards system like currency. They also had similar visual representations of how they framed all the categories.

Customers also started noticing the differences in cost. In the old program, customers would have to spend $62.50 to get a free drink or food item, to be worth roughly $5.50. Though strategic customers might get a more expensive item, that's about a 9% return.

With the new program, customers can get a brewed coffee or bakery item after spending $25, an 11% yield. But it's an objectively worse deal for handcrafted drinks and breakfast sandwiches: Under the new program, customers will need to spend $75 to get the roughly $6 item for free, an 8% return on investment.

Design explorations

Based on the first round of user testing we all began exploring different design frameworks and visual representations to test again. We worked with content to explore calls to action.  "Redeem" was the conclusive CTA to drive spending reward points as opposed to the original "Rewards". This was a decision made from the new currency mental model.

Series of wireframing tested in phase 2

Testing phase 2

Goal for round 2 was to gauge how well the early thinking around designs for tracking rewards resonated.

Research goals:

• help customers understand multi-tier redemption

• enable customers to track their progress
• match mental models and preferences for tracking

This was an in person interview. Participants were not informed beforehand about any of the changes to the program.

Synthesis

  1. Everyone understood there were multiple tiers of rewards, but some confusion about how tiers differed
  2. Customers view their stars as a currency and want to easily see all the ways they can spend their stars
  3. None of the variants matched mental models perfectly; some aspects worked and some caused confusion
  4. Having separate redemption buttons for each tier may cause some confusion about how to redeem in-store
“I have stars to spend, instead of a reward or two rewards.”
  • Many had difficulty understanding what they could get and the differences between the tiers
  • Many first assumed reward options were limited to the lists of items shown
  • Some expected to use the menu to learn the cost
  • Difficulty forming a mental model of the tiers, especially for food and drinks
  • What does Starbucks consider “Bakery”? Does “coffee” include espresso?
  • Many customers do not distinguish between“coffee” and “espresso” (prior menu IA research)

Design considerations

After iterative testing we made note of how to move forward with design.

  • Refrain from showing products directly alongside tier descriptions
  • Help people form accurate mental models of the differences between the tiers, perhaps by easier access to longer descriptions
  • Conduct additional research on the language we use to describe the tiers in the app to make sure it’s broadly understandable
  • If possible, allow people to verify an item’s cost in stars in the menu

Design

Based on user insights we moved with a horizontal tracker with all the major categories as milestones. It allows customers to see the changes in the program at first glance. It also enforces a sense of gameplay and excitement. Once you reach a tier each milestone is filled gold. Once a user reaches 400 the entire bar fills with stars a major celebratory moment..

I worked with 2 other awesome designers.

All reward states

Key moments

Reward categories

Once a user has a reward there are various opportunities to discover what is available. Some users will look up the individual item they usually get and remember what level they need to acquire to get it. Others will tap "reward options" to get a basic understanding. All menu items have the star level associated with it.

How it works

Some rewards programs are pretty ambiguous but it was important Starbucks a more simple approach to increase engagement. 2 stars for every dollar you spend via the app. Each menu item has the stars needed to reinforce the new mental modal of rewards as currency.

Motion

Animation plays a big role in reaching each tier. We wanted to celebrate moments to make rewards more delightful.

Celebrate reward achievements and make earning stars more engaging and personalized

UK Market

I acted as lead of the UK market. The rewards system remained the same as the original system because it works best for that currency, however still required a redesign.

User reaches reward at 15 purchases

Learnings

Product learnings

From a product standpoint we increased mobile sales greatly. In comparison to other major mobile payments Starbucks stands out as a front runner.

The program makes up about 40 percent of the company's transactions in the U.S. and it has grown 26 percent in the last two years.

2.1 million active users

The popularity of the rewards program has helped boost the chain's mobile sales, which now account for about 6 million orders a month.

User reviews

Longtime loyal customers of the brand and Gold members aren't exactly thrilled, as they bought a lot of coffee to earn rewards points that are now irrelevant. For those starting to use Rewards now, it's fantastic!

Overall customers understood the new system and found the designs easy to use and fun, new users appreciated earning stars faster.

Existing users saw the program less rewarding, mainly due to the point shift for hot coffee. The star points went from 125 to 150 for hot coffee. Considering most users order the same drink every time, they now face having to earn 25 stars to get their favorite drink.

Reviews in the app store are mixed

Experience recommendations

There is an opportunity to bring more customer value as the program evolves. This will open up even more new users while given loyal customers a reason to stick around.

  • Extend star expiration from 6 months to a year
  • More ways to earn stars ( not just app users) : Allow users to scan their receipt via the app to gain stars from cash purchases.
  • In addition, make it easier to pay by opening up payment methods to debit cards, apple pay and cash.