grand-modern

bySukhmanveer Singh

Build a modern, professional, responsive restaurant Customer Relationship Management (CRM) web application for a Vietnamese restaurant called “Cơm Nhà”. PROJECT PURPOSE: This is an ICT303 university project focused on improving customer information management and customer relationships for a real restaurant. The system should help authorised restaurant staff recognise returning customers, view customer history, manage reservations, record useful customer notes, and track birthdays/anniversaries. IMPORTANT: Do NOT create a generic restaurant ordering website. Do NOT focus on food ordering or online shopping. Build a professional INTERNAL RESTAURANT CRM / CUSTOMER MANAGEMENT DASHBOARD. DESIGN: Use the attached dashboard screenshot as visual inspiration only. Create an original design rather than copying it exactly. Style: - Modern SaaS dashboard - Clean and professional - Premium restaurant feel - White/light background - Orange/gold accent colour inspired by the restaurant industry - Rounded cards - Subtle shadows - Clean typography - Plenty of whitespace - Responsive design for desktop, tablet and mobile - Professional icons - Smooth hover states and transitions - Accessible colour contrast - Use Vietnamese-inspired visual details subtly, without making the interface look cluttered APP NAME: Cơm Nhà CRM SIDEBAR NAVIGATION: 1. Dashboard 2. Customers 3. Reservations 4. Visit History 5. Occasions 6. Analytics 7. Reminders 8. Staff 9. Settings TOP NAVIGATION: - Global search - Notifications - Dark/light mode toggle - User profile - Logout DASHBOARD: Create a professional overview page containing: Summary cards: - Total Customers - Returning Customers - Today's Reservations - Upcoming Occasions Example values: Total Customers: 1,248 Returning Customers: 684 Today's Reservations: 32 Upcoming Occasions: 14 Add: - Customer activity chart - New vs returning customers - Monthly customer visits - Recent customer activity - Today's reservations - Upcoming birthdays - Upcoming anniversaries RECENT CUSTOMERS TABLE: Columns: - Customer - Phone - Last Visit - Total Visits - Favourite Dish - Occasion - Status CUSTOMERS PAGE: Create a complete customer management interface. Features: - Search by customer name or phone - Filter customers - Sort customers - Add Customer button - Edit Customer - Delete Customer with confirmation - View customer profile - Pagination Customer fields: - Customer ID - Full Name - Phone - Email - Date of Birth - Birthday - Anniversary - Number of Visits - Last Visit - Favourite Dish - Dietary Preferences - Notes - Created Date - Updated Date CUSTOMER PROFILE PAGE: Create a detailed customer profile. Show: - Customer name - Contact information - Total visits - Last visit - Favourite dish - Birthday - Anniversary - Customer notes Add a Visit History section showing: - Date - Number of guests - Meal type - Table number - Amount spent - Notes Add a Notes section where authorised staff can add useful customer-service notes. RESERVATIONS PAGE: Create a reservation management page. Features: - Calendar view - Daily reservations - Upcoming reservations - Search customer - Add reservation - Edit reservation - Cancel reservation Reservation fields: - Customer - Date - Time - Number of guests - Table - Occasion - Special requests - Status Statuses: - Confirmed - Pending - Completed - Cancelled When a reservation is connected to an existing customer, automatically display their customer history. VISIT HISTORY: Create a page showing all customer visits. Columns: - Date - Customer - Guests - Meal - Table - Amount - Notes Allow filtering by: - Date - Customer - Meal type - Number of guests OCCASIONS PAGE: Create a birthday and anniversary management page. Sections: - Upcoming birthdays - Upcoming anniversaries - Today's occasions - This month's occasions Example: Sarah Nguyen — Birthday — 15 October David Tran — Birthday — 19 October James & Lisa — Anniversary — 22 October Add reminder functionality. REMINDERS: Create a notification/reminder page. Examples: - Sarah Nguyen's birthday is in 7 days - Returning customer has made a new reservation - Customer has not visited for 90 days - Upcoming anniversary reservation ANALYTICS: Create useful customer analytics, not unnecessary financial analytics. Show: - New customers over time - Returning customer percentage - Customer visit frequency - Average visits per customer - Popular occasions - Customer retention - Most frequent customers - Customer visit trends Use professional charts and graphs. STAFF PAGE: Create a staff management interface. Roles: - Manager - Staff Managers can: - View customers - Add customers - Edit customers - Delete customers - View analytics - Manage staff Staff can: - View customers - Add customers - Update customer notes - View reservations - View visit history Implement role-based access control in the UI. PRIVACY AND SECURITY: Because this system stores customer personal information, include privacy-conscious design. Requirements: - Login page - Role-based permissions - Do not expose customer information publicly - Confirmation before deleting customer data - Hide sensitive information where appropriate - Logout functionality - Clear privacy/settings section - Audit-style information showing who updated a record and when LOGIN PAGE: Create a professional Cơm Nhà login screen. Fields: - Email - Password - Remember me - Login button Include: “Cơm Nhà Customer Relationship System” DATABASE: Design the application so it can connect to a real database. Suggested entities: - Users - Customers - Reservations - Visits - Occasions - Notes - Tables Create realistic sample data for demonstration. FUNCTIONALITY: The prototype should feel like a real working application. Implement: - Navigation between pages - Search - Filtering - Add customer - Edit customer - Delete customer - Customer profile - Add reservation - Edit reservation - Reservation status - Add visit - Add notes - Occasion reminders - Dashboard updates - Notifications - Responsive sidebar - Modal forms - Confirmation dialogs If backend/database functionality is supported, implement it. If backend functionality is not supported, create realistic local/mock data and structure the code so a backend can be connected later. IMPORTANT UX REQUIREMENT: The system should be simple enough for restaurant staff who are not highly technical. Prioritise: - Fast customer search - Clear information - Minimal clicks - Simple forms - Clear buttons - Useful alerts - Easy navigation Do not overload the dashboard with unnecessary information. TECHNICAL QUALITY: - Use clean reusable components - Keep code organised - Use meaningful component and variable names - Responsive layout - No broken links - No placeholder lorem ipsum - No unnecessary features - Use realistic restaurant/customer data - Ensure all navigation buttons work - Ensure forms have validation - Ensure delete actions require confirmation FINAL RESULT: Create a polished, realistic CRM dashboard that looks suitable for presentation to a real restaurant manager and university ICT303 assessment. The main goal is: “Help Cơm Nhà staff recognise returning customers and provide a more personalised customer experience through an easy-to-use, privacy-conscious customer information system.”