SnapSort

Melody Ma

Mobile Engineer
Software Engineer
React Native
scan a trash
interface before scanning
user trash sorting report
scan on our teammate
bucky badger octocat
scan a trash
interface before scanning
user trash sorting report
scan on our teammate
bucky badger octocat

Inspiration

Have you ever run into such a situation: you are holding a food-container, standing in front of 4 trash cans that each has a different category labeled on it. You really hope to throw your stuff into the right bin so that you could do a better job in protecting our mother earth, but you are not well aware of or just simply confused about which bin should your item go into. If that sounds like you, you are not alone. Many people struggle with sorting trash in daily life, and there could be simple ways to help them build up the knowledge that will yield great benefits in the long run. Based on this idea, our app aims to provide users this easy tool that they can use to learn and make the right decisions on what kind of garbage are they tossing in a convenient, educational, and fun way.

What it does

This app allows the user to take a picture and submit it and our app using google open CV will tell the user what kind of trash category ( recyclable, compost, hazardous, and trash for now) it belongs to based on our keywords criteria. If they decide to toss it after finding out the result, the item along with its category will be recorded. The user will be able to see the status of their previous tossed trash record in their stats page with data graphics to keep the user engaged and allow them to show it off to friends.

How we built it

React Native, Node.js, Google Cloud Vision, Google Cloud VM, MongoDB, Material UI, Adobe XD.

Challenges we ran into

We met a lot of problems during our integration process. None of our teammates have extensive experience working with React Native. Thus, connecting frontend and backend through simulators gives us various road blockers. One specific interesting problem that we ran into is when the front end tried to send the picture which the user took to the back end, the picture is in a base 64 format. The format is a long string and the backend will not accept it as a POST request and gives us back a 413 error. We eventually found out that it was a default configuration that we need to enlarge to allow the server to accept larger request bandwidth and solved the problem. (and as an addition we are planning on reporting this issue to be added to documentation)

Accomplishments that we're proud of

We are proud of all the research we have done and the result that yielded from it for the project. We have not only planned out functionalities but also thorough design guides. It's also fun to tackle React Native as a framework that no teammates of ours are very familiar with. We also were able to incorporate Google Vision API and link it with our camera to return us the correct results. The team dynamic is great and everyone in our team contributed solid amounts to our final product which is quite exciting. We made the effort in stepping out of our comfort zone and built out the MVP that we envisioned eventually.

What we learned

Teamwork is important. Focusing on the bare minimum version of what we are trying to achieve so that we can stay focused on bigger checkmarks can help us get things done quicker. Sometimes it's a good idea to identify solutions that might be slightly different than our original one and pivot early. Generally, we should not have too many dependencies on our development cycle so that people don't have to wait for each other's tasks to be finished. Seeking help from a mentor is a great idea and do it early. And last but not least get some sleep and food along the journey!

What's next for SnapSort

We would like to add more functionalities to SnapSort to enhance its usability, some examples:
More items identified: Now we can only classify one object at a time. We want to allow the user to have multiple objects identified potentially and select on each thing to see its category
More informative suggestions: If the user identifies say a plastic bag or food box, we can give a more informative suggestion with added recycling-related schema such as telling them if the plastic box contains stains, it's not recyclable and otherwise, it is.
Report: A user report with more educational/meaningful information could be provided based on user data.
PK Mode: There can be a social media aspect introduced so that user can see their friend's statuses regarding their garbage classifications and how much energy have they help save.
We would also like to deploy it to app stores or fine-tune our web version of the interface so that people can use it and we can get user feedback.
Partner With Melody
View Services

More Projects by Melody