Inspiration
We noticed how confusing and time-consuming it can be for people with medical conditions or dietary restrictions to read food labels. We wanted to simplify that experience with AI.
What it does
NutriScanAI scans the back of a nutrition label and, based on your health conditions and dietary needs, instantly tells you if the food is safe to consume.
How we built it
We used TypeScript and Next.js for the frontend. Tesseract.js was used for text extraction from the file upload the user does. The Google Gemini API was used to conduct the nutritional analysis and generate a report for the user. The stying was done by Tailwind CSS and CSS modules. User Authorization was done by Firebase Authentication
Challenges we ran into
- Accurately parsing text from varied label formats
- Handling ambiguous ingredient names
- Building a reliable health rule-checking system
- Integrating Gemini's output into a clean UX
Accomplishments that we're proud of
- Successfully scanning and analyzing real-world labels
- Creating a seamless user flow
- Making something that can genuinely help people stay safe and healthy
What we learned
- How to integrate OCR in real-world uses
- How to build an elegant UI/UX around health tech in Tailwind CSS
- How to connect Firebase and API's
What's next for NutriScanAi
- Add barcode scanning and live camera OCR
- Support for multiple user profiles (e.g., family members)
- Partner with health/nutrition APIs for deeper insights
- Mobile app version
Built With
- css
- firebase
- gemini
- html
- javascript
- next.js
- tailwind
- tesseract
- typescript
Log in or sign up for Devpost to join the conversation.