Improving the Website of a $1.28 Billion Revenue Coffee Chain

Skills

UI/UX Design

Collaboration

User Research

User Personas

Usability Testing

Team

5 UX Students

Tools

Adobe Illustrator

Adobe XD

Year

2023

Background

Dutch Bros is a coffee chain founded in 1992 by two brothers Dane and Travis Boersma. The coffee chain offers a variety of options such as coffee, energy drinks, sodas, snacks, and more. Dutch Bros has become popular because of its culture and drive-thru only option. However, their website had a few issues and needed a revamp.

Problem

Users found that the website was not intuitive and easy to use. The information architecture led to confusion and the visual design was overwhelming due to clutter. This made it difficult for the users to achieve their tasks quickly.

Process

Collaboration

I was assigned to a group of 5 other students to collaborate and find ways to improve the usability of the Dutch Bros website.

Usability Testing Materials

We conducted surveys, questionnaires, tasks and scenarios for our participants, observation sheets, and 2 sets of user personas.

Task(s) For Participants

  • Find “Contact Us” link

  • Access contact information

  • Find a link to the menu on the homepage to see what featured drinks are offered

  • Find a link to place a pickup order online

  • Find the nearest Dutch Bros location

  • Access additional store details

User Insights

I discovered that the participant was not able to find links quickly or at all causing frustration. Most of the time on task took 6-13 seconds while one took 30 seconds, leading to a fail completion. This result led me to focus on optimizing the navigation menu and visual hierarchy.

User Personas

Design

Based on our insights, each student from the group was responsible for re-designing the Dutch Bros website independently. My design approach was to focus on simplicity and efficiency while still making the website visually appealing.

Results

I enhanced 4 inside pages of the website: Home, Full Menu, Product, and Contact Us Pages. I constructed these pages by creating a more intuitive navigation, integrating new colors in the branding, moving and adding new elements (hover toggles, contact form, filter dropdown, links) to create a smoother experience for users.

Final Design