Cobalt-Bakery System Requirements Document

1. Introduction

The "Cobalt-Bakery" project aims to develop a premium full-stack e-commerce website for P B Bake House, a high-end bakery located in Bengaluru, Karnataka. The website will provide a luxurious, modern, and professional online presence, catering to local customers with the potential for future scalability.

2. System Overview

The Cobalt-Bakery website will serve as a comprehensive platform for P B Bake House, offering online ordering, payment processing, and customer management. It will include features such as a custom cake order system, admin panel analytics, and marketing tools, all designed to enhance the customer experience and streamline business operations.

3. Functional Requirements

• As a Customer, I should be able to browse product categories such as Cakes, Bakery, Snacks, and Desserts.
• As a Customer, I should be able to place online orders for bakery products.
• As a Customer, I should be able to use the Razorpay payment gateway for secure transactions.
• As a Customer, I should be able to receive WhatsApp order notifications.
• As a Customer, I should be able to view the bakery's location on Google Maps.
• As a Customer, I should be able to submit custom cake orders with up to 5 reference images.
• As a Customer, I should be able to track my order status.
• As a Customer, I should be able to leave reviews and ratings for products.
• As a Customer, I should be able to access the website on mobile devices.
• As an Admin, I should be able to manage all aspects of the website from the admin dashboard.
• As an Admin, I should be able to view and analyze bakery-specific analytics.
• As an Admin, I should be able to manage product listings, including adding, editing, and deleting products.
• As an Admin, I should be able to manage orders, including viewing, updating status, and processing.
• As an Admin, I should be able to manage customer information and order history.
• As an Admin, I should be able to manage marketing features such as coupons, discounts, and promotional banners.
• As an Admin, I should be able to update website settings, including store information and contact details.

4. User Personas

• Customer: Individuals looking to purchase bakery products online, including custom cakes.
• Admin: Staff responsible for managing the website, orders, products, and customer interactions.

5. Core User Flows

• Customer browses products -> selects items -> adds to cart -> proceeds to checkout -> completes payment via Razorpay -> receives order confirmation via WhatsApp.
• Customer submits custom cake order -> uploads reference images -> selects cake options -> submits order -> receives confirmation.
• Admin logs into dashboard -> views daily orders -> updates order status -> manages product listings -> analyzes sales data.

6. Visuals Colors and Theme

• primary: Matte Black #0F0F0F
• primary_light: Dark Gray #2C2C2C
• secondary: Luxury Gold #D4AF37
• accent: Rose Gold #B76E79
• highlight: Cream #FFF8E7
• bg: Warm White #FAFAFA
• surface: rgba(255, 248, 231, 0.8)
• text: Black #000000
• text_muted: Gray #7D7D7D
• border: rgba(212, 175, 55, 0.2)

7. Signature Design Concept

The homepage will feature an interactive 3D carousel of the bakery's top products using @react-three/fiber. Users can rotate and zoom into each product, revealing detailed descriptions and order options. The background will subtly shift colors from warm gold to rose gold as users interact, creating a luxurious and dynamic browsing experience. The carousel will be complemented by elegant animations using framer-motion, enhancing the premium feel of the website.

8. Interaction Model & Motion Direction

The landing page will utilize a "parallax" interaction model, with layered depth effects as users scroll. Key sections will feature animated transitions and hover effects, providing a polished and engaging user experience. Internal pages, such as the admin dashboard, will adopt a "static" model for clarity and efficiency.

9. Non-Functional Requirements

• The website must be responsive and mobile-friendly.
• The system should handle high traffic efficiently.
• Data security and user privacy must be ensured through secure authentication and payment processing.

10. Tech Stack

• Frontend: HTML, CSS, JavaScript
• Backend: Spring Boot
• Database: MySQL
• Authentication: JWT Authentication, Secure Password Hashing
• Payments: Razorpay Integration
• Image Storage: Pocket

11. Assumptions and Constraints

• The website will initially focus on local delivery and pickup orders.
• The system must be scalable to accommodate future expansion of delivery zones.
• All features must be manageable from the admin panel without code changes.

12. Glossary

• JWT: JSON Web Token, a compact, URL-safe means of representing claims to be transferred between two parties.
• Razorpay: A payment gateway service that allows businesses to accept, process, and disburse payments.
• Parallax: A scrolling technique where background images move slower than foreground images, creating an illusion of depth.