top of page

Case Study

Image by Pablo Merchán Montes

Case Study

Design a mobile-ordering app

for a burger sandwich restaurant to help users customize their burgers.

Vision

The general perception is that working professionals need an easy way to customize their own burgers with the ingredients they love!

User Research

The goal of this project is to design an app that provides a best user experience for working professionals.


This app will help users to customize their own burgers & sandwiches and also help them to control the amount of different ingredients in their burgers & sandwiches.

Research Problem

1 - Working professionals find it hard to customize their own burgers and sandwiches from their favorite restaurants.

2 - Customers are also unable to control the amount of ingredient in their burgers.

Research Goal

My goal is to design an app that provides a best user experience for working professionals so that they can customize their own burgers and sandwiches with ease.

 

I also want my customers to be able to control the amount of different ingredients in their burgers and sandwiches.

Research Summary

I conducted a user research to learn & understand how this onFleek burger and sandwiches app helps users to customize their own burgers and sandwiches with ease.

For this purpose I conducted an unmoderated usability study with five Toronto based working professionals. Each of the session lasted for about 30 minutes.

All the participants found the app quite easy to use and most participants wanted an quick & easy way to start customizing their burgers. I updated my hi fi design based on that research insights.

Image by Mario
Image by David Travis

Research Questions

1 - How long does it take for users to customize their own burgers?

2 - What are the most common reasons that users customize their own burgers?

3 - How does the convenience of burger customization through this app compare to other apps?

Research Methodology

I decided to conduct a research to learn users behaviors and perspective on how they customize their burgers.

For this purpose I used unmoderated usability study with 5 Toronto base working professionals. Participants were asked a pre defined list of questions followed by a short questionnaire to gather their experience.

 

Participants experiences were carefully observed and I took notes in a spread sheet for each participant. This note taking step helped me organized their experience at one place which later came in handy for analyzing the results. 

Usability Study

US Notes - hi fi.png
Portfolio Project - Affinity Diagramming.png

Analyzing & Synthesizing

After organizing user behaviors on a spread sheet, I analyzed the result to identify themes that were common across most participants. I used Affinity Diagram AD.

Research Insights

Paint Points common across most participants

1 - For most users it was not clear how to

start customizing their burgers from home screen.

2 - For most participants checking out their

burgers was not quick & easy. There should be a check out button beside preview.

3 - Participants wanted to have  a “save customization details” as their favorite burgers to avoid adding details each time they buy the same burger

Image by Choong Deng Xiang

User Persona

Created a couple of user persona's whose goals and characteristics represent the needs of a larger group of users. 

"There's no substitute for personally watching and listening to real people" Larry Page

Persona - Peter - Portfolio Project.png

Problem Statement

Robert is a software developer 


who needs to customize his own burger with multiple types of buns, different sizes of patties, and other condiments

because the restaurant he likes to eat from, does not offer any customization option.

empathizing & understanding user

Empathy maps

empathize with users

User Problems

Persona & Story

learn their perspectives

User Journey
Map

define their

needs & problems 

to create a better user experience

Low Fidelity Paper and Digital 

Wireframes

Paper Wireframe

Since my goal is to design an app that provides a best experience for working professionals to customize their own burgers.

I came up with 5 different versions of the same screen. All of them have 1 thing in common that is a highlighted customize button front and center.

version A.png

Version 1

version C.png

Version 3

version B.png

Version 2

version D.png

Version 4

Digital Wireframe

A glimpse of a digital wireframe created on figma. It provides an easy way for users to start customizing their burgers right off the home screen.

Iteration

I conducted two unmoderated usability studies to learn & understand user points. I improved the design based on the research insights from the study.

Image by Delfina Cocciardi

Customize Button

For most users

it was not clear how to

start customizing their

burgers from home screen

Image by Nathana Rebouças

Check out

For most participants

checking out their

burgers was not quick & easy. There should be a check out button beside preview

Image by Winston A. Hide

Favorite Button

Participants wanted to have  a “save customization details” as their favorite burgers to avoid adding details each time they buy the same burger

Final Mockup

1 - Home Screen Mockup.png
2 - Customize Screen Mockup.png
3 - 1 Customization Screen for Burger Mockup.png
5 - 1 Payment Screen Burger Mockup.png
6 - 1 Order Summary Burger Screen Mockup.png
4 - 1 Preview Burger Screen.png
7 - 1 Confirmation Burger Screen Mockup.png
bottom of page