.png)
Lagos Food Bank Initiative (LFBI) is a non-profit organization based in Lagos, Nigeria, founded with the mission of alleviating malnutrition in Nigeria’s communities. According to UNICEF, 25 million Nigerians are at risk of food insecurity in 2023. In response, LFBI provides nutrition-focused programs to combat hunger and reduce food waste. The Food Bank has over 24,000 registered volunteers (19,000 of which are very active) and there have been over 2 million beneficiaries impacted by their work.
Hack4Impact began working with LFBI in the spring of 2023, the semester before I joined. However, I had a lot to do in the fall; I assisted in a full transition from mid-fis to hi-fis, considering essential design decisions along the way.
LFBI runs 8 programs and manages 19,000 active volunteers, who they rely on to help run events. However, their previous system for managing volunteers was very labor intensive. LFBI used several platforms to manage volunteers, including Google Forms, Instagram, and WhatsApp. With so many volunteers, this felt unsustainable and difficult to keep up with.
In the end, we created a product that made the (potentially daunting) task of managing 19,000+ volunteers much easier. For example, instead of having to manually check in every volunteer for an event, supervisors can now do it online in a few clicks (as seen below). Instead of needing to create new forms for each event, users can duplicate any that happen regularly. We also streamlined the process of signing up for events for volunteers, and consolidated volunteer profiles for easy browsing by administrators.
Our partners communicated to us that the primary user group would be administrators that were responsible for volunteer management. However, there are also two additional groups: supervisors, and the volunteers, themselves. Each user group has a unique set of needs within the organization:
Volunteers can browse and sign up for events.
Supervisors can manage volunteers and create events.
Administrators can manage volunteers, create events, and edit the website’s metadata.
To better understand the user journey for each stakeholder group, interviews were conducted with 2 volunteers, 1 supervisor, and 1 administrator. Here are the main insights:
I made sure to keep these insights in mind to make sure that we came up with the best possible solution.
I made sure to keep these insights in mind to make sure that we came up with the best possible solution.
Before transitioning into hi-fis, I spent a lot of time looking through the mid-fis from the previous semester. I analyzed main screens for each user group to understand what had been done, and what should be improved upon. In addition, I read over past feedback from our partners. As a result, I proceeded with a clear vision of the design decisions that were necessary to focus on.
My review of the current mid-fidelity designs resulted in several main takeaways that I brought with me while designing hi-fis. These takeaways are:
1. Whitespace requires balance
Some of the mid-fidelities had too much whitespace, which threw off the visuals. Moving into hi-fis, I wanted to experiment with how to better incorporate whitespace (the appropriate amount).
2. Hierarchy and structure are key
Maintaining hierarchy makes designs cleaner and clearer for the user. Some mid-fis had less of a hierarchical structure, which made the content harder to skim over.
3. Focus on the details and "lesser-known" features
Going into hi-fidelities, I wanted to focus on making design decisions about smaller features desired by our clients; for example, the duplication of events. This would increase convenience and utility, which is the goal.
Once I finished my mid-fi analysis, I moved onto beginning hi-fidelity designs. This was an incredibly iterative process, and many versions were explored. A lot of time was spent at this stage, but it was worth it; the final designs were well-thought out and our partners were happy.
On the events page, volunteers and supervisors can access their upcoming commitments. We explored two different options for how to organize event cards and display them to users.
We chose Option 2 (timeline layout) because it more clearly displayed the chronological order of events. While more events are visible in Option 1, I thought that the timeline had more explicit calls to action for the user. The day an event occurs, volunteers (and supervisors) are encouraged to view the event details and prepare for participation.
Because LFBI has many recurring events, it was necessary for supervisors to have a simple way to create repeating volunteer opportunities. This would be more efficient, preventing users from creating each event from scratch. We developed 3 main iterations; two were focused on duplication during event creation, while the last allowed duplication after an event was created.
In the end, I determined that Option 3 would be the best choice. It was feasible for developers, and made it easier for event creators to handle their current events. Our partners emphasized the importance of being able to quickly duplicate ongoing events; because they have a set number of events with set itineraries, it made more sense to just provide inputs for new dates and times.
Once we developed a more set design system for our hi-fidelities, we also spent time reviewing the structure of the current pages. One thing that stood out to me was the volunteer profile page, which, in its current state, was organized into four "tabs." While these created a clear sectioning of content, it felt too nested to me; full usage of the page required unnecessary clicks.
The final version that I designed kept the clear sectioning of the tab layout while decreasing the number of clicks for users. This was a page that admin and supervisors needed to easily navigate, thus making the change from the mid-fi structure was essential and impactful.
Over the semester, we also thought about how to handle the whitespace on each page. Throughout the design decisions above, there is a gradual transition to more effective page sectioning that reduced whitespace while still providing "breathing room" for the content. By focusing on this aspect of the designs, the website moved from looking more "elementary" to professional and sleek.
Our final design gives volunteers, supervisors, and administrators a simple way to manage their responsibilities at Lagos Food Bank Initiative. Instead of manually signing up for events, volunteers can scroll through and digitally register. Instead of creating events for every new instance, supervisors can duplicate events—this gives time back to help events run smoothly. Finally, administrators can more easily provide reference letters to hardworking volunteers—this reduces the amount of time that volunteers have to wait, while eliminating the strain of looking over hundreds of paper records.
Lagos Food Bank Initiative was the first project that I worked on for Cornell Hack4Impact. Before this, I didn't have much "real-world" experience working on a cross-functional team and regularly communicating with clients. It's safe to say that I learned a lot, and while it is difficult to focus on just a few takeaways, here are some highlights:
A big thank you is due to my fellow designers Bella and Mika for guiding me through my first semester; I'd also like to thank the developers and, of course, the clients! I loved working with you all ⭐️
And thank you for reading!