WOL mockup


World of Life

UX/UI Designer

Nhung Le, Patrice Fabel

September 2018 - Present

Sketch, Invision


The mission for this project is to build an internal application which measures success metrics for a customer relationship management (CRM) platform between the WOL's volunteers and the clients.


Save individuals bios (family size in specifics, address, phone number, id number, overview of needs). 

Volunteer can register new clients and signing people in.
Volunteer can create a new program and view past program.

Admins can view data of the amount of people attending the events, the amount of produce was given weekly, monthly and quarterly.


Word of Life International (WOL) is a not-for-profit community outreach agency located in the South Bronx, New York City. Currently, running domestic programs that serves the Bronx community and its surrounding neighborhoods. Each week, WOL’s feeding program supports an average of 8,000 household members in the Bronx monthly. WOL's mission is to create strong communities and individuals without the immediate threat of hunger, homelessness, and unemployment.

Location is very important because Bronx is the least healthy county in New York State since 2009. A lot of social and economic factors contribute to this status: Unemployment is high and the high school graduation rate is low. The majority of Bronx residents have not exercised in the past 30 days. Similar staggering statistics on a national level as well.

WOL create social programming and collaborate with organizations that do the same. They have a few major programming are in the areas

  • Food, Health & Wellness
  • Social Services
  • Ecological Justice & Disaster Prepared
  • Community Wellness (Economic Development)
  • Demographics: Seniors, Youth, Veteran

    To learn more about the mission of the non-profit, please access the website at: http://www.wordoflifefornewyorkcity.org

Who is Word of life?


Meeting with Stakeholders and the teams

After a few prelimary discussions with skateholders and my teammate to identify project scope, design requirements, business goals. I decided to tackle this project using the design thinking methods and User Centered Design Canvas.


WOL is a community outreach non-profit that organizes a lot of social programs to fight back the homelessness in the South Bronx of New York.

Screen Shot 2019-03-19 at 3.32.22 PM
Screen Shot 2019-03-19 at 3.33.29 PM
Problems Space

The scope of this project focuses on the Food, Health and Wellness sector of WOL because all other programs depends on Food Services. The Feed the Community Program or Food Pantry helps nurture a healthier community because a lot of produce which come from this program will be in partnership with local farmers unlike traditional pantries.

The program is hosted every Saturdays and usually has around 400-600 clients. They stand and wait in line since 2 AM in the morning.

Volunteers printed out the numbers and gave them to the clients. Clients' names are written on the sign in sheets where they indicate the # of seniors, children and adults in every household. Volunteers called the numbers, validated the names, and collected clients' numbers before handing out the food on site.

Them, the sign in sheets are collected and numbers are calculated on a monthly basis and information is used for grant writing and other administrative purposes. Additionally, clients fill out an intake form every year, which the non-profit keep on file that gives them a profile of their family. The personal information file is organized in the box based on the last names.

This is not sustainable and time consuming and not all volunteers can calculate the amount of clients and papers manually.  Additionally, it’s a lot of paper and things can easily get lost.
Moreover, menu is recorded on each program's day. The organization wants to keep a record of the food which is given according to family size.  They need to be able to track the amount of food is being given. 

  • Volunteers who check the clients in at the food pantry site
  • Administrative staff who wants to check the statistics of the amount of food, clients, programs
  • Moving toward the sustainable approach in the future to save more paper resources
  • Easy to manage data of clients, food to ask for funding purposes.

We built out an application will be able to measure success metrics for a customer relationship management platform. It will serve as a registration system for the pantry where we can:

  • Save individuals bios (family size in specifics, address, phone number, id number, overview of needs). 
  • A great interface for volunteers and administrators. On thursdays and Saturdays, volunteers can register in new clients and signing people in through the app.
  • During the week days, admins can run a report. How many households, how many seniors, how many children did we impact this week? Or How much produce was given in lbs this week

Problem Statement

How can Word of life manage clients data and make clients check-in process more sustainale and reduce wait time at the food pantry service sites?

User Surveys

We sent out the survey for both the volunteer side and the clients side to learn more about their demographics, the types of programs they are volunteering for, their prefered method of technology usage. We collected 7 surveys from the volunteer side, and gain a better understanding of their backgrounds, motivations, behaviors, and pain points.

The survey result has shown that 85% volunteer for WOL are female, and most of them are seniors who are 65 to 74. They mostly volunteer for Feed the community program, and 33% of them said that they are more comfortable using Android phone (Google Pixel or Samsung Galaxy). Some of the volunteers mentioned that they need a bigger space for the service side.


In order to efficiently analyze  the data, I perform benchmarking by comparing the product features from other companies. The purpose of this benchmarking process is to see how other digital products offer alternative ways to solve a problem. I also want to identify the common patterns being repeated across many sites within a vertical market.

Guest List
  • Plentiful is a service which provides the reservation system for food pantries and the people they serve. Families find the pantries and the food they need without waiting in a long line. They let the food pantries store the data of the amount of people who attend in different age groups over time.
  • Guest list check-in is an app which can help check-in guests more efficiently on the date of the event. The app contain the details of the events and the guests information. 



The next step in the design process is to create the site map to show the organization of this internal application's content and functions. It provides a clearer structure and prepare for the user flows.



Low-fidelity prototype

The purpose of my low-fidelity prototype is that it allows me to include all the core features of the app. It also saves time to not focus on the design aspect too much, but gear my attention towards the layout and navigation without distraction. Below are some hand-drawn sketches to illustrate how users can complete some main tasks in my app. 

Define style guide

Style guide Copy
Style guide Copy 2

High-fidelity prototype

Home v2
Add a new program from the home screen
  • From the home screen, the users can add a new volunteer program by clicking on  “New Service” symbol on the top of the page. All the programs are also organized by up coming programs and past programs with date and time information.
  • They can select and type, date and time of the program from the drop down menu.
  • The new program is created and added to the home screen.
Check-in clients for the program
  • Click on the program type to check clients in
  •  List of clients show up, option to search for clients in the search box, Click on “Serve” button to check clients in
  • Client name will show up in the “checked in” section, data to show how many clients already checked in
Check-in clients
View Client Profiles
  • User can click “Clients” on the navigation menu to access all client’s profile.
  • Select the name of the client to view all information.
  • The screen shows all the clients’ personal information.
Home v2
Screen Shot 2019-11-06 at 3.34.16 PM
Screen Shot 2019-11-06 at 3.34.25 PM
Screen Shot 2019-11-06 at 3.34.35 PM
Programs after added
Check-in clients
Check-in clients notification
Check-in clients Copy
Client already checkedin
Check-in clients Copy 2

Selected Works

Microsoft TeamsProduct Design, Desktop and mobile application

Human Health ProjectUX/UI Design, Branding, Web

Word of lifeUX/UI Design, Mobile App, iOS

Pacifier in the BackpackUX/UI Design, iOS

Perfect PropertiesVisual Design, Web, Mobile App, Tablet

SeedshareUX Design, iOS

© NHUNG LE 2019. All rights reserved.