Kohi is a fictional coffee shop with numerous branches in Los Angeles. Kohi's target users are people who regularly get coffee between the ages of 20-45.


Project Overview

P R O B L E M

Busy consumers need a more efficient way to pick up their morning coffee.

G O A L

Design an app for Kohi that allows users to order their coffee ahead by allowing users to set a pick up time and location.

R O L E

UX Designer designing an app for Kohi from conception to delivery.

R E S P O N S I B I L I T I E S

Conducting user interviews, paper and digital wireframing, low-fidelity and high-fidelity prototyping, conducting usability studies, and iterating on designs.



Understanding the User

U S E R R E S E A R C H

Summary: Conducted interviews and created user journey maps to understand the users I'm designing for and their needs. A primary user group identified through research was working adults who want a more efficient way to get their morning coffee.

P A I N P O I N T S


Time

Busy consumers want to be able to map out their route where to get their coffee and at what time.


Location

Most coffee shops don't allow users to select a pickup time at a different pickup location.


Customization

Most consumers also want the option to customize their drinks when they want to.

P E R S O N A

Ryan is a busy working father who needs a more efficient way to get his orders before going to work, with minimal waiting time because he wants to maximize his time with his kids and have a coffee ready for work.


U S E R J O U R N E Y M A P

Mapping Ryan's user journey revealed how helpful it would be for users to be able to order coffee in advance from the app.




Starting the Design

P A P E R W I R E F R A M E S

Each screen of the app was drafted on paper. It was iterated numerous times to see which combination or layout would make the most sense for users that solve pain points.


D I G I T A L W I R E F R A M E S

Location & Time Input: Making it easy for users to change their preferred pickup time and location was important so we gave users the option to do so on screens that relate to the ordering process.


Order Customization: One of the other user needs was for them to be able to customize their orders. We made sure that the process was simple to use



L O W - F I D E L I T Y P R O T O T Y P E

The low-fidelity prototype shows the primary user flow of ordering through the app.

View Low-Fidelity Prototype

U S A B I L I T Y S T U D Y

I conducted two rounds of usability studies. Findings from the first study helped guide the designs from wireframes to mockups. The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.

Round 1 Findings

  1. Users are confused by the location change screen

  2. Some users are confused by the confirm order buttons on the checkout process

  3. Need better cues for order customization process


Round 2 Findings

  1. Users want to the option to input location in the location change screen

  2. Some users though the app looked blocky


Refining the Design

H I G H - F I D E L I T Y M O C K U P S

Location Input: Early designs allowed users to change their location through the map, however, it’s not as useful to other users. I revised the screen to allow the user to choose from a list view, or click on the search icon to input a location.


Simplifying Drink Customization: The first drink customization design had the options on the same page as the product info. It was too much for most users who don’t even customize their orders, so I added a new screen to make it easier for users to skip the drink customization.

H I G H - F I D E L I T Y P R O T O T Y P E

High fidelity app implemented changes from the usability study. It’s easier to customize a drink, select a location, and the checkout process is easier to understand.

View High-Fidelity Prototype



Going Forward

T A K E A W A Y S

Using common design patterns are helpful for users when navigating through an app (Ex. Breadcrumbs, Bottom Navigation, Tabs). However, I need to keep in mind that while most times these design patterns would work, I need to always make sure that they make sense for the user and task at hand. Sometimes, I do have to reinvent the wheel.

It’s important to iterate designs based on competitive research, usability studies, and user feedback. Each research activity gives you new insight on the user needs.

N E X T S T E P S


Usability Studies

Conduct another usability study to validate if the pain points have been addressed properly.



More Research

Conduct more research to determine if there are any more features to that users need.

Email me at margavancena@gmail.com / Connect on LinkedIn

Margaret Avancena. Made with ❤️ on Google Sites!