NMI 4110 Capstone: FAWN

Danielle Hodges
5 min readMay 9, 2023

--

Finding and Working with Nonprofits (FAWN) is an app powered by AI that helps connects users to their local nonprofit organizations.

Spring 2023

Role: Researcher, UI Design, Assistant Designer, Website Developer, Video Editor

Project Overview:

Our goal was to create a way for users to connect with their local nonprofits and donate their time and items directly to people in need without the hassle of researching. Our final product consist of an app and a website. Our website prototype (made on Figma) is where local nonprofits are able to submit any promotions or events they have and items they are need of. The admin of FAWN then update this information onto the app we created (Using XCode, Swift UI, Mobilenetv2, and Firefox). Our app has a home feed for promotions, a browse tag containing all the local nonprofits and items that can be donated, an AI Image upload that will fill in what the item is and generate a list of nonprofits that accept that item, and a profile page where the app stores items that aren’t currently being accepted and will notify you when an organization is in need of the item.

Software: XCode, Swift UI, Mobilenetv2, and Firefox

The Challenge:

The challenges this project address that too much ends up in a landfill every year. 84% of clothes end up in a landfill and incinerator every year, instead these items need to be donated to people who will usr them. There are that many people don’t have the time or know where to start when it comes to research nonprofits or places to donate. So we wanted to eliminate the guesswork of this research. Another challenge is we wanted this app to be easy to use for any user no matter the age or their ability to use modern technology. This is why we included AI, so whoever user our app can simply take a picture and not have to worry about the rest. The app will automatically fill out the required information and provide the user with a list of organizations accepting their item.

The Solution

FAWN is an app that works to eliminate these problems. FAWN is an easy and accessible way for anyone to use and find local nonprofits that are accepting donations. If you have an item you want to donate you can take a picture of the item and the AI will find what the item is and provide the user with a list of nonprofits accepting that item. Here is a screen capture of our app’s AI image recognition. Another problem our app addressed was helping nonprofits connect to their community. We solved this problem by creating a home feed where local nonprofits can post new items they need or any promotions going on. Since FAWN’s admin are maintaining the app, we need an easy and fast way for local nonprofits to submit their information to us. So I created a mockup of the website they would use to submit promotions, items needed/no longer needed, and updates on their organization’s profile page.

(Left) FAWNS AI Image Recognition (Middle) Home Feed (Right) Mockup of Nonprofit Submission Webpage

One of my roles was to design the wireframes for the app. Before I started working on the wireframes I created the user flow and realized we had too wide of a scope. I made the recommendation that we get rid of our community page (a place where users can converse) to focus on our main goals were met and the team agreed. Then I made the UI Designs on Figma, while keeping in mind we need a clean and easy to use AI as this app will be used by people of all ages. Once the designs were done I worked with the developers to implement the designs into the app and answer any questions they had.

Wireframes Link to Figma Below

Another contribution I made to the team was how we were going to market our app. Since we decided our app would be local to Athens, Georgia I thought of ways Athenians got their news. From there I pitched the idea of making a Flagpole Article (a local newspaper) and flyers for downtown (a way local businesses and artist advertise). Nicole wrote the Flagpole Article and I formatted it and designed it in InDesign.

FAWN Flagpole Article

Lastly, we needed a place to house our project, checkpoints, and final deliverable. We were given a template of the webpage and I modified the design to match FAWN’s brand and added all of our project’s work in the HTML file through Visual Studio Code. I also integrated all of our Visual Design Guide into our website which included packaging fonts to be downloaded, embedding our VDG into our websites, and linking appropriate documents.

FAWN Project Webpages, Link Below

Results

FAWN has been prototyped out and is functional. It still is not market ready and needs to be iterated further. But the app is abled to be demoed and can match the user with a local nonprofits accepting what they are looking to donate.

Project website: https://projects.nmi.cool/2023//nmc/nonprofitathens/

UI Designs and Website Prototype: https://www.figma.com/file/fgfXQkhCQRDeTxKm8WUtUy/Donation-App-Wireframe?type=design

Flagpole Article:

--

--