Project

Sandwich Shop App
Google UX Project

Role

Interviewing
Ideating
Wireframing
Prototyping
Usability Testing
Iterating

Tools

Pen + Paper
Figma
Jamboard

Duration

June – September, 2022

Challenge

Busy professionals don’t have the time to cook healthy meals and need a simple and efficient way of buying it since not all apps provide order progress.

Solution

The Sandwich Shop app will present the menu in a visually easy to read manner and include a live progress bar. 

Research

Summary

I conducted interviews and created empathy maps. One of the primary user groups identified were professionals who are busy with work and don’t have time to cook meals.

Further research revealed that extracurricular activities and family obligations also affected their ability to cook healthy meals at home.

Pain Points

Time

Professionals are too busy to cook healthy meals

Efficiency

Apps don’t always provide live order progress

Use

 Menus can sometimes be too cluttered and hard to read

Persona

Jesse, 27
Single
Bank Professional

Jesse is a young professional who is busy with work and extracurricular activities. She’s single and lives with 2 roomates. She often buys dinner for everyone on her way home but she’s too busy to call so she prefers apps. She likes being suggested meals.

Goals

  • Spend energy on activities and time withs friends
  • Eat healthy

Frustrations

  • Not easy to find healthy food with positive ordering experiences

User Journey Map

It was evident after mapping Jesse’s user journey that having an live order status is very important to improve the user experience.

Design Process

Paper Wireframes

I sketched out multiple versions of each page and then extracted the best version of each to create the main process flow.

Digital Wireframes

Low-Fidelity Prototype

Usability Study Findings

Round 1 Findings

  • Users want to order sandwiches quickly

  • Users want to track order progress

  • Users want customization options

Round 2 Findings

  • The create account option was hard to find

  • The checkout process was unclear

Mockups

The logical next step was unclear on the summary page. I removed buttons and made the summary page a full screen overlay to keep the bag separate from other sections.

In the initial design users weren’t sure on how to get to the account page so I added an account icon and text to the footer row. 

Final Design

Final high fidelity prototype presented a clear flow with more logical options that improved how the user navigated the app.

Sandwich Shop Protoype

1. Used images for sandwich toppings to allow users to more easily identify

2. Used color contrast that meets accessibility requirements for improved readability

3. Used icons to allow users to find various sections of the app more readily

Outcomes

Impact

The app achieved its goal to help users order quality sandwiches with little friction. The order progress bar helped busy professionals anticipate their pickup time to make the best use of their time. 

What I learned:

I learned that some of my assumptions were wrong which is why it’s important to run usability studies. 

 

Next Steps

1. Conduct another usability study to determine if the previous challenges have been addressed.

2. Conduct more research to determine if there are any more opportunities to improve the app.