Starbucks Spec

Project

Online Ordering Made Easier

Summary

Starbucks order ahead users needed a way to streamline the ordering process and to edit their orders, in case they made a mistake. We created several solutions to address these issues, working within the strict style guidelines set by the multinational chain. We received validation from user testing, and from Starbucks itself. 

Team

Research Lead

Project Manager

Graphics Lead

Tools

Sketch

inVision

Google Forms

Paper & Pen

Duration

2 Weeks

My Role: User Research Lead

I spearheaded our User Research efforts, which included creating our generative research plan, conducting user interviews, overseeing data synthesis, and creating our primary proto-persona

I also contributed to our team's efforts by designing and iterating on user interface elements, functional prototypes, and usability testing.

 

Research

Phase 1: Finding Our Users

The first step toward understanding users' needs is finding out who our users are. To do this, I created a simple screener survey that we sent out to our networks using Google Forms. In the screener, we asked two key questions:

When was the last time you placed an order on the Starbucks mobile app?

When was the last time you placed an order on the Starbucks mobile app?

What does it mean?

Our users typically purchase from Starbucks quite frequently, and do not have a strong preference for using the app or ordering in-store. 

Research

Phase 2: Interviews & Synthesis

Before diving into interviews, we wanted to gather what information we could about the app. We ran a Competitive Analysis between Starbucks and several large chain stores and coffee companies with mobile ordering apps. While many of the features were similar across the competitors, I wanted to highlight the chart below, which compares the companies by number of downloads and star rating in the Google Play Store.

App Downloads (Google Play Store)

Star Rating (Google Play Store)

What does it mean?

The Starbucks app is arguably the most popular, well liked chain restaurant app based on our findings.

How do we find a problem for something that is already working so well for so many people? 

 

We got to know our users better. I wrote a detailed Generative Research Plan, which included an interview script.

Interview Topics & Activities

  • Thoughts & feelings about Starbucks and the mobile app

  • Ordering & pickup routines

  • Favorite features & pain points of the app

  • Contextual Inquiry - The steps users took to actually place an order

We wanted to know as much as we could about the Starbucks experience, so we interviewed customers as well as baristas who make the in-store experience happen. Here's how the interviews broke down:

9 App Users

2 Baristas

After conducting our interviews, I facilitated an Affinity Mapping session with my teammates to synthesize our findings. Here are the three key takeaways from our interviews:

Overall, participants had positive feelings about Starbucks as a company, and the mobile app. They highlighted excellent customer service, employing veterans in record numbers, and their we'll make it right policy.

7 of 11 participants said that they typically order the same thing every time they go to Starbucks. They wished that there would be an easier way to order their usual in the app.

The biggest pain point for users was that they would accidentally place an order, and it would be sent to the wrong location. 9 of the 11 reported this problem, and wished there were a way to change the order once it's been sent to the store.

Based on the synthesis of our interviews, I created the following proto-persona to help humanize our findings. We are, after all, practicing human-centered design. Meet The Grab-and-Go Getter.

Proto-Persona

Our Problem

Starbucks order ahead customers need a way to efficiently purchase their usual order and edit their order after submitting because of common errors that occur with store location and order mistakes.

Our Solutions

We address our users' pain points by creating an order usual button on the home screen for a more streamlined ordering process. To prevent errors, we add an edit order button to the confirmation screen that allows users to change the location or adjust the items in their order.

 

Ideation

Streamlining the Ordering Process

This is the User Flow for the ordering process on the Starbucks app in its current state.

Home Screen

With our solution, a user would be able to tap one button on the Home Screen to select their order, and be brought to Store Location screen, bypassing the menu. The question is, where does it go, and how do we make it look like it belongs in the app?

We noticed in the current version of the app, there was a lot of white space in the top third of the Home Screen. We thought this would be the perfect place for an important call to action.

Each team member had different ideas as to exactly what it should look like. In a version of a Design Studio, my teammates and I each drew up our own versions of the buttons in Sketch, and tested our ideas with users. 

We each mocked up our ideas and presented them to several users and designers, and decided to iterate on the first of the three options.

 

Based on our User Research, we decided that users should pick their own Usual from the favorites menu, rather than creating a pre-populated option.

 

Here's how the flow would work:

  1. The User is prompted with an Onboarding Message after an update about the new Order Usual Button.

  2. The User selects an item to add as their Usual and confirms.

  3. The User is given the option to add that item to their cart directly from the confirmation, or to return home.

  4. The Order Usual button on the home screen is now filled with the Starbucks' Green color, to indicate that an item has been selected.

  5. If the User wants to change their Usual, they can go to their Favorites or Recent Orders list and select a new Usual item. 

We Iterated on just about every aspect of the design, using feedback from testers to inform our decisions. See below for the development of the Order Usual Button and the  Onboarding Message from the first screen of the above demo.

Ideation

The Million Dollar Button

"My least favorite thing is that it defaults to the location I always go to. I was at home and I ordered...I didn't look at it, and it came to [the location near my office], not my house one."

Our Proto-Persona is a busy person. Busy people don't always pay attention to what they're doing, especially if it's part of their routine. Our users would sometimes make mistakes in their order, and the Starbucks app had no way to fix those. We decided that that ought to change. Our solution? Allow the user a bit of time to realize they made a mistake, and edit their order.

The Big Question:

How do we make the solution call attention to itself, indicate a countdown, and still work within a flow that users have done hundreds of times?

Our Solution:

The dissolving Edit Button

The dissolving Edit button gives users a 30 second window to see their mistake, and make a change. Several considerations went into the creation of this button, and we spoke to users all along the way:

  • Timing: How long is long enough to realize your mistake, but not too long to feel like your order is being delayed?

    • After surveying several users and speaking with our baristas, we decided on a 30 second grace period.​

  • Display: We don't want to stray too far from Starbucks' strict style guidelines. Our users also expressed concern about a countdown having negative connotations or causing anxiety. One user went so far as to call it a Doomsday Clock.​

Let's see it in action.

Scenario: You're going to a meeting in Harvard Square. You place an order for your favorite drink, but realize that you accidentally sent it to the location near your office (hey, you haven't had your tea yet. I get it).

 

Validation

Sweet, Sweet Validation

Our Version

Starbucks Test

We learned after our presentation that Starbucks began testing a "Your Usuals" feature on the home screen of their app the day we presented our project. Looks like we might be on to something here. 

I'd love for you to check out more of my work.

Let's Connect!

dylanjuscher [at] gmail [dot] com