Reality Food

AR menus for restaurants. Diners scan a QR code, open the menu in their phone browser and view dishes as true-to-scale 3D models on their table.

Run locally

npm install
npm run dev

• Demo menu: http://localhost:3000/demo-bistro
• Dev QR codes (scan from a phone on the same Wi-Fi): http://localhost:3000/qr

Demo assets

The prototype uses illustrated photos and simple 3D models generated by a script. Models are in meters, sized to each dish's plateDiameterCm.

npm run demo-assets

Add a real dish (phone scan)

Scan the plated dish with RealityScan ("AR guidance mode"), export .glb, measure the plate with a ruler, then:

npm run import-model -- scan.glb --plate 28 --out <restaurant>/<dish-id>

It finds which way is up, scales the plate to exactly 28 cm, sets it on the table and compresses it. Details: .claude/skills/add-dish/SKILL.md.

True size

Every model must match the plate diameter stored for its dish (within 0.5%), sit exactly on the table and stay under 5 MB:

npm run check-models

npm run demo-assets runs this check automatically. Models are Draco-compressed; the decoder is self-hosted in public/draco.

Languages

English and Spanish. URLs never include the language (printed QR codes stay the same): proxy.ts picks the saved EN/ES choice, then the phone's language, then English, and rewrites to /en/... or /es/.... UI text lives in lib/i18n/dictionaries.ts; dish translations live in the restaurant data.

AR

• Android (Chrome, WebXR): our own AR in lib/ar/follow-ar.ts. The dish follows the center of the screen on the table, "Place here" pins it with an anchor, and a ruler shows the measured size in cm. If no table is found in 4 s, the dish is shown in front of the phone until the table is detected.
• iPhone: Apple AR Quick Look (fixed true scale; Apple doesn't let websites make the dish follow the camera).

See CLAUDE.md for product rules and conventions.