Tavola
A menu that shows you how big the dish actually is, before you order it.
Open it
The interesting part is not the AR. It is portion transparency. Menu photography is shot to flatter, so the gap between the picture and the plate is where complaints come from. If a guest can see the real size, weight and how many people it serves before ordering, that argument does not happen.
Scan the table code
A QR code on the table opens the menu. Nothing to install.
Tap a dish
The menu is plain and mobile-first, with the portion facts on the card itself.
See it at true size
The dish appears on the table in front of you at real-world scale, through the phone camera.
It is a full app rather than a demo page. Restaurants sign in, add and reorder dishes, upload the models, and print a QR code per table. Every AR launch is recorded, which is the number that tells you whether guests actually use it or just tap once out of curiosity.
The AR itself leans on model-viewer, which hands off to Scene Viewer on Android and Quick Look on iOS. That was a deliberate choice over building the viewer myself. Native handoff gets accurate real-world scale and lighting for free, and on a phone at a dinner table that matters more than control over the render.
Heads up: it runs on demo data. The dishes are examples and the models are stand-ins rather than real scanned food, so treat the portions as a demonstration of the idea.
- Built with
- Next.js, TypeScript, Tailwind
- Data
- Prisma, PostgreSQL
- 3D and AR
- model-viewer, Scene Viewer, Quick Look
- Role
- Sole developer
- Live at
- tavola-menu.vercel.app