UX Design, user research

Mealflow Web App

Creating an affordable food delivery experience for college students

UX Design, user research

MealFlow Web App

Creating an affordable food delivery experience for college students

background

Project Overview

MealFlow is a start-up based in San Diego, CA. They aim to bring affordable food delivery to college students, starting with UCSD in Fall 2021. They hope to launch their first minimum viable product (MVP) by September 2021 and gain funding for future endeavors.

In February 2021, I was brought on the team as the lead UX Designer to design their web application aimed to facilitate food deliveries within the college community for low-cost delivery fees.

Client

MealFlow

Role

Lead UX/UI Designer

Team

Myself, 1 designer,
4 developers, 1 product manager

Duration

24 weeks

Creating an affordable food delivery experience

College students that live on campus have low access to food and delivery costs can be too expensive. MealFlow is a community-driven platform that provides students with access to a low-cost delivery option and a way to make some quick money if they want to help their fellow students.

The goal of this project was to create a web application that allowed users to post and request trips to local restaurants, hop on to fellow student trips, and explore local food delivery options for a lower cost.

💡

How might we help provide easier access to food for college students at a lower cost?

RESEARCH

Understanding the users

The team conducted multiple rounds of customer interviews with college students at UCSD to discover their needs and new product opportunities revolving around food and transportation.

Takeaways

  • College students find that food delivery is too expensive for their budget.
  • Students that don't own cars have to rely on other people for transportation.
  • Cost and convenience are two main deciding factors for students when it comes to getting food.

Meet Alex and Christina

Based on the interviews, I synthesized the findings into two personas with different needs, use cases, and motivations. The team, developers and managers used these personas to inform design and product decisions, like prioritization of features in the minimum viable product (MVP).

Alex - the student with no car

Christina - the student driver

The user journey and flow

The project manager and lead front-end developer provided me with a user flow and product requirements for the web application that was pre-determined before I joined. We worked together to better understand and flesh out the flow based on the research conducted.

DESIGN

Fleshing out the idea through low-fidelity wireframes

With the product requirements and user journey defined, I started off by sketching out the main screens and moved into low-fidelity wireframes. I presented my work to stakeholders and received feedback to ensure that I was bringing what they had in mind to life.

Testing this new concept

To make sure our product was viable and easy to understand for our users, I suggested that we should run some tests during this wireframe stage. They were thinking of waiting until the MVP launch to test, but I argued that it was more valuable to test early and wouldn't take much resources. I created a low-fidelity prototype on Figma and tested it with 8 participants and synthesized the research findings into a spreadsheet to share with the team.

Key areas of improvement

  • Users wanted a simple browsing and ordering experience, they didn't want to click too many times just to view the menu and move forward with their order.
  • We had included a filter by day of the week feature, but found that users wouldn't know what they want to eat days in advance.
  • Users wished to see how far away certain deliveries or trips were before making an order.
  • Some of the copy and actions were unclear to users like "# Orders Left" on the trip and the difference between the "View Menu" and "Order Now" buttons.

A growing project

With these findings in mind, we were able to develop the branding and hi-fidelity designs for the application. We met with stakeholders to ensure our branding matched the company values and went through many iterations to land on what we have today.

The scope of the project also increased as we brought a new product manager. We added in new features and ideas based on user feedback and competitor research, specifically the ability to explore and search for restaurants and the ability to view past trips and order history.

browse by restaurant

find ongoing deliveries in the area

going somewhere? post it!

want delivery? request it!

find orders to pick-up and deliver

view your ongoing and past orders

PROTOTYPE & TEST

Planning and building the prototype

With the launch of the MVP on the horizon, design and development are worked in tandem to make the launch happen. However, I still wanted to conduct testing before launch to validate our ideas and designs while development was happening. I created a usability test plan which focused on testing user understanding and the overall design of the platform.

I built one interactive prototype that covered both use cases and more. The prototype take the users through the entire browsing, ordering and checkout flow, as well as the posting and requesting features. You can check out the Figma prototype below!

View Prototype

Conclusion

Where are we today?

The project is currently on hiatus. I completed the testing for the web application and an MVP was developed. I also designed a mobile application and handed it off to the development team and main stakeholders before leaving the team.

Let's work together!

If you want to get in touch with me about a project,
collaboration, or just want to chat, send me a message. 💜