Flavorspace
A premium, Michelin-star digital menu experience.
Overview
A state-of-the-art, premium digital menu experience designed for high-end culinary concepts. It replaces traditional lists with a dynamic, sensory-driven UI that physically reacts to the active dish. The application features complex glassmorphism, fluid bottom sheet architectures for mobile, and a highly interactive swipe-to-confirm checkout flow.
Flavorspace was built to explore how high-end restaurant menus can be reimagined for the digital era. Instead of sterile lists, it aims to create an immersive, sensory-driven experience that reflects the quality of Michelin-star dining.
The entire UI is built on a dynamic sensory engine. When a dish is selected, CSS variables update globally, causing radial gradients, buttons, and ambient glows to instantly shift to match the dish's exact color profile. Extensive use of backdrop-blur provides a luxurious glassmorphism effect.
To ensure the premium feel extended to mobile, standard responsive stacking was abandoned. Instead, selecting a dish on a phone triggers a fluid, framer-motion powered Bottom Sheet overlay. The checkout flow was similarly elevated, replacing standard forms with a physics-based 'Swipe to Confirm' gesture.
Stack
UI / Frontend
Animation / 3D
How it works
Explore
Users navigate a beautifully laid out grid of high-end dishes.
Select
Tapping a dish opens the Signature panel (a Bottom Sheet on mobile), dynamically changing the entire app's color theme.
Add to Cart
Users add the dish to their order, managing quantities in a sleek slide-out Cart sidebar.
Checkout
A full-screen glass overlay prompts the user for their Table Number and completes the order via a Swipe-to-Confirm slider.