TriClair — Know which bin, and why

Inspiration

Most recycling contamination is not carelessness — it is uncertainty at the bin. Is a greasy pizza box recycling or compost? A paper coffee cup feels like paper, so it goes in the blue bin — and contaminates the load, because it is plastic-lined. TriClair answers that exact moment of doubt, with the local rule, not a generic guess.

What it does

• Take or upload a photo of a waste item. TriClair classifies it in your browser (TensorFlow.js MobileNet — no photo ever leaves the device) and maps it to the correct stream for Longueuil, Québec: blue recycling, brown compost, grey garbage, or ecocentre drop-off.
• Every answer shows the rule behind it and a confidence level.
• A condition toggle (clean / soiled / broken) changes verdicts where condition is what actually decides the bin — broken glass flips from recycling to wrapped garbage, and a greasy pizza box flips from recycling to compost.
• When the model is unsure, TriClair says so and offers a manual material picker instead of inventing an answer. An honest "uncertain" is worth more than a confident error that contaminates a whole bin.
• An impact journal counts every sort by stream, tracks the uncertain rate, and exports the log as JSON — the project's effect is measurable from day one.

Theme paragraph — Rethinking Waste

The waste problem we target is household sorting errors that contaminate recycling and compost streams — one greasy box or plastic-lined cup can send an otherwise clean load to landfill. TriClair attacks the cause: the moment of uncertainty at the bin, answered with the local rule. We measure success directly in the app: the journal counts sorted items per stream, the share of verdicts delivered with a cited rule, and the uncertain rate (items the app refused to guess). Targets for a real deployment: uncertain rate under 15 % and a falling correction rate as the rule base learns the items a neighbourhood actually throws away.

How we built it

A static site — no backend, no account, no paid API: index.html + app.js run MobileNet classification entirely client-side, with TensorFlow.js, the MobileNet package and the model weights all vendored in the repo, so the app even works fully offline. rules.js is a pure, separately tested rules engine (item × condition → bin + rule text) encoding Longueuil/Montréal sorting rules, including the classic traps (soiled pizza box → compost, coffee cup → garbage, plastic film → garbage, electronics and batteries → ecocentre, broken glass → garbage, wrapped). Node tests (146 assertions) cover the mappings, the traps in both conditions, and the uncertain logic. The impact journal uses localStorage and exports JSON.

Challenges & honest limitations

MobileNet was trained on ImageNet, not on waste: some items are misread or unknown — that is exactly why the uncertain path and the manual material picker are first-class features, not afterthoughts. The rules are Longueuil-specific by design; another city means another rule file, not another app. Next steps: a small waste-specific fine-tuned model, more municipalities, and French UI (the rules engine already separates rule text from logic).

For judges — how to test (2 minutes)

1. Open the live app: https://samehbenhouria.github.io/triclair/ (or clone the repo and run: python3 -m http.server 8000, then open http://localhost:8000). The photo model loads from files inside the repo — no network calls, it even works offline.
2. Click a sample photo (plastic bottle, beer bottles, banana, phone) or upload your own:
   • Plastic bottle → Blue recycling, rule cited.
   • Beer bottles with condition "Clean" → Blue recycling; switch condition to "Broken" → Grey garbage (wrapped, safety rule).
   • Banana → Brown compost. Phone → Ecocentre drop-off.
   • The "unknown" sample → Uncertain verdict + manual material picker (never a guess).
3. Check the impact panel at the top: counts per bin and the uncertain rate update with every sort; "Export journal (JSON)" downloads the log.
4. Rules engine tests (no dependencies): node test/rules.test.js → 146 assertions, all pass.

Built With

• css3
• html5
• javascript
• localstorage
• mobilenet
• node.js
• tensorflow-js