INDUSTRY

B2C Food & Beverage

Roles

UX Research, Visual Design, User Experience Design, & User Interface Design

Team

Solo project

Overview

The Covid-19 lockdown had a severe financial impact on the owner of Fresh Market, a restaurant in Dallas, Texas, forcing it to remain closed for several weeks. Upon reopening, the business model faced challenges as customers were reluctant to dine in.

Challenge

Revitalize revenue by creating a new tool that caters to the new dining experience prompted by the pandemic, benefiting both the restaurant and its customers.

solution

Develop a meal ordering app that boosts revenue for the owner and delights customers with the convenience of browsing, customizing, and purchasing pre-made meals through contactless pick-up and delivery options.

duration

Three weeks

Empathize

• Research Plan

• Secondary Research

• Competitive Analysis

• User Interviews

• Empathy Map

• User Persona

Define

• User/Business/Shared Goals

• Feature Roadmap

• App Map

• Task Flow

Ideate

• Medium Fidelity Wireframes

• Brand Standards

• Style Guide

Implementation

• Final Design

• Next Steps

Goal 1
How has the COVID-19 pandemic impacted people's eating habits, dietary patterns, and meal routines?

Goal 2
How has COVID-19 impacted customer dining habits, behaviors, and food acquisition from restaurants and stores?

Goal 3
What safety measures and precautions are important to restaurant customers?

Goal 4
How has COVID-19 impacted the restaurant industry, including small and large businesses?

Methodologies

1. Secondary research, takeaway

• Dine-in visits to restaurants decreased significantly while visits to fast food restaurants increased

• Ordering groceries through apps increased and the option for contactless delivery became more popular, as people began to cook and eat more at home

• Pre-made and meal cooking services experienced significant increases in customers and sales

2. Competitive analysis, takeaway

• Offer ability to create your own meals from different entree/side dish options (customization)

• Offer lots of premade options (different diet options, different types of food, etc.)

• Allow customers to buy/order as wanted or needed, don’t make a subscription mandatory

3. User interviews, takeaway

• Offer ways to purchase premade meals limiting public interaction

• Offer healthy, convenient, and affordable premade meal options to help fight pandemic cooking fatigue

• Offer the ability to customize meals and provide access to multiple options with different ordering/subscription methods based upon preference

I conducted interviews with customers who frequently or recently ordered ready-made meals or food through online services or apps for safety and convenience during the pandemic.

After analyzing the data from the interviews, I synthesized the findings to uncover user insights and emotions, including:

+ A desire to minimize public interaction by limiting in-store shopping and eating out during the pandemic

+ A preference for convenient and affordable meal options that support healthy eating habits

+ A need for the ability to customize meals, view various options, and order based on individual preferences rather than subscribing to a service

Following the creation of the empathy map, I used it as a reference point to develop an ideal user persona that took an empathic approach to defining the app's structure and content.

Drawing on the traits, goals, needs, and frustrations identified in the empathy map, I fleshed out the ideal user persona for Fresh Market, creating a context for the app's development.

Business goals

• Create a meal ordering app that allows customers to purchase premade meals with contactless pick up/delivery options

• Capitalize on this new trend by focusing on safe restaurant services, healthy meals for busy people, and creating brand trust in response to Covid-19

• Become a reliable premade meal ordering service with the ability to customize and build meal plans

User goals

• Provide meal customization options, allowing customers to create their own meals from different entree and side dish options

• Offer a wide variety of premade options, catering to different dietary requirements and preferences

• Allow customers to order or buy meals on an as-needed basis, without requiring a subscription

Shared goals

• Prioritize safety through contactless ordering and payment options, social distancing measures, and reassurance to customers

• Promote healthy eating habits by offering menu items that are nutritious and easy to prepare

• Shift focus to takeout or delivery, investing in tech that enhances online ordering experiences, and expand menus or pricing models

With the business, user, and shared goals of the app clearly defined, I ideated and identified key features and categorized them accordingly.

I compiled an initial list of features and sorted them by feasibility and category. The features were carefully selected to encompass both the essential and unique functionalities required to support Fresh Market's new business objectives.

After developing the feature roadmap, I proceeded to create the app map to depict the app's information architecture and arrange the screen flow.

The app map below provides a comprehensive overview of the app's navigation and establishes the required organizational structure for the app's development.

Task flow

Upon analyzing the app map, I identified "placing a family meal plan order and proceeding to checkout" as one of the primary task flows.

To outline the user's journey and the necessary steps required to complete this task, I developed the following task flow.

After finalizing the task flow, I created medium-fidelity wireframes to visually represent the connections between screens for the defined task. These wireframes connected the app's information architecture to create a seamless screen flow.

During the wireframing process, I made design decisions based on the following factors:

+ Analyzing Fresh Market's competitors to find ways to simplify tasks

+ Understanding users' need for a quick, easy, and efficient way to order premade meals

+ Identifying users' desire for healthy and customizable meal plans based on individual preferences

To ensure a consistent visual identity, a style guide is crucial for app design. This involved creating a logo and icon that captured the brand's essence, choosing a color palette that evokes desired emotions in users while aligning with the brand's aesthetic, and selecting typography that's used consistently throughout the app.

Fresh Market logo

Fresh Market icon

After finalizing the brand design, I developed a style guide to define the app's look and feel. This included defining the hierarchy, buttons, navigation, and other key elements, ensuring that they flowed seamlessly with the branding.

The style guide served as a guide to incorporate the new design standards into the app screens defined by the wireframes, creating a visually appealing and consistent user experience that aligned with the brand identity. This ensured that the app's design flowed seamlessly and enhanced the overall user experience.

Usability testing was conducted to evaluate the user experience and identify any pain points or confusing elements in the final prototype. Based on the insights gathered, an affinity map was created to organize and prioritize the necessary changes. This helped to identify patterns and themes among the feedback and address the most significant issues first.