jade-bot

Introduction

The purpose of this System Requirements Document (SRD) is to outline the specifications and requirements for the "jade-bot" project, a Premium Quick Commerce Grocery Delivery Platform. This document will serve as a guide for the development team to create a full-stack grocery delivery platform with an original brand identity, UI/UX, and design, specifically tailored for the Bhatapara region in India.

System Overview

The "jade-bot" project, branded as "Shivam Mart," aims to provide a fast and efficient grocery delivery service in Bhatapara, Baloda Bazar, Chhattisgarh, India. The platform will not maintain its own inventory but will facilitate the purchase and delivery of products from local shops. The system will include a customer-facing website, an admin dashboard, and a delivery management system, all integrated to ensure seamless operations.

Functional Requirements

• As a Customer, I should be able to search for products to find what I need quickly.
• As a Customer, I should be able to browse product categories to explore available items.
• As a Customer, I should be able to view product details to make informed purchasing decisions.
• As a Customer, I should be able to add products to a cart for purchase.
• As a Customer, I should be able to create a wishlist to save items for future purchase.
• As a Customer, I should be able to proceed to checkout to complete my purchase.
• As a Customer, I should be able to sign up and log in to manage my account.
• As a Customer, I should be able to view my order history to track past purchases.
• As a Customer, I should be able to track my live orders to know the delivery status.
• As a Customer, I should receive notifications about my orders and offers.
• As a Customer, I should be able to manage my profile and saved addresses for convenience.
• As a Customer, I should be able to contact support for assistance.
• As an Admin, I should be able to securely log in to manage the platform.
• As an Admin, I should be able to view and manage today's orders to ensure timely processing.
• As an Admin, I should be able to manage product inventory, including adding, editing, and deleting products.
• As an Admin, I should be able to manage orders, including accepting, rejecting, and tracking delivery status.
• As an Admin, I should be able to manage delivery partners and assign orders for delivery.
• As an Admin, I should be able to view sales and revenue reports to monitor business performance.
• As an Admin, I should be able to manage customer information and support requests.
• As a Delivery Partner, I should be able to view assigned orders and update delivery status.

User Personas

• Customer: Individuals using the platform to purchase groceries and other essentials.
• Admin: The business owner or designated personnel managing the platform's operations.
• Delivery Partner: Individuals responsible for delivering orders to customers.

Core User Flows

• Customer searches for products -> adds to cart -> proceeds to checkout -> completes payment -> receives order confirmation -> tracks order -> receives delivery.
• Admin logs in -> views today's orders -> manages inventory -> assigns delivery -> tracks delivery status -> updates order status.
• Delivery Partner receives order assignment -> picks up order from local shop -> delivers to customer -> updates delivery status.

Visuals Colors and Theme

• primary: #1A73E8 (Deep Blue)
• primary_light: #E8F0FE (Light Blue)
• secondary: #FF6F61 (Coral)
• accent: #FFD700 (Gold)
• highlight: #FFA500 (Orange)
• bg: #FFFFFF (White)
• surface: rgba(250, 250, 250, 0.8)
• text: #333333 (Dark Gray)
• text_muted: #777777 (Gray)
• border: rgba(200, 200, 200, 0.5)

Signature Design Concept

The homepage of Shivam Mart will feature an interactive 3D market street scene using @react-three/fiber and @react-three/drei. Users can navigate through a virtual street where each shop represents a product category. Hovering over a shop will display a preview of featured products, and clicking will take the user to the category page. The scene will transition smoothly with animations powered by gsap for a dynamic and engaging user experience. The design will include subtle animations of people walking and vehicles passing by to create a lively atmosphere.

Interaction Model & Motion Direction

The landing page will utilize a "parallax" interaction model, creating a layered depth effect as users scroll through the page. Decorative elements like floating grocery items and atmospheric animations will move at different speeds, enhancing the storytelling aspect of the platform. Internal pages such as the dashboard and profile settings will adopt a "static" model for clarity and ease of use.

Non-Functional Requirements

• The platform must support high traffic and ensure fast loading times.
• It must be mobile-first and responsive across all devices.
• Secure access control must be implemented to protect user data.
• The system should be scalable to accommodate future expansion to other cities.

Tech Stack

• Frontend: React + Vite, Tailwind CSS
• Backend: Node.js + Express
• Database: MongoDB
• Authentication: JWT
• Image Storage: Cloudinary
• Payments: Razorpay
• Deployment: Vercel + Render + MongoDB Atlas

Assumptions and Constraints

• The platform will initially operate only in Bhatapara.
• No inventory will be maintained; products will be sourced from local shops.
• The system must comply with local regulations and data protection laws.

Glossary

• Quick Commerce: A business model focused on rapid delivery of goods.
• JWT: JSON Web Tokens, a compact, URL-safe means of representing claims to be transferred between two parties.
• Parallax: An effect where background images move slower than foreground images, creating a sense of depth.

This document outlines the comprehensive requirements for the "jade-bot" project, ensuring a robust and user-friendly grocery delivery platform tailored for the Bhatapara region.