Inspiration
I eat at hawker centres almost every day, but every calorie app I tried only knew burgers and salads — nothing knew what laksa or char kway teow costs my waistline. I wanted a nutrition buddy that speaks hawker centre: Singlish, spice levels, and real HPB-average numbers for the dishes I actually eat.
What it does
HawkerLens SG is a zero-install web app: snap/upload your lunch photo (stays on your device), pick from 12 real SG hawker dishes, and instantly see calories, macros, allergen flags, spice level, a healthier swap with kcal saved, and a cheeky Singlish tip. Full EN/简体 toggle, search filter, and it remembers your last dish. Works fully offline.
How I built it (plan-first with the Learn Skill Pack)
I installed the Devpost Learn Skill Pack (npx skills add challengepost/learn-ai-basics --all -y) and worked the flipped-interaction loop: interview first, code second. The skills guided scope.md (kernel: hawker-specific intelligence with Singlish soul), prd.md (single-page journey, 12-dish DB, EN/简体), and spec.md (static-only, vanilla JS, no backend). Only then did I build: index.html + styles.css + app.js + data/dishes.json. All three planning docs ship in the public repo under devpost/.
Challenges
Keeping the demo bulletproof with zero backend: nutrition "recognition" is a curated local DB instead of a flaky vision API, and the app embeds the dish data as a fallback so it works even over file://. Cutting scope hurt (no Malay/Tamil, no history) but the POC boundary held.
What I learned
Planning before building genuinely changes the output: the interview forced one kernel, one loop, one afternoon. Explaining the idea out loud surfaced the allergen and language features before a line of code existed. I will reuse scope → PRD → spec on every project after this.
Log in or sign up for Devpost to join the conversation.