Product 02Coffee Co.Case study

Coffee Co.

A mobile ordering experience for commuters who need coffee pickup or delivery to fit into the workday, not interrupt it.

Coffee Co. mobile app hero screen showing drinks, popular items, and cart access
RoleProduct Designer — Research, interaction design, prototyping and visual design
DeliverablesUser Experience & Interface
PlatformMobile coffee ordering app
FocusPickup, delivery, editing
Research and design completed in under 2 weeks. Current status: work in progress.

01 / Understanding the problem

Daily Coffeeshould notBreakthe commute

Daily commuters sometimes lack the time, energy, or route flexibility to stop for coffee before or during the workday.

Illustrated route map with location pins
?

How might we make ordering coffee for pickup or delivery more seamless for daily commuters?

The proposed solution is a coffee application that lets commuters order, edit, pick up, or deliver coffee drinks from nearby cafes without adding unnecessary friction to their route.

Usability study · Little Rock, Arkansas

Four local coffee drinkers tested the ordering flow.

I interviewed four coffee drinkers from my office in Little Rock, Arkansas, a mid-sized city. Participants ranged from 18 to 65 years old, aligning with the broader target audience. Each participant tested the product before taking part in a follow-up usability interview.

participants4 age range18-65 tested flow1

Short interviews

What coffee routines already look like.

These composite responses summarize recurring interview themes rather than representing verbatim participant quotes.

01

How many times a week do you get coffee away from home?

“Usually three or four times. If I have an early meeting, it is almost automatic.”
“Once or twice, mostly when I did not have time to make it at home.”
02

Which coffee shops do you choose?

“Starbucks is predictable because the app remembers my order.”
“Casey's gas station is on my route. I choose Mylo Coffee Co. or Nexus Coffee Roasters when I have more time.”
03

What apps do you currently use?

“Mostly the Starbucks app. For local shops, I check Google Maps or order at the counter.”
“I use DoorDash occasionally, but the delivery fees make me hesitate.”
04

Would you prefer delivery or pickup along your route?

“Pickup if I am already driving; delivery if I am stuck in meetings.”
“Show me which option adds the least time to my commute.”
05

Would a community of coffee drinkers be useful?

“I do not need another social feed, but I would like to see what people nearby actually order.”
“Local favorites would help me try something beyond my usual drink.”

Market opportunity

The whitespace is not another single-shop app.

Chain apps already make repeat ordering convenient, but they keep discovery inside one brand. Delivery marketplaces provide more choice, yet fees and restaurant-first browsing can make a simple coffee run feel heavy. Coffee Co. can occupy the middle by helping commuters compare nearby shops and learn from community ordering patterns.

Shop-agnostic Route-aware Community-informed

02 / Product direction

Make the order feel already on the way 📍

Coffee Co. centers the experience around nearby cafes, quick edits, familiar drink discovery, and simple pickup or delivery choices.

Nearby cafe ordering

Help commuters find coffee options close enough to fit their existing route.

✏️

Editable drinks

Support quick changes before checkout so the order stays flexible.

Popular choices

Use community-loved drinks to reduce decision fatigue during busy mornings.

👁

Recently viewed

Bring back drinks that caught the user's eye for easier repeat exploration.

03 / Design process

From human context to polished mobile flows.

The process moved from persona and journey mapping into information architecture, storyboards, low-fidelity wireframes, prototype mapping, high-fidelity refinements, and reusable components.

Coffee Co. project overview showing product description and project duration
01 / Project overview

Product description and duration

This overview slide lists the Coffee Co. product description and project timeline before the case study moves into the problem, process, and final interface.

Coffee Co. overview continued showing the problem and app goal
02 / Problem and goal

Problem and app goal

This slide defines the commuter problem and the goal of the Coffee Co. app: helping users order, edit, pick up, or deliver coffee from nearby cafes with less route friction.

Storyboard sketches for Coffee Co. pickup and delivery discovery
03 / Storyboard

Delivery scenario

Early storyboard panels explored the commuter's motivation: avoiding a re-route, finding a nearby coffee option, ordering, and receiving coffee with less interruption.

Storyboard sketches for Coffee Co. ordering, checkout, and delivery confirmation
04 / Storyboard

Ordering path

The second storyboard mapped the main flow from opening the app to setting location, choosing a drink, checking out, and receiving an order notification.

Low fidelity Coffee Co. mobile wireframes
05 / Wireframes

Lo-fi structure

Low-fidelity mobile screens defined the core product path: menu discovery, drink details, cart, checkout, and order confirmation.

Coffee Co. prototype flow map connecting low fidelity wireframes
06 / Prototype flow

Connecting the ordering journey

The prototype map connected each screen state so the flow could be tested from discovery through checkout and return paths.

Coffee Co. high-fidelity mockups showing menu, product details, checkout, and confirmation screens
07 / High fidelity

Core screen mockups

The high-fidelity pass defined the main mobile flow across menu discovery, drink details, checkout, and order confirmation.

Coffee Co. before-and-after usability update showing add-to-cart symbols and cart counter
08 / Design changes

Add-to-cart feedback

After usability testing, plus symbols were added to product cards and a cart counter was added so users had clearer feedback while ordering.

Coffee Co. before-and-after usability update showing cart screen redesigned as checkout
09 / Design changes

Checkout redesign

The cart screen was reframed as a checkout page with payment, delivery address, delivery timing, and order totals visible before finishing the order.

04 / Design system

A sticker sheet for consistent mobile UI.

The reusable system captured cards, icons, badges, buttons, loaders, typography, and color choices so new Coffee Co. screens could stay visually aligned.

Coffee Co. sticker sheet with reusable cards, icons, buttons, typography, colors, and loaders

Reusable components. A scalable design system.

The sticker sheet gives the product a stronger foundation for future screens and iteration by making repeated interface patterns easier to reuse consistently.

05 / Final screens

Coffee ordering designed to fit the commute.

Busy people can order, edit, and choose pickup or delivery from nearby cafes without disrupting their route or workday.

Coffee Co. prototype showing the mobile drink ordering flow
Prototype preview showing the Coffee Co. mobile ordering experience in motion.

06 / Possible impact

Small ordering moments can create a calmer morning.

Coffee Co. is positioned to reduce route uncertainty, speed up repeat ordering, and make local cafe discovery feel useful during a commuter's tight schedule.

07 / Reflection

Usability studies helped challenge designer bias.

What I learned

Initial designs are not always the best solution. Testing with coffee drinkers helped surface useful insights and reinforced the value of usability studies, market research, and continued product iteration.

Back to the beginning