Case Study:

Gourmet Sandwich Shop Ordering App


Project Overview

The Problem

Busy users don’t have a lot of time to order and wait for their food to be delivered.

The Goal

Create an app that helps users order their food in just a few steps.

The Product

Porco Rosso is a Gourmet Sandwich Shop located in a major city. Porco Rosso strives to deliver high quality sandwiches and beverages. They target customers like college students and workers with busy schedules.

My Role

UX designer designing an app for Proco Rosso from conception to delivery.


Conducting interviews, papers and digital wire framing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.

Project duration

October, 2021 to November, 2021

Understanding the user

I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. Primary user group identified through research was students and working adults who don’t have much time for lunch.

This user groups confirmed initial assumptions about Porco Rosso customers, but research also relvealed that time was not the only factor limiting users. Other user problems included obligations, interests, or challenges that make it difficult to go tu restaurant in-person.

User pain points


Students and working adults are too busy to commute to a restaurant or prepare a meal.


Some apps take too many steps in the process of ordering food


Users need a precise tracking system for their delivery

Persona & problem statement

Annie is a busy Project Manager who needs an easy and quick option for ordering high quality food because she has short lunch breaks.


User journey map

Mapping Annie’s user journey revealed how helpful it would be for users to have access to a dedicated Gourmet Sandwich Ordering app for Porco Rosso.

Starting the desing

Paper wireframes

Taking the time to draft iteration of each of the screen of the app on paper ensured that the elements hat made it to digital wireframes would be well-suited to address user pain points. For the home screen, I prioritized a quick and easy ordering process to help users save time.

Digital wireframes

As the initial design phase continued, I made sure to base screen design on feedback findings from the user research. This lead to the elimination of custom made sandwiches, and the creation of a very neat menu display and a button to re-make previous orders.

Usability study: findings

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

1. Menu

Users want a easy to navigate menu

2. Tracking

Users want to know when their food is being delivered

3. Introduction

First time users need a quick introduction to the app

Refining the desing


Early designs allowed for some customization, but after the usability studies, I added additional options to the Delivery Tracker. I also revised the design so users see the exact moment they can meet up with their delivery person.

The second usability study revealed confusion with the checkout flow. To make it easier for users, the Cart was upgraded with more features to edit their orders without having to go back to the menu. Users can add more items or eliminate them with one tap.

High-fidelity Prototype

The final high-fidelity prototype presented cleaner user flows for creating an order, proceeding to payment and tracking the order. It also met users needs for an option to get notifications or allowing calls from the delivery person.

View the Porco Rosso high-fidelity prototype.

Final Mockups



The app makes users get their food in a way that doesn’t affect their busy lives. It can be customized in many ways to fit the needs of different users.

What I learned:

While designing the Porco Rosso app, I learned that the process of creating an app can take different turns and it’s a very unpredictable journey, but in the end, when it makes the user’s life easier, I feel like I’ve achieved my goal.

You can Download my Resume here:

English Resume Currículum en Español