overview

In 2022, I joined the Be Good Project and became a part of the team, serving as the product designer for the Banana App.

The Banana App is a tech initiative of the Be Good Project that cut down food waste and fight hunger by connecting businesses with surplus food to those in need, making sure good food feeds people, not bins.

Banana App is preparing for the pre-alpha launch, we designed Admin Portal, Donor App and Client App to help, support, and encourage users to give and accept food.

Role

Product Designer

- Brand Strategist

- Interface Design

- Process Mapping

- Prototyping

- Usability Testing

UX Writer

Duration

2022/06 – 2022/12

Goals & Challenges

Our goal and main challenge is ensuring food safety and quality while keeping the app accessible and engaging for users. Optimizing workflow to quickly move food from donors to recipients and navigating food donation regulations adds complexity.

Define

Based on previous team research and decisions, I focused on analyzing the Admin Portal. I crafted a user persona to pinpoint that the Admin Portal serves for the Banana team to efficiently manage users and control access. The portal needed a visually organized interface with clear data visualization and design hierarchy.

I mapped out the Infrastructure Architecture (IA) to detail the Admin Portal’s structure, showcasing its main features and their organizational flow. I also developed a User Journey to illustrate how the Banana team processes user applications, and a User Flow to demonstrate the steps an admin takes to manage these applications.

Ideate

Together with my colleagues, we collaborated to update and integrate our branding, encompassing aspects such as colors, fonts, interface design, UI, and more. This project marked my first foray into creating a design system, learning how to ensure consistency and coherence across all elements of our brand's presentation.

I designed the homepage and dashboard for Admin Portal, integrating charts to visually represent application statuses and donations. Our goal was clear: to deliver information in a straightforward, visually appealing manner, making it easy for admins to quickly grasp vital data. The use of charts and color highlights was strategic for clarity and emphasis.

My colleagues and I engaged in discussions to craft the interface designs for both the client app and donor app. Throughout this process, we underwent extensive discussions, analysis, and comparisons with similar products on the market, diving deep into what makes our apps unique and user-friendly.

Prototype

Admin Portal is for the Banana team to manage and administer users and control their access in a timely manner. We need an organized visual interface with straightforward data visualization and a clear design hierarchy.

Client App's target audiences include, but are not limited to, people with disabilities or health conditions, poverty-stricken students, low-income families, and seniors. Fresh food and perishable items are rarely given out by food banks due to their short shelf lives and high prices. They instead mostly concentrate on tinned and dry foods, which frequently lack nourishment. On top of that, food banks rely on a large number of volunteers and have specific hours of operation, which limits the opportunities to donate food and receive food assistance. Banana App is a better alternative to the food bank!

Donor App is for users like supermarkets/groceries/producestands/ restaurants/individuals to share and donate food, which helps feed the hungry, support local communities and limits the amount of resources wasted on food production. Instead of throwing wrong orders/ food that is about to expire /surplus food away, users are welcome to put them on Banana App for giving, and also contribute to the fight against hunger as well as climate change.

 Test

I ran usability tests on the Banana App to see if it truly met user needs and offered a good experience. We looked at user ease with tasks like logging in and finding donation opportunities.

Issue #1 Solution: Enhanced the profile page's layout and readability by tweaking color zoning, spacing, and font size, and introduced profile images for a personal touch and visual appeal. Improved spacing elevated the design hierarchy, uniting elements and focusing attention.

Issue #2 Solution: Some users were unsure about pickup locations, leading to the integration of a map alongside the list for clearer visual guidance on where to find food, significantly improving navigation and user satisfaction.

In creating The Banana App, we fused service design's essence with iterative development to make the app as effective and user-centric as possible. Service design guided us to create an app that’s not just useful and easy to navigate, but also desirable and efficient for all—admins managing the platform, donors offering food, and clients seeking donations. This approach ensured the app provided tailored experiences, valuing user feedback and community engagement from the get-go.

As we moved through each design iteration, we focused on prototyping, user testing, and gathering feedback to refine every aspect of the app. This process made donating food, finding donations, and app management smoother and more intuitive. By iterating based on users' actual needs and responses, we made sure every part of the app served its purpose effectively.

Iterate

Learning

My first team experience in a small company was enlightening, teaching me the power of breaking tasks down, planning well, and communicating clearly. Valuing and sharing ideas openly and embracing feedback were key to my growth. I learned to wear multiple hats, align with engineers, prioritize users, and establish a design system for consistent UX and design. This journey, marked by teamwork and a focus on user needs, profoundly shaped my design and collaboration approach.