Brief

Roles: Researcher, Branding, Logo designer, UI designer

Tools: Photoshop, XD, Illustrator

Goals: App, Brand

Kai is a (fictional) start-up in Chicago that is very concerned about food waste. Their goal is to help food donors from all over—restaurants, hotels, grocery stores, churches, for private functions, and more—to donate their food to those who need it in a timely, safe, and easy way. So far the team has been gathering food from a few donors and distributing it to a few shelters. They have tested the model and were able to buy a couple of refrigerated trucks to transport the food. They have a system with part-time drivers that work four hours per day picking up food for deliveries. However, they want to scale. And for that, they want to automate their processes. They need an app that allows food donors to easily communicate with them.

How did I create a food donation app?

01. Research

02. Define

03. Design

04. Prototype

  • Market Research
  • Competitive Analysis
  • Project Goals
  • User Flow
  • Wireframes
  • Logo and UI Kit
  • Hi-fi Prototype
  • User testing

Research

Market Research

This project was challenging due to lack of local food donation programs. While I couldn't interview people who were part of the food donation process, I did an in-depth research by reading articles, reports, and regulations. From this research I identified the issues and pain points that food donors and food rescue non-profits face.

Donors

What food can be donated?

What protections are there?

How food donation works?

How to store and deliver food?

Where can food be donated?

What are the benefits?

Food banks/rescues

How to properly collect and transport food? *

What food can be accepted?

Do we have enough volunteers/staff?

How to streamline the process?

How to accept small and large donations?

* for this case study, this issue was not taken into consideration since Kai has means to safely transport donated food.

Competitive Analysis

Food rescues operate differently, depending on their size and resources but generally there are 2 most common models:
#1: rescues connect donors with volunteers, who pick up donations and deliver to recipients.
#2: rescues organize a pick-up and delivery themselves.

Kai has a couple of refrigerated trucks which allows them to safely collect several donations on the way to a recipient, thus they utilize the 2nd model. Drivers receive requests for a pick-up and whoever is closest to the recipient will accept the request. Currently, there is no app that serves to connect them with food donors and track their donations to the non-profits.

Many rescue organizations are part of Hunger Network, technically using the same app but localized version (ie, you need to download a specific app for your area but they all look and function the same): 412 Food Rescue, Food Rescue Hero, Food Finders, Philly Food Rescue, Last Mile Food Rescue.

Define

After learning who our users are, the next step was to determine what the website should have. This is where using the persona comes in handy.

Project Goals

While it's helpful to know what users want, it's not always feasible to build a product that serves all the needs, since that may not be profitable and realistic. Thus it's important to look at the persona's needs vs company's goals through the lenses of technical limitations to determine where the goals overlap and where a compromise can be found. This was then translated into more granular and concrete list of features that would need to be built in.

Card Sorting

The next step was to find out the way to structure a website that would be clear and intuitive for users. I had 10 participants grouping the destinations and I learned that there should be a distinction between specific events and general time periods.

Site Map and User Flow

Now that I know what the website must have to achieve users' and company's goals, I could put together a website structure. This is where the website starts to get some shape and "bones" to build on. With a user flow, I could validate the site map and what pages were necessary to design for user testing.

Design