ScrapSnap AI

About the project

ScrapSnap AI helps restaurants and cafeterias reduce food waste by turning quick phone photos of discarded food into structured insights, trends, and actionable suggestions.

Inspiration

Working as a server, I see a lot of food thrown away at the end of shifts—uneaten sides, oversized portions, and items that went stale. I wanted a fast, low-friction way to capture what’s wasted and use AI to turn that into decisions that actually reduce loss.

What we learned

Collaboration: My partner focused on web development; I focused on GitHub workflow, issue tracking, and debugging across frontend and backend. Debugging fundamentals: Proxying, CORS, port conflicts, and environment config across two services. AI integration: Prompt design for vision models, handling uncertain images, and enforcing JSON responses. Data consistency: Using image hashing to keep duplicate analyses aligned and reduce noisy results. How we built it Stack: React (Vite) + Tailwind CSS frontend; Node.js/Express backend. AI: Google Gemini Vision (with model fallbacks and strict JSON parsing). Data: JSON file-based storage (simple, robust for local demos).

Features:

Upload image → AI identifies items, condition, estimated weight/value, and confidence. History with photos and per-item details; delete single entry or clear all. Analytics: trends, top wasted items, category breakdowns. Suggestions: Uses the last 3 entries to surface pattern-based actions (portion, storage, menu tweaks). Safeguards: Disclaimers and “needs better photo” prompts when confidence is low. Distinct determination between cartoon/fake food versus real food.

Challenges

Gemini vision setup: Model naming changed across releases; we implemented dynamic model selection and graceful fallbacks. API key management: Handling missing/invalid keys with clear errors and non-blocking UX. Port conflicts and proxies: Intermittent EADDRINUSE/ENOBUFS during dev; solved with better startup flow and proxy timeouts. Parsing AI output: Enforcing valid JSON from the model and sanitizing occasional markdown-like responses. Consistency across duplicates: Ensuring repeated photos yield stable values via SHA-256 image hashing and alignment logic.

Built With

• copilot
• css
• cursor
• gemini
• html
• javascript
• lovable
• react
• tailwind
• vite