May 2021

Fancy Eats app

Fancy Eats targets busy workers—who eat at fancy restaurants—and lack the time or ability to prepare a family dinner.

View Slide Deck

Project overview

Fancy Eats makes it easy for customers to find and customize items from a menu, then pick-up or have the order delivered.

I.

Project duration

April 2021 to May 2021

II.

The problem

Customers are frustrated with the online experience of their favorite restaurants and either call or cancel their order.

III.

The goal

Design an app that allows users to customize orders from their favorite restaurants to pick-up or have delivered.

IV.

My role

UX designer designing the Fancy Eats app from conception to delivery.

V.

Responsibilities

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

Understanding
the user

  • User research
  • Personas
  • Problem statements
  • User journey maps

Usability research: Summary

I conducted interviews and created empathy maps to understand the users I’m designing for and their needs. A primary user group identified through research was working adults who wanted to order out from a fancy restaurant.

This user group confirmed initial assumptions about Fancy Eats customers, but research also revealed that an inconsistent online experience caused users to abandon their online orders.

Usability research: Pain points

1 Confusion

Lack of clear steps and organization of content

2 Customization

Allergies or dietary preferences

3 IA

Unclear scheduling and options for pick-up or delivery

Persona: Chris

Problem statement:

Chris is a busy working adult with celiac disease who needs a healthy meal to pick up when he has to work late because they won’t have time to prepare a meal at home.

User journey map

Mapping Chris’s user journey revealed how helpful it would be for users to have a better online menu app.

Starting
the design

  • Paper wireframes
  • Digital wireframes
  • Low-fidelity prototype
  • Usability studies

Paper wireframes

Taking the time to draft iterations of each screen of the app on paper ensured that the elements that 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 designs on feedback and findings from the user research.

Order scheduling was a key user need to address in the designs in addition to accounting for dietary preferences.

Low-fidelity prototype

The low-fidelity prototype simulated the primary user flow of finding and ordering menu items so the prototype could be utilized in a usability study.

View Lo-fi Prototype

Usability study: Parameters

Fancy Eats makes it easy for customers to find and customize items from a menu, then pick-up or have the order delivered.

I.

Study type

Unmoderated usability study

II.

Location

United States, remote (each participant went through the usability study in their own home).

III.

Participants

Five participants, each completing the study on their own time. Then, each participant completes a questionnaire on their experience privately.

IV.

Length

15-20 minutes

Usability study: Findings

These were the main findings uncovered by the usability study:

1 Reusability

People want to save their payment information and dietary preferences.

2 Customization

People want more intuitive customization options.

3 Convenience

People want to schedule their order for pick-up or delivery.

Refining
the design

  • Mockups
  • High-fidelity prototype
  • Accessibility

Mockups

There were a few actionable insights I came up with from the usability studies. One of these was moving the pick-up / delivery option earlier in the workflow to reduce user confusion.

Key Mockups

High-fidelity prototype

The hi-fi prototype followed the same “menu item customization” user flow as the lo-fi prototype, and included the design changes made after the usability study.

View Hi-fi Prototype

Accessibility (a11y) considerations

1

Provided access to users who are vision impaired through adding alt text to images for screen readers.

2

Used icons to help make navigation easier.

3

Used detailed imagery for menu items to help all users better understand the designs.

Going forward

  • Takeaways
  • Next steps

Takeaways

Impact:
The app makes users feel like Fancy Eats really thinks about how to meet their needs.

What I learned:
While designing the Fancy Eats app, I learned that the first ideas for the app are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs.

“The app made it so easy to order from my favorite restaurant! I would definitely use this app the next time I order.”

Next steps

1

Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.

2

Conduct more user research to determine any new areas of need such as multiple language support and audio options.

Let's connect!

Thank you for your time reviewing my work on the Fancy Eats app!

Thank you!