GreenLens

Scan smarter. Choose greener.

Comment

About GreenLens

Inspiration

We wanted to answer: What's the environmental cost of what I'm buying? Inspired by Open Food Facts and emissions research, we built a barcode-based sustainability checker with challenges and badges to make greener choices tangible.

What it does

  • Scan or search products by barcode/name to get carbon footprint (kg CO₂e) and eco-score (A–F).
  • See contextual comparisons (e.g. "equivalent to X miles driving") and eco tips.
  • Get better alternatives (lower carbon) when available.
  • Track progress with challenges and badges; view profile and stats.

Uses Open Food Facts plus a rule-based carbon calculator when OFF has no carbon data.

How we built it

  • Frontend: Next.js 16, Tailwind, Shadcn UI, Framer Motion, Zustand. Scan (camera/upload) or search → result page (impact meter, tips, alternatives, challenges).
  • Backend: Next.js 14 API, Prisma, PostgreSQL, NextAuth. Product lookup/search via Open Food Facts; carbon calculator for estimates; scans, challenges, badges, profile stored in DB.
  • Auth: NextAuth (credentials, JWT).

Challenges we ran into

  1. OFF reliability — Timeouts, empty/search shape changes. Fixed with v2 search fallback and minimal results (name, brand, barcode) when full fetch fails.
  2. Missing carbon data — Built rule-based calculator from categories/ingredients/weight so every product gets footprint + eco-score.
  3. Hydration — Radix + browser extensions caused mismatches. Fixed with client-only menu and suppressHydrationWarning where needed.
  4. Search UX — Dropdown closed on empty/error. Fixed with "search done" state and error message in dropdown.
  5. Scan flow — Camera + upload fallback and clearer capture button.

Accomplishments we're proud of

  • End-to-end flow: scan/search → barcode → OFF + carbon logic → clear result with footprint, tips, alternatives.
  • Search always shows something (results, "no products," or error).
  • Carbon + eco-score for every product via OFF + calculator.
  • Challenges and badges for engagement; responsive UI and profile/settings.

UN's SDGs Alignment :

GreenLens aligns with four SDGs:

  • SDG 3 – Good Health & Well-being: We surface Nutri-Score and NOVA so users can choose healthier, less-processed foods.
  • SDG 11 – Sustainable Cities & Communities: By nudging millions of small choices, we reduce the collective footprint of urban consumption.
  • SDG 12 – Responsible Consumption & Production: We make carbon and eco-scores visible, empowering consumers to demand greener products—and giving brands a reason to improve.
  • SDG 13 – Climate Action: Every lower-carbon swap is a micro-action against climate change; tracked over time, it adds up.

What we learned

Full-stack separation (frontend/backend, API, env config); robust OFF integration (shapes, timeouts, fallbacks); carbon modeling (emission factors, eco-score); auth + client state; browser barcode scanning; React/Next hydration and client-only patterns.

What's next for GreenLens

  • OAuth — Google & Apple sign-in.
  • Richer alternatives — Smarter recommendations and filters.
  • Offline / PWA — Cache recent scans for low-connectivity use.
  • More data sources — Beyond Open Food Facts where needed.
  • Impact over time — Dashboards (e.g. carbon saved, category breakdown).
  • Sharing — Share results or badges to invite others.

Built With

Share this project:

Updates