Duela – Coffee Order-Ahead App

Helping busy coffee drinkers skip long lines with a fast, intuitive mobile ordering experience.

Role

UX/UI Designer

Project time

6 months

Platform

iOS

Tools

Figma, FigJam, Miro

Problem Framing & Validation

To ensure the solution addressed a real, high-frequency need, the problem, goal, and hypothesis were defined together to align user pain points with measurable outcomes.

To ensure the solution addressed a real, high-frequency need, the problem, goal, and hypothesis were defined together to align user pain points with measurable outcomes.

Problem Statement

Busy urban coffee customers often experience long wait times during peak hours, creating frustration and disrupting daily routines. Existing ordering experiences are either too slow or overly complex, making it difficult for users to order quickly and predict when their coffee will be ready.

Goal Statement

The goal of the Duela Coffee App is to provide a fast and predictable order-ahead experience that allows users to customize their coffee, schedule pickup times, and avoid waiting in line, especially during busy mornings.

Hypothesis

If users can place coffee orders ahead of time and receive clear pickup timing and status updates, then they will feel more confident, save time, and be more likely to return to the app for repeat orders.

The challenge

How might we design a coffee ordering experience that minimizes friction for repeat customers and fits seamlessly into their daily habits

Research & Discovery

Research focused on understanding repeat coffee-ordering behavior and identifying friction in existing order-ahead experiences.

Methods
  • Interviews with frequent coffee buyers
  • Competitive audit of leading coffee apps
  • Behavioral analysis of repeat ordering patterns
Key Insights
  • Speed and predictability matter more than browsing
  • Most orders are repetitive (same drink, time, location)
  • Unclear pickup timing increases morning stress
Key Insights

“I order the same coffee every morning – I don’t want to redo everything.” “If it takes more than a few taps, I will skip the app.”

Competitive Insight

To identify opportunities for Duela, we analyzed leading coffee and order-ahead apps currently used by urban customers. While most competitors offer ordering and rewards features, many experiences become complex or unclear during peak hours. These insights revealed an opportunity for Duela to prioritize speed, clarity, and pickup predictability.

User Goals & Pain Points

Synthesized from research insights to clarify user motivations and friction points.

Goals
  • Complete a repeat order in under a minute with minimal interaction
  • Avoid lines and unnecessary waiting during peak hours
  • Maintain consistency in daily routines without rethinking each order
Pain Points
  • Too many steps required to reorder during busy moments
  • Overemphasis on browsing and promotions instead of habitual actions
  • Unclear pickup timing, leading to uncertainty and stress

Solution Overview

The solution prioritizes repeat ordering by reducing decision-making and making pickup timing predictable.
Instead of encouraging browsing, the experience adapts to users’ daily habits and surfaces familiar actions first.

The solution focuses on

  • Fast reordering with minimal interaction

  • Scheduled and recurring pickups aligned with routines

  • Clear confirmation and pickup readiness at every step

User Persona & Empathy Map

A primary user persona was created to represent busy coffee customers who value speed, routine, and reliability. An empathy map helped capture what users think, feel, and do during the ordering process, highlighting emotional pain points such as time pressure and uncertainty during busy mornings.

User Persona
Empathy Map

Journey map

A journey map was used to visualize the end-to-end experience from discovering Duela to picking up an order. Mapping user actions and emotions helped identify moments of friction and opportunities to reduce stress.

Key UX Decisions

Fast Reorder First

The home screen prioritizes previous and recurring orders to reduce decision fatigue and enable faster reordering.

Recurring Orders Flow

Users can schedule orders for specific days and times, turning coffee ordering into a set-and-forget routine.

Minimal Checkout

Payment and confirmation steps are simplified to keep checkout under five clear, predictable steps.

Predictable Feedback

Clear order status, pickup timing, and confirmation reduce uncertainty and help users feel confident about their order.

User Flows

We designed user flows to define the core paths users take to complete an order efficiently. The flows focus on reducing unnecessary steps, clarifying decision points, and supporting quick reordering during peak hours while maintaining clear and realistic product logic.

Documenting flows separately helped maintain clarity while ensuring realistic product logic aligned with both user needs and business goals.

Home Setup
Login create account

Wireframes

We created low-fidelity wireframes to explore layout, hierarchy, and interaction patterns before visual design. This phase allowed for rapid iteration and early validation of the ordering flow, helping identify improvements before moving into high-fidelity UI.

Insights from wireframes informed improvements in navigation, checkout clarity, and pickup confirmation prior to high-fidelity UI design.

Key Wireframe Decisions

  • Starting an order from the home screen

  • Adding items without unnecessary navigation

  • Clear review and confirmation steps

UI Design

Final UI screens were annotated to highlight key design decisions related to hierarchy, interaction priorities, and usability. These annotations communicate the reasoning behind the design and demonstrate how user needs were translated into clear, efficient interfaces.

Final UI Screens Grid

Highlights: Visual design system · Layout structure · Interaction patterns · Flow consistency.

Annotated UI Screens

Highlights: UX reasoning · Design decisions · Usability considerations.

Prototype

An interactive prototype illustrating the core ordering flow, from browsing to payment completion. It demonstrates how users move through the experience efficiently with clear interactions and minimal friction.

Home → Add Item → Review → Payment → Confirmation

Interactive Prototype

The prototype validates that users can complete an order efficiently with minimal friction.

View Prototype
GIF showing the primary flow

Short walkthrough of the primary ordering flow from browsing to payment completion.

Usability Testing & Iteration

We conducted usability testing to evaluate clarity, flow, and confidence during ordering. Feedback helped identify small points of friction, which informed refinements to navigation, messaging, and action placement.

What Was Tested

  • Ability to start an order from the home screen without additional guidance

  • Ease of adding items and reviewing the order

  • Clarity of the payment step and primary action
What I Learned
  • Users expected to add items directly from the product list without opening details
  • Progress through checkout needed clearer confirmation at each step
  • Users preferred familiar payment options to be immediately visible
What Changed

  • Added quick-add actions directly on product cards

  • Improved checkout step indicators and confirmation messaging

  • Surfaced familiar payment methods earlier in the flow

Conclusion

This case study demonstrates how designing for habitual behavior can reduce friction in high-frequency, time-sensitive experiences. Rather than optimizing for discovery or feature depth, the solution prioritizes speed, predictability, and user confidence during peak moments.

Research insights and journey mapping revealed that uncertainty around pickup readiness caused more stress than ordering itself. This insight directly informed key UX decisions such as fast reordering, recurring pickups, and simplified checkout flows.

The final design shows how aligning product logic with real user routines can transform a daily task into a seamless, low-effort experience, while maintaining clarity and trust throughout the flow.

Key Design Principles

Based on research and competitive analysis, the following design principles guided the Duela experience:

  • Speed over feature depth: Prioritize fast ordering over extensive customization.

  • Predictability builds trust: Clearly communicate pickup timing and order status.

  • Reduce cognitive load:  Limit choices and surface only what’s essential at each step.

These principles helped ensure design decisions remained focused on user needs during peak usage moments.