Latte Coffee Web

Our Link Production: https://latte-coffee-web.vercel.app/

Team Member

Lê Bảo Khanh - 23020001

Nguyễn Tiến Dũng - 23020008

Overview

"Latte Coffee" is a modern web app for coffee shops that enables customers to order drinks digitally at their tables. It features a user-friendly interface, customizable beverage options (size, milk, temperature, toppings), and a smart cart for real-time order tracking and adjustments. With a minimalist design, smooth animations, and optimized UX, Latte Coffee offers a seamless and efficient order management solution for contemporary cafés.

Main Feature

• Homepage
• Modern and intuitive interface with a warm, coffee-themed design
• Dynamic product categories: Featured, New Arrivals, Promotions, Best Sellers
• Quick access to table selection and menu browsing
• Real-time cart preview and order status

• Table System
• Digital table management with unique table IDs
• Easy navigation between tables
• Real-time order tracking per table
• Seamless transition between table view and menu

• Menu Features
• Comprehensive beverage categories: Coffee, Milk Tea, Matcha, Fruit Tea
• Detailed product information including:
  • Product images and descriptions
  • Price and promotional offers
  • Preparation time
  • Customer ratings and reviews
• Advanced filtering and sorting options:
  • By category
  • By price range
  • By popularity
  • By preparation time

• Product Customization
• Size options (S, M, L)
• Milk type selection (Whole Milk, Almond Milk, Soy Milk, etc.)
• Temperature preference (Hot/Iced)
• Additional toppings and add-ons
• Real-time price calculation based on selections

• Shopping Cart
• Dynamic cart management
• Real-time price updates
• Quantity adjustment
• Item removal
• Order summary
• Checkout process

• Order Management
• Order history tracking
• Order status updates
• Easy reordering functionality
• Order modification capabilities

• User Experience
• Responsive design for all devices
• Smooth animations and transitions
• Intuitive navigation
• Clear product categorization
• Easy-to-use interface
• Real-time updates and notifications

• Product Detail Page
• Comprehensive product information
• Customization options
• Related product suggestions
• Customer reviews and ratings
• Preparation time and ingredients
• Special offers and discounts

• Search and Filter
• Advanced search functionality
• Multiple filter options:
  • By category
  • By price
  • By popularity
  • By preparation time
• Sort options:
  • Price (high to low, low to high)
  • Popularity
  • Newest
  • Preparation time

• Basic Functions
• Beautifully designed homepage with categorized products
• Advanced search and filter capabilities
• Shopping cart management
• User account management
• Order history tracking
• Detailed product pages with customization options
• Similar product suggestions

## Screenshots

Basic

User on web

Home

Products in the home page

Product details

Menu

Cart Item

Checkout

Confirm

Complete order

Footer

Users on mobile - when they scan QR code

Detail page on mobile

Checkout page on mobile

confirm page on mobile

Complete page on mobile