Lorena Buitrago - User Experience Designer - User Experience Designer 📍Based in San Francisco
Lorena Buitrago UX / UI Designer
background1.jpg

UX / UI Rescuing Leftover Cuisine

Helping the Hungry by Rescuing &

Donating Leftover Food to Homeless Shelters

RLC HF_style.jpg

Industry

NON PROFIT

My Role

UX / UI DESIGNER

Project Timeframe

FEB 2018 -

MAY 2018

Category

UX / UI

Client

RESCUING LEFTOVER CUISINE


 

I created user flows, and work in a team of UX, Visual design and engineering in creating the low fidelity and high fidelity prototypes and style guide for web & mobile click-throughs for use during tests. Also participate in stakeholders interviews and usability testing and will conduct user interviews . 


Millions of people around the globe are unable to get access to food, while countless meals are thrown away each day. Rescuing Leftover Cuisine is Helping the hungry by rescuing and donating leftover food to homeless shelters.

 
 
 

Objective

How can we create social interactions around creative ways of cooking leftover food?

Starting with this question helped the team determine how to the best reach the global goal. All members agreed that it will be best accomplished thought a Recipes App that has as main objectives :

  • Provide a tool for the public to reduce food waste at home in their own kitchens, allowing for recipes that target commonly wasted food to be shared and built upon. Tool must be able to track user interaction, food waste reduction, and number of shares.

  • Help the organizations (soup kitchens, shelters, etc)  that receive leftover cuisine (cooked or raw) cook complete meals or brainstorm meal ideas. Cooking is a cornerstone of every human’s life and RLC wants to continue to foster that growth and development.

  • Spark creativity in the minds of not only the consumers of the product but also with anyone who is about to throw away any food. This app can act as a reinforcement to think twice before throwing away any food and help start a larger trend outside of our regular customer base.


 
 

Research

Identifying an opportunity area

We started by researching the most used web responsive food recipes sites:

First meeting with initial Q & A's:

After the first stakeholders meeting and research, we had some questions (answers in bold italics):

  • What are the most commonly wasted foods? Not relevant to the design

  • User = the public or only shelters? Everyone

  • Design for iOS/Android or both? Responsive website

  • How would tags work? ( tag specific food item, tag food item that is most commonly wasted? Or tag by categories? Everyone that creates a recipe can create a tag *

  • Why would RLC want to create a recipe app? Because it Will help keep a track of how the food is being cooked and used, also create consciousness with creative ways of cooking and preventing food waste by giving people different ideas.

  • How to assign points to items? Points to the most creative recipe that uses some of the most difficult to cook items (Functionality not available for the MVP)

  • Web, IOS, or android? Should it be mobile or desk? Responsive website

  • Can you give us an example of food waste categories? And how can we create tags of food waste? Vegan, dinner (category) , celery (ingredient being wasted)

  • How important is to add video in the MVP comments? Not for the MVP

  • “Can add suggested modifications from other users but recipe should not dynamically change?” Can you clarify this? This is the comment section, where other people can publish images and different ways to create the recipe, adding ingredients or a different preparation method

Answering these questions with the stakeholders gave us a better picture of the jobs they wanted to get done with the recipes responsive web app.

* The tagging functionality is still being revised and analyzed by the UX and engineering team


The Users

We were requested to create the front & back end design. To get clarification of functions, I created a user flow:

user flow RRF.png
  • ADMIN - within RLC

  • VISITORS - everyone

  • USERS -Shelters/ Signed up users

Functions of Each Person

Admin: Block users and accounts that go against the Ethics & Moral codes of the company, create new recipes, Tags Admin.

Visitor: Able to view recipes.

User: Person that signs up. Able to create recipes and make comments on others recipes, also can add tags to the recipe created.

After this initial meeting we created first hand sketches starting on mobile:

rescue leftover cuisine_UX_UI_design.jpg

 

Then we continued with the initial low fidelity prototype:

 
low fidelity RLC.jpg
 

The first iteration with stakeholders and the UX design team helped everyone be in the same page and quickly adjust functionality elements accordingly to the company goals and the user needs, we created a second low fidelity wireframe with adjustments discussed, that included:

Make the Create Recipe & Donate Button, much more easily accessible, adjust items in the Navigation bar for the signed in users and rethink back end tabs.

 
RLC LF_second iteration.jpg

 

Styleguide

STYLE GUIDE.jpg

Then with the LF prototype approved we proceeded to create a first high fidelity prototype for A/B Testing:

We wanted to figure if the user would prefer categories or if a search by keyword would be enough:

First Option "A" -  Categories circles of types of food, and list of ingredients

 
RLC HF- first iteration.jpg
 

Second Option "B" - Direct search by keyword

RLC HF.jpg

 

We tested 10 people, 8 of whom agreed that the best option was the "B"Direct search by keyword. 


 

Mobile responsive site:

 
RLC HF-mobil.jpg
 

 

& The Back end Design:

 
RLC HF.jpg
 

 

We are currently waiting on stakeholders to approve final designs and begin developing the site with the engeneering team.