Dutch Bros. Case Study

Adding mobile ordering to Dutch Bros app.

The pandemic pushed contactless pickup to the forefront of options for rushed coffee drinkers, and long lines often deter Dutch Bros customers. I explored how we might add a mobile ordering offer to Dutch Bros. existing app.

Role

This project was for a User Experience Certification course in which I was the sole UX and UI designer.

Timeframe

Completed during an 11 week UX course.

Tools

Figma, Zoom, Google Slides, Miro, Adobe InDesign and Illustrator.

Define the Challenge

While customers can be fanatical about Dutch Bros. coffee, they hate waiting in long lines. That coupled with contactless trends driven by the pandemic has led users to prefer mobile ordering and contactless pickup options. Adding mobile ordering to Dutch Bro’s existing app would better serve customers and help business thrive.

Empathize through research

 

In-depth Interviews

Interviews were conducted based off of an interview guide with five Dutch Bros customers. Results were compiled in an affinity map to produce insights.

5/5

Users don’t have time to wait for coffee

Have chosen a competitor’s coffee shop because the line at Dutch Bros was too long.

4/5

Users prefer mobile ordering

Said they’ve used mobile ordering to purchase coffee from competing coffee shops.

4/5

Users want to schedule their pickup and know when their coffee will be ready

Want to be able to schedule a preferred time to pick up their coffee.

I like their coffee and it’s a good atmosphere, but I’ve driven by Dutch Bros many times because the line was too long.”

— Kevin / 35 / Phoenix, AZ

Personas

An image of a man depicting Dutch Bro's customer persona Henry Hurried.

Henry Hurried, 33

Goals:

  • Wants to quickly pick up coffee for himself and his girlfriend on his lunch break

  • Wants to prepay and have his favorite drink and location saved

  • Likes to use the drive thru to pick up coffee

Pain points:

  • Hates long line at Dutch Bros

  • Doesn’t like a long, laborious process for mobile ordering coffee

 
An image of a woman depicting Dutch Bro's customer persona Ava Efficient.

Ava Efficient, 27

Goals:

  • Wants to treat herself to coffee on her way to run weekend errands with her husband

  • Wants to exclusively use mobile ordering to save time

Pain points:

  • Hates not knowing when her mobile order is ready

  • Is intimidated by Dutch Bros because its always so busy

  • Doesn’t like when she can’t modify her order

Competitive Analysis

A mockup of the Starbucks app.

Drive thru or walk up option for mobile order pickup

Curbside pickup

Customize orders

Favorite stores

Favorite drinks

Schedule pickup in advance

A mockup of the Dunkin' Donuts app.

Drive thru or walk up option for mobile order pickup

Curbside pickup

Customize orders

Favorite stores

Favorite drinks

X Schedule pickup in advance

A mockup of the Peet's Coffee app.

Drive thru or walk up option for mobile order pickup

X Curbside pickup

Customize orders

Favorite stores

Favorite drinks

X Schedule pickup in advance

 

Ideate Strategy & Solutions

How might we improve the ordering experience at Dutch Bros. for rushed coffee drinkers?

Offer mobile ordering

Users don’t want to wait for coffee and feel the lines at Dutch Bros. are too long. We might help users skip the line and speed up their ordering and checkout process by offering mobile ordering.

 

Allow for easy customization

In-depth interviews showed users require the ability to customize their drinks. Including this option is a minimum table stake for mobile ordering coffee.

Provide saved favorites

Customers don’t want to re-enter their information and often order the same drinks. Providing saved favorites drinks and locations might help speed up their checkout process.

 

Offer contactless pickup

Contactless pickup grew in popularity during the pandemic. Offering this option might appeal to hurried customers who faster service and don’t mind forgoing human interaction.

User Flow

Based off of the personas, in-depth interviews, and competitive analysis, I built a user flow incorporating mobile ordering with saved favorites, customizable drinks, and contactless pickup options in as few clicks as possible.

An infographic of the user flow a customer might take to order coffee through the Dutch Bro's app.

Prototype, testing and iterations

Mockups of sketches, wireframes, and high fidelity screens for mobile ordering through the Dutch Bros app.
Mockups of sketches, wireframes, and high fidelity screens for mobile ordering through the Dutch Bros app.
 

Mobile Ordering

I began by sketching screens based off of the user flow, then created wireframes in Figma. In early testing, users did not use the coffee cup icon in the upper right corner to start their order.

Iteration: The coffee cup icon was removed and an “Order now” button was added to the home page and in the bottom navigation. In later user testing, the majority of users used the bottom navigation to begin their order.

Iteration: Testing found that users wanted to choose the time their order would be ready before committing to an order. Therefore the estimated pickup time was moved to the top of the home page, so it can be seen and adjusted earlier in the ordering process.

Mockups of sketches, wireframes, and high fidelity screens for saved favorites through the Dutch Bros app.
 

Saved Favorites

Users in multiple rounds of testing responded well to the location of the favorites page within the user flow. However, this process adds time, and a few screens, to their ordering process.

Iteration: An option to go directly to favorites was added to the bottom navigation. This allowed users to skip a few screens in their checkout process. 2 out of 3 users tested used the “faves” icon in the bottom navigation instead of navigating through the ordering process to the favorites page.

What would be next: Testing of 2 more users to see if the majority are using the favorites icon over the previous favorites navigation option.

Mockups of sketches, wireframes, and high fidelity screens for customizable drinks through the Dutch Bros app.
Mockups of high fidelity screens for customizable drinks through the Dutch Bros app.
 

Customizable Drinks

I began with a drink customization flow in which users could choose the type of customization in a dropdown and the amount of that customization in a right slider, much like Chipotle’s mobile ordering interactions.

User testing found the users were overwhelmed with having all their customizing options vertically on one screen and did not understand the 3-dot slider for drink customization.

Iteration: To solve for this, I divided the customization into multiple simple screens which users enjoyed more and navigated through more quickly in the next round of user testing.

Mockups of sketches, wireframes, and high fidelity screens for contactless pickup through the Dutch Bros app.
 

Contactless Pickup

Users from early rounds of testing through high fidelity prototype testing understood the pickup options offered. I iterated after wireframing to change “pickup window” to “walk up window” to make an unfamilair process clearer for customers.

What would be next: If I were further iterating, I’d like to see if offering the pickup options earlier on the ordering process might be better for users.

Final Prototype

 
 
Next
Next

Case Study: Amazon Prime Video