Virtual
Foster Closet

Image alt tag
Community Service Project

Tools Utilized

  • React

  • JavaScript

  • jQuery

  • CSS3

  • HTML5

  • Material-UI

  • Tachyons

  • Twilio

  • Draw

  • GitHub

  • Trello

"Considering many options, we chose to create an app that helps the most vulnerable in our population... The Children"
Kim Leibowitz L.Ac, HHP

The Problem

  • Often, when children are placed with a foster care family, there is little to no warning a child is about to be dropped off on your doorstep with only the clothes on their back.

  • It can take days or weeks to receive needed items from donors. 

  • Additionally, COVID concerns have negatively impacted the operating hours of physical donation centers, often leaving foster families without a network of donors.

Community Service Project

The Solution

Virtual Foster Closet provides foster families:

  • The ability to easily create a request of items they need for their foster child (children) and have a donor reach out and donate said items.

  • Updates potential donors with specific requests via text notifications on their mobile phone.

Community Service Project

Wireframes

Example

At the beginning of my design process I created wireframes for testing purposes.

Key Points

  • Based on user needs and user journey, I laid out content and functionality for all pages

  • Utilized Draw.io

  • In order to establish and reach MVP, several iterations of wireframes were utilized to be able to implement new features and improve user flow.

  • Designed high-fidelity wireframes taking into account the user story and the user experience to create a clean and simple design that was easy to navigate.

Community Service Project

UI Design

Once I tested out all usability mistakes, I started designing the final screens in draw.io

Key Points

  • Clean and simple minimalist visual style

  • Inspired by research of popular Baby Registry sites

  • Utilized Tachyons and Material-UI to deliver themes that were customizable, cross browser compatible and 100% responsive, to preserve the user experience, as well as the look and feel across all devices.

  • I am proud of solving a problem our team encountered by figuring out how to extract deeply nested objects utilizing map method.

  • The final design addresses user needs and allows users to quickly connect with donors?

"In just over one month, our team went from idea to launch."
Kim Leibowitz L.Ac, HHP

Check out my code!

View Github Repo