Ouvre /kiosk et /tv/TEST, passe une commande, puis marque-la prête depuis le KDS pour vérifier que le son retentit sur la TV aussi Ajoute un...
Generated Prompt
## APPLICATION OVERVIEW This project is a web application designed for a kiosk system that allows users to place orders and manage their status through an interactive interface. The application will also integrate with a TV to provide audio feedback and feature automatic theme adjustments based on the time of day. ## CORE FEATURES 1. **Order Placement**: Users can easily place orders through the kiosk interface, selecting items and customizing their choices. 2. **Status Management**: Staff can mark orders as ready from the Kitchen Display System (KDS), triggering audio alerts on the connected TV. 3. **Automatic Return to Menu**: After 15 seconds on the confirmation screen, the kiosk automatically returns to the main menu to enhance user experience and avoid locking. 4. **Dynamic Theme Adjustment**: The application will automatically switch between light and dark themes based on the time of day, ensuring optimal visibility and comfort. 5. **Real-time Notifications**: Users will receive notifications on the kiosk and TV when their order status changes, keeping them informed without needing to check constantly. ## DESIGN SPECIFICATIONS - **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography - **Color Mode**: Light theme with dark text on light backgrounds - **Primary Color**: #1978E5 (accent for buttons, links, highlights) - **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements - **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs - **Layout**: A simple vertical layout with a prominent header for the logo and title, followed by the order interface, status notifications, and an easy-to-navigate menu. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript - **Styling**: Tailwind CSS - **UI Components**: shadcn/ui - **State Management**: Redux or Context API for managing order states and UI interactions. ## IMPLEMENTATION STEPS 1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui for UI components. 2. **Create Kiosk Interface**: Develop the main components for the order placement screen, including selection options and a confirmation button. 3. **Implement Status Management**: Integrate functionality to mark orders as ready and trigger notifications on the TV using WebSocket or similar technology for real-time updates. 4. **Add Auto Return Feature**: Implement a timer that triggers navigation back to the main menu after 15 seconds on the confirmation screen. 5. **Dynamic Theme Logic**: Create a utility to check the current time and apply the appropriate theme (light/dark) to the application. 6. **Testing**: Conduct thorough testing of all features, ensuring responsive design and smooth user interactions. ## USER EXPERIENCE Users will begin by placing an order through an intuitive interface that allows for easy navigation and selection. Upon confirmation, they will receive an immediate visual and audio notification when their order is ready, ensuring a seamless experience. The automatic return feature keeps the kiosk functional and user-friendly, preventing it from getting stuck on any screen. Additionally, the dynamic theme adjustment enhances comfort based on environmental lighting conditions. This application aims to provide a modern, efficient ordering system that enhances the user experience while minimizing the potential for user error or frustration.
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
