Blue Bottle

A case study in service design and remote collaboration

The Ask

Our team was tasked with identifying a customer pain point at a café chain of our choosing and given five weeks to produce a service design solution with a user-tested prototype. This was a class project in the UCLA Extension User Experience program.

Project: Identify an unmet pain point at a café chain and develop a service design solution.
Roles: Project management, UX design, user research 
Skills: Participant observation, wire framing, prototyping, project management, usability testing, remote collaboration
Tools: Sketch, Adobe XD, Miro
Outcome: Interactive prototype and service designer intervention proposal

Our Process

Our team was comprised of four members scattered across the Los Angeles metro area who were only able to meet in person three times over the five-week project. As a result, our work was largely remote and reliant on conference calls and cloud based collaboration tools. We selected Blue Bottle Coffee for the challenge of finding a service design problem at such a well-designed café chain and developing a solution that would seamlessly fit with the brand.

Problem Identification and Preliminary Research

To make sure we identified a pain point that was not unique to one specific location but constant across all locations, team members embraced our geographic separation and conducted observational research at five Blue Bottle locations in the LA metro area. We loosely planned the contextual research around Mark Baskinger and Bruce Hanington’s AEIOU framework, which focuses researcher attention on five elements: activities, environments, interactions, objects, and users.  

Photos, sketches and notes were taken at multiple locations to get a fuller grasp of constants and variants in brand presentation.

Using a cloud based whiteboard, the team compiled a current state service blueprint informed by our contextual research including our first-person experiences as customers.  Each team member reported feeling discomfort during the coffee ordering process. In creating the service blueprint we were able to organized the various pain points in the ordering process and identify a unifying theme: order anxiety felt by people without specialized coffee knowledge.

Intervention

Subsequently, we held an ideation session that allowed us to narrow our focus on a single, targeted pain point—reading and understanding the menu from a distance—and to come to consensus on a preliminary solution proposal: informational tablets built into minimally sized kiosks.

The pain point we identified pointed to a particular problem posed by Blue Bottle’s business model: increasing in-store sales without sacrificing the brand’s refined aesthetic. We decided to focus on making Blue Bottle cafés more welcoming to people who are attracted by the brand’s alluring pairing of trendy and refined coffee service and minimalistic styling but have low emotional tolerance for being inadequately informed when making seemingly innocuous consumer decisions. 

We debated the question of whether the kiosks should be given ordering functionality. This would allow customers to put in their order directly at the kiosks and would also open up a door to mobile ordering. While this would add a potentially valuable monetization factor to the intervention, we decided to start with an informational-only tool, pending research on the effects digital ordering would have on the bespoke café experience. With such e-commence and remote ordering functionality in mind, we designed our solution as an in-store beta version of a more robust mobile app. 

Prototype

Our team set about designing our prototype with an iterative state of mind. We worked quickly to give ourselves time to get stakeholder input and conduct user testing before the project concluded. 

In our first prototype we used illustrations that reflected the aesthetic of the Blue Bottle ice to visualize the components of coffee drinks. We placed these in a side-scrolling carousel to mimic the experience of casual browsing.

In the second prototype we worked to make the main menu more informative by clarifying terms and adding options. We polished the design by adding photography tucking the illustrations behind them as a sort of Easter egg that would appear while pressed. We expanded the products to include the full range of Blue Bottle’s product line.

We conducted a series of usability tests with the revised prototype. Each team member was responsible for running three tests after which we analyzed our results by doing a virtual affinity mapping session. Facing a time crunch, this allowed us to identify crucial revisions and prioritize them based on the ratio of their impact value to their time cost.