ZeroCrumb

History page
User Achievements
User account page
Post example
Upload image
Meme generator

Inspiration

We know a lot of people who keep track of the daily calories consumed. They have to calculate their calories manually and input them into an app they are using. This is very inefficient and time-consuming. Our mission is to tackle this annoying part of registering calories to make it more accessible, especially to those users who do not have experience analyzing calories.

What it does

ZeroCrumb has 3 main features. Analyzing food image We leverage the LogMeal API to analyze food images and give users information including calories consumed, calories wasted, and macronutrients. Progress tracking We help users see their progress in a calendar and make their entry information accessible. We also have achievements and a level system that tracks users' total consumption. Social feature We help users post their eating journeys and communicate with one another with likes, comments, and bookmarks. Also, users can use the meme feature to have fun.

How we built it

The project was developed as a full-stack web application. The front end was built using React.js with JavaScript and TypeScript, styled with Tailwind CSS and HTML. Supabase handled the back-end infrastructure, including PostgreSQL database management and authentication. The site was deployed and hosted using Render.

Challenges we ran into

One of the early challenges we ran into was organization. We had a solid base idea of what we wanted to build, but it was not specific. We had different visions of what the final product would look like, and we did not even have a wireframe to visualize/discuss what or what not to include. The ideas were just “we should include this”, without specifying why or where.

Another major challenge we ran into was the use of AI API’s. Throughout the development of this website, we thought it would be a nice idea to include AI API’s for two functions: Meme generator and food calorie analysis. We ran into many failures trying to connect the website to those API’s, ranging from “not enough credits” to “failed to fetch API” errors. Even after reading the documentation, the problems persisted. Eventually, we found out how to solve it.

GitHub problems were also present. All members have a notion of how to use GitHub commands to push and pull changes. However, this experience was limited to personal use. This project forced us to get out of our comfort zone and manage GitHub in a teamwork environment, which is totally different than in a personal environment. Merge, version, and push problems were more present, and we did not know how to solve them right away.

Accomplishments that we're proud of

We’re really happy that we were able to get a fully functioning website that is able to detect nutrition content with a simple upload of an image. Additionally, the posts of meals look professional and allow the app to act as a social hub for people to share their food goal journey.

On top of promoting a healthy lifestyle, our product also promotes sustainability. With our before-and-after analyzer, you can track how much food you started with on your plate versus how much you left over, thus creating a summary of your food waste, so you can become more conscious of your impact on the environment. The app promotes individual health benefits (through tracking calories and macronutrients), social communication (posts, comments, and likes of your daily meals), and a positive environmental impact through waste management.

What we learned

We learned that progress often comes through iteration. When something doesn’t work at first, analyzing it and returning with a revised approach helps us improve the outcome. We also strengthened our understanding of system design, especially how the front end and back end interact. This helped us see more deeply how different parts of an application communicate and function together. We learned the importance of teamwork and adaptability. Each team member brings different strengths and perspectives, which do not compete with one another but instead complement each other and contribute to a stronger overall outcome. Finally, we recognized that the use of AI is not inherently negative. When used responsibly, AI serves as a tool that enhances productivity and supports development. It assists with problem-solving, optimization, and efficiency, but it does not replace critical thinking or the developer’s role in designing and implementing solutions.

What's next for ZeroCrumb

We want to improve existing features so users can get the best experience possible. Specifically, we would like to fine-tune the calorie count algorithm. While it is mostly accurate, if you upload smaller quantities of food, you get a larger-than-expected calorie count.

Additionally, the detected items section that appears when you upload an image sometimes has miscellaneous food items (i.e., you submit a photo of a pizza and it detects a lemon because the background looks like a lemon), so we’d like the detected items to only contain the main meal. We’d like to improve the meme generator to provide more accurate memes. At times, the meme is only a gif of the food rather than a meme, so we’d like to fine-tune it to detect the meme-worthy content :).

The LogMeal food API we currently use has a limit of 20 queries per API key, so in order to scale up our page, it’d be great if we could find an alternative API that allows more queries rather than having to change the API key each time we use up the queries.