A walkthrough of the complete Menura app — from the moment a restaurant owner creates their menu to the moment a diner scans the QR.
Flow 1 · Onboarding
The user creates their entire menu before seeing a registration screen. By the time they're asked to sign up, they've invested 10 minutes and seen their menu rendered — they don't want to lose it.
All wizard data lives in localStorage with 7-day TTL. Photos go to a temporary Supabase bucket. User can leave and return without losing progress.
On Google sign-in, a Server Action migrates all data from localStorage + temp bucket to PostgreSQL + permanent storage atomically.
Before
Required registration before creating the menu. 70%+ drop-off at sign-up.
After
Menu creation first, registration after the 'aha moment' preview.
Users who've already built their menu don't want to lose their work. Sunk-cost works in our favor.
Flow 2 · Public Menu
Native-feeling menu that loads in under 3 seconds on 3G. No app download, no login. Scan → browse with photos, categories, search → swipe detail drawer → order.
Pre-rendered and cached on CDN. Zero DB queries per visit. Revalidates on-demand when the owner edits.
Spring physics, scroll-aware close detection. Skeleton while loading, 300ms opacity fade. key={id} resets between dishes.
Color + font via CSS custom properties. Android status bar matches via dynamic theme-color meta tag per restaurant.
Before
No category chips. Diners scrolled through everything.
After
Horizontal chips with 'Todo' default. Tap to jump to any section.
Field testing at a café with 8+ categories: diners couldn't find desserts.
Flow 3 · CMS Editor
Designed for a restaurant owner editing on their phone with one hand in the kitchen. Auto-save everywhere. No "Save" button. Consistent orange focus rings. Touch targets ≥44px.
No 'Save' button anywhere. Every edit persists immediately with optimistic updates. Toast confirms.
Every editable field: same orange border on focus. border-transparent when idle — zero layout shift.
Description grows with content. rows=1 at rest. No scrollbar, no resize handle. scrollHeight sync on every keystroke.
Before
V1 had a 'Save' button. Users kept asking 'did it save?'
After
Removed all save buttons. Auto-save + toast on every change.
The cognitive load of wondering is worse than just auto-saving.
Features · Multi-Carta & Customization
Separate cartas for breakfast/lunch/dinner with auto-detection. Plus colors, typography, and logo — all free. A strategic decision for adoption in a tough market.
Reads the browser's time, matches against each carta's schedule. Handles midnight-crossing. Diner can also switch manually.
Colors (10 presets + custom hex) and typography (3 themes with live preview) are free. CSS variables, zero build step.
Before
Color and typography were Pro-only ($249/mo).
After
Moved to free. Pro retains: unlimited dishes, no badge, translation, analytics.
Free personalization makes the menu feel 'owned'. Retention increased.
Dashboard · Payments · Sales
Bottom nav with optimistic switching. Stripe-powered upgrade with annual toggle. And the most powerful tool: create a menu for a restaurant, send them a link, they claim it with one tap.
useTransition + optimistic state highlights tabs instantly. 2px progress bar only if nav >100ms.
Toggle defaults to annual ($200/mo vs $249). '🔥 Oferta por tiempo limitado' badge creates urgency without pressure.
Menu invitation: one UPDATE transfers the restaurant with all dishes, photos, and analytics to the new owner.