NourishNetProject-1

Overview.

In Davis, CA, a network of "Freedges" has been established, providing multiple refrigerators scattered across the city for people to donate surplus food, which those in need can freely access. Unfortunately, this system relies solely on human interaction and often leads to food going to waste. Many in the Davis community remain unaware of these invaluable resources.

Introducing NourishNet, an innovative solution to address the shortcomings of the honor system-based Freedge concept. This app keeps users informed in real-time about newly available food and enables them to switch between various locations to identify the most optimal Freedge to visit. Given that Davis primarily comprises UC Davis students, a significant portion grapples with financial challenges, as revealed by a university-conducted study indicating that 44% of students experience food insecurity. NourishNet empowers them to swiftly locate and access free, nutritious food, making a meaningful impact on their daily lives.

Role: UI/UX Designer

Duration: 4 Weeks

Tools: Figma

Problem.

Freedges can only function when the community contributes and works together. The goal is to create an app that seamlessly connects with the Freedges and allows for community connection so more people in need can have access to free food. Thus, how might we encourage the Davis community to use this app to continue updating others online of what inventory each Freedge has so that more people can have access to free food?

User Research.

Target Audience.

My research began by creating two user persona groups based on my target audience of UC Davis students experiencing food insecurity and students who contribute to food waste. My two groups were based on research done as previously mentioned, finding that 44% of UC Davis students experience food insecurity, as well as additional research by Recycling Works, unveiling that college students tend to generate at least 142 pounds of food waste a year. 

Pain Points.

Three major pain points were discovered through user research:

  1. Ineffective communication at the Freedges—users trying to access the Freedges are left not knowing what is available at different locations, or even if some do not have food. There is a lack of real-time information about these community resources. 
  2. Food freshness and availability—how would a user know if the food in the Freedges have been there for too long or if they spoiled? As of now, the Freedges have no way to tell how long food has been inside, leaving it up to users to find out after they take it out. 
  3. User contribution reliability—the Freedge alone relies on the honor system, thus an app task that requires users to be willing to record the food they add or take out must be simple and easy to upload. 

Personas.

I created two personas to portray my target audience: one focusing on students grappling with food insecurity, seeking assistance from the Freedges resources, and another depicting a student who struggles with grocery shopping and consequently has significant food wastage.

Copy-of-Des-112-student-persona-1
Copy-of-Des-112-student-persona-1-1

Ideation.

Storyboards.

In order to better visualize my personas, I developed 2 storyboards to gain insights into their respective situations and how they would use NourishNet in their lives. I'm addressing the challenge of designing a user-friendly app that encourages people to use NourishNet to notify others when new food is available in a Freedge. Since the app relies on users to update its content, the first storyboard illustrates a user adding food and quickly updating the app by scanning a QR code on the Freedge. Thus, accessing the app is made simple and fast. After scanning the QR code, users are directed to the app and asked a few brief questions to upload their content to the home page. This streamlined process aims to motivate users to upload and engage with the app more. The second scenario focuses on a user who receives notifications on their phone when new food is added to NourishNet, allowing them to seamlessly claim the available food.

Storyboard-DES112P2-1
Storyboard-DES112P2-2-2

Wireframes.

I began with initial sketched wireframes depicting my core ideas for NourishNet. These sketches provided a starting point for brainstorming and visualizing the app's features and functionalities, setting the stage for the subsequent design phases.

Wireframes-SB-2

Mid-Fidelity.

In the process of developing my app and addressing user-related challenges, I progressed from initial sketches to mid-fidelity iterations. These mid-fi designs served as a crucial step in outlining the fundamental structure of NourishNet and defining the app's navigation, enabling me to refine the overall layout and giving me valuable insights into how users would interact with the application.

DES-112-P2-Deliverable-3

User Testing.

As I continued iterating my designs, I conducted user testing prior to my high-fidelity prototype. 6 people participated in user testing, all students at UC Davis. 

The participants were given two tasks to complete:

  1. Create an account for NourishNet.
  2. Find food on the homepage and 'claim it' to let others know it has been taken from the Freedge.

Positives from user testing:

  • Participants enjoyed the overall design of the interface and thought the navigation through the app was seamless.
  • Participants easily went through the tasks and felt that everything was intuitive to find.

Areas to develop:

  • Missing more personalized questions during the onboarding process that could help give users a more customized experience.
  • Icons indicating the quantity of food available seemed unclear (is there some way to make this icon more intuitive?).
  • There could be better typographical hierarchy on the page description for the food available.
  • Particularly on the page that allows users to change their Freedge location, there could be greater contrast between the brown font color and the green colored background.
usertestingNourish-1

Design System.

I created the design system for NourishNet to align with the app's mission of giving those in need access to healthy and free food and at the same time, eliminating food waste. To reflect this aspect, I chose a fun and approachable font that conveys a sense of ease and inclusivity. Additionally, the warm and earthy color palette mirrors the NourishNet's commitment to sustainability, creating a welcoming and inviting visual experience for anyone utilizing the app. 

design-system-1-1

Final Product.

Quick Login Process.

Users are greeted on NourishNet with an introduction, allowing them to quickly set up an account and fill in a few short questions to personalize their experience. 

sign-up-2

Claim Food.

Users are able to seamlessly claim food they find in the Freedges by clicking "I Got One!" along with the quantity they withdrew, notifying others on the app. 

claim-food

Change Freedge Locations.

If users want to explore the offerings of other Freedge locations, they can easily switch to a different location from the home screen. By adding a new location, their home screen will promptly update to display the food available at the selected Freedge.

change-location-1

Report Your Donation.

If users wish to donate food to a Freedge, they can easily contribute by answering a few quick questions about their donation, including its condition and date of purchase. This information enables the app to estimate when the donated food might expire, so it can be boosted on other users home pages. 

donate-food-1

Full Prototype.

Try it out!

Conclusion.

I truly had an incredible experience creating NourishNet, starting with a small idea and bringing it to life. I learned so much about the UI/UX Design process including some key takeaways:

  1. Determining the most important features— NourishNet was an idea I had developed on my own in which I had brainstormed many directions the app could have gone in. It was important to figure out what features would be most valuable for my target audience based on how they would utilize the app. 
  2. Envisioning the real-world impact—basing this app off of real problems and factual data, the finished product shows the potential real-world impact of my design work. I strive to design to help others, and this exemplified how I can use my work to do so.
  3. What do my users truly need?— it is easy to get side tracked by the aesthetics of a design project. During this project, I constantly reminded myself of the mission of NourishNet and what my users would really need. 

 

••••••••

Built with love in the PNW🫶🏼