Back

GreenPass

// ROLE


Lead UX Designer — Ideation, Research, Interaction Design,

Visual Design, Prototyping

// OVERVIEW


Some college students around college campuses often struggle with food insecurity and limited budgets. Additionally, campus dining facilities generate significant food waste due to unsold or leftover meals. There is a lack of a user-friendly platform that connects students seeking affordable meals with establishments looking to reduce food waste by selling leftover food for a heavily discounted price instead of throwing food away.

// TEAM


Christian Nderu, Brand Design

Jack Katz, Graphic Design

The Approach

My team and I employed a basic four-step design process involving Discovery, Research, Testing, and Design throughout this project.

Gathering Preliminary Data

The first step was to develop interview questions to help gather quantitative and qualitative data about the community we were targeting. In order to synthesize our interview data effectively, I created an affinity map to help identify themes and patterns that we wanted our product to focus on. Furthermore, this map helped us better understand the user needs and emotions which would go on to inform the specific functionality design to be incorporated into GreenPass.

// INTERVIEW QUESTIONS


  1. How often do you find yourself discarding leftover food or ingredients because you didn't use them in time?

  2. How aware are you of the issue of food waste on campus, and do you feel it's a significant problem?

  3. Have you ever considered donating leftover food, or are there any barriers that prevent you from doing so?

  4. What safety concerns might you have about accepting food from someone you don't know?

  5. Would you be willing to pay a small fee for leftover food, or would you prefer a completely free exchange system?

  6. Have you used any apps or tools before to help you manage food waste or plan your meals? What did you like or dislike about them?

  7. How do you feel about on campus dining?

  8. Would you be interested in a platform that connects students with leftover food from others on campus?

  9. What features would be most important to you in an app designed to reduce food waste?

  10. What digital platforms are you most comfortable using?

// AFFINITY MAPPING


Things to consider…

  • Safety concerns

  • Nutritional information

  • When was the food cooked?

  • How is it handled?

  • Is the food sealed?

What the users want…

  • Available on mobile

  • Live inventory of food

  • Ingredients

  • Date of preparation

  • Discounted price

Discovery

Research

Testing

Design

User Research

The next step was to conduct a competitive analysis to gain a clear understanding of the product market and what strengths we could bring with GreenPass. During this process, I found two direct competitors and one indirect competitor to identify the main features included in each app, along with the missing features that we could implement to enhance the user experience and reach a broader audience. This was a crucial step as it helped me develop a user need statement that aligned with a singular task flow for GreenPass.

// COMPETETIVE ANALYSIS


Main Features to Focus On

  • Live inventory

  • Date of preparation

  • Nutritional info

  • Location services

// USER NEED STATEMENT


MSU students, especially those facing food insecurity or on a limited budget, need a convenient and affordable way to access healthy and varied meals on campus. They also require transparency and safety assurances when purchasing leftover food, including dietary information about ingredients, allergens, and calorie count.

// TASK FLOW FOR BUYING A GREENPASS


Testing Design Iterations

// LOW-FI SKETCHES


Main Screens

User Flow

Splash page variations. Introduction of progress bar feature.

// MED-FI WIREFRAMES FOLLOWING INITIAL TASK FLOW


// USABILITY TESTING RESULTS


  • Users found that the favorite button was confusing as a bookmark icon, we decided to switch the icon to a heart.

  • Some users found that there were not enough filters at the top to organize dining halls. Additional Filters were added to fix this.

  • Due to our tab at the bottom showing a rewards page, we added a rewards function to the order screen showing how many more orders to reach that reward.

Finalizing the Design

Last steps in the process included creating a cohesive design system that established clear brand standards throughout the user experience of GreenPass. As the project manager, I organized several working sessions and standup meetings with my brand designer and graphic designer to make sure we were all in agreement for each decision relating the design system and interaction design for the prototype.

// DESIGN SYSTEM


// HIGH FIDELITY WIREFRAMES — MAIN SCREENS


Splash Page

Login

Onboarding Carousel

Home

Menu

Order Details

Confirmation & Tips

QR Code

Order Complete