System Requirements Document for cosmic-professional

1. Introduction

The project "cosmic-professional" aims to create a modern, professional, and fully responsive online medical store website for Gupta Medical Store, located in Gajraula. The website will facilitate customers in searching, exploring, and ordering available medicines online, while ensuring a clean medical-themed UI with easy navigation.

2. System Overview

The online medical store will serve as a digital platform for Gupta Medical Store, enabling customers to browse and purchase medicines and health products. The system will include features such as product listings, search functionality, customer accounts, and an admin dashboard for inventory and order management. Prescription medicines will require an upload and verification process to ensure compliance with legal requirements.

2a. Product Interpretation and Delivery Boundary

The system will deliver a fully responsive website accessible on mobile, tablet, and desktop devices. It will feature a clean, medical-themed UI with easy navigation. The website will support customer registration and login, enabling personalized experiences and order tracking. Admin and pharmacist roles will have restricted access to manage inventory and verify prescriptions. The system will adhere to legal requirements for prescription medicines, ensuring pharmacist verification before fulfillment.

2b. Source Content Inventory

Not applicable as no explicit content source directive is provided.

2c. Page Content and Component Coverage

Home page

• Information/State: Gupta Medical Store branding, Gajraula location, navigation links.
• Primary Actions: Navigate to product listings, search for medicines.
• Components: Identity strip, search bar, category navigation, store information.
• States: Loading, error, success.

Medicines

• Information/State: Complete product listing, category filters.
• Primary Actions: Search by medicine name, filter by category.
• Components: Product grid, category line, search bar.
• States: Loading, empty, error, success.

Medicine details page

• Information/State: Medicine name, image, price, description, available quantity, manufacturer, related medicines.
• Primary Actions: Add to Cart, Buy Now.
• Components: Medicine details panel, related medicines section.
• States: Loading, error, success.

Cart

• Information/State: Selected products, total price.
• Primary Actions: Proceed to Checkout, update quantities.
• Components: Cart item list, total price display.
• States: Empty cart, error, success.

Login

• Information/State: User credentials input.
• Primary Actions: Register, log in.
• Components: Login form, registration link.
• States: Error, success.

Checkout

• Information/State: Order summary, address, contact details, payment options, prescription upload.
• Primary Actions: Place Order.
• Components: Order form, payment method selection, prescription upload.
• States: Error, success.

My Orders

• Information/State: Order history, tracking information.
• Primary Actions: View order details, track order.
• Components: Order list, tracking status.
• States: Loading, error, success.

Staff Login

• Information/State: Staff credentials input.
• Primary Actions: Log in.
• Components: Login form.
• States: Error, success.

Admin dashboard

• Information/State: Inventory, prices, stock levels.
• Primary Actions: Add, edit, delete medicines.
• Components: Inventory table, price editor.
• States: Loading, error, success.

Admin Orders

• Information/State: Customer orders, order pipeline.
• Primary Actions: Manage orders.
• Components: Order management table.
• States: Loading, error, success.

Prescription Verification

• Information/State: Uploaded prescriptions, verification status.
• Primary Actions: Approve, reject prescriptions.
• Components: Prescription list, verification tools.
• States: Loading, error, success.

3. Functional Requirements

• As a Customer, I should be able to search for medicines by name to find specific products. (explicit)
• As a Customer, I should be able to view detailed information about a medicine, including name, image, price, description, available quantity, manufacturer, and related medicines. (explicit)
• As a Customer, I should be able to add medicines to my cart and proceed to checkout. (explicit)
• As a Customer, I should be able to register and log in to manage my orders and personal information. (explicit)
• As a Customer, I should be able to upload a prescription for prescription medicines and have it verified by a pharmacist. (explicit)
• As a Customer, I should be able to choose between Cash on Delivery and online payment options during checkout. (explicit)
• As a Customer, I should be able to track my orders after placing them. (explicit)
• As a Store Admin, I should be able to add, edit, and delete medicines in the inventory. (explicit)
• As a Store Admin, I should be able to manage prices, stock levels, and customer orders. (explicit)
• As a Pharmacist, I should be able to verify uploaded prescriptions before order fulfillment. (explicit)

4. User Personas

Customer

• Context: A shopper looking to purchase medicines online from Gupta Medical Store.
• Primary Goal: To search, explore, and order medicines conveniently.
• Responsibilities: Browsing product listings, searching medicines, viewing details, adding to cart, checking out, uploading prescriptions, and tracking orders.
• Interactions: Registers/logs in, provides address and payment details, uploads prescriptions for verification.
• Success: Successfully places and receives orders with verified prescriptions.

Pharmacist

• Context: A licensed professional responsible for verifying prescriptions.
• Primary Goal: To ensure prescriptions are valid before order fulfillment.
• Responsibilities: Reviewing and verifying uploaded prescriptions.
• Interactions: Approves or rejects prescriptions based on validity.
• Success: Only verified prescriptions proceed to fulfillment.

Store Admin

• Context: The operator managing the online store's inventory and orders.
• Primary Goal: To maintain accurate inventory and manage customer orders.
• Responsibilities: Adding/editing/deleting medicines, managing prices and stock, overseeing order pipeline.
• Interactions: Uses admin dashboard for inventory and order management.
• Success: Inventory and orders are accurately managed and up-to-date.

5. Core User Flows

5.1 Customer Browsing and Ordering

1. Start: Customer accesses the Home page.
2. Action: Customer uses the search bar to find a specific medicine.
3. Result: Medicines page displays search results.
4. Action: Customer selects a medicine to view details.
5. Result: Medicine details page shows detailed information.
6. Action: Customer adds medicine to the cart.
7. Result: Cart page updates with selected items.
8. Action: Customer proceeds to checkout.
9. Result: Checkout page collects address, contact, and payment details.
10. Action: Customer uploads a prescription if required.
11. Result: Prescription Verification page processes the upload.
12. Action: Customer places the order.
13. Result: Order confirmation is displayed, and order tracking is available in My Orders.

5.2 Pharmacist Prescription Verification

1. Start: Pharmacist logs in via Staff Login.
2. Action: Pharmacist accesses the Prescription Verification page.
3. Result: List of uploaded prescriptions is displayed.
4. Action: Pharmacist reviews a prescription.
5. Result: Prescription is either approved or rejected.
6. Continuation: Approved prescriptions proceed to fulfillment; rejected prescriptions notify the customer.

5.3 Store Admin Inventory Management

1. Start: Store Admin logs in via Staff Login.
2. Action: Admin accesses the Admin dashboard.
3. Result: Inventory management interface is displayed.
4. Action: Admin adds a new medicine to the inventory.
5. Result: Medicine is added and visible in the product listing.
6. Action: Admin edits prices or stock levels.
7. Result: Changes are saved and reflected in the store.
8. Continuation: Admin manages customer orders through Admin Orders.

6. Visuals Colors and Theme

• Muse: Erik Spiekermann
• Palette:
  • Background: #F3EFE7
  • Surface: #FFFFFF
  • Text: #16130F
  • Primary: #0E5C4A
  • Accent: #D62828
  • Muted: #6F6A61
• Typography:
  • Headings: Fira Sans Condensed
  • Body: Fira Sans
  • Scale: 1.333 modular
• Shape Language: Squared corners, 2px radius, 1px hairline rules.
• Layout: 12-column grid, 24px gutters, flush-left ragged-right.
• Motion: Restrained, 140–180ms state changes, no bounce.

7. Signature Design Concept

The Home page will feature a full-width identity board with a green band carrying 'GUPTA MEDICAL STORE · GAJRAULA' in condensed uppercase. Below, a three-line headline in Fira Sans Condensed will read 'MEDICINES / YOU NEED, / VERIFIED.' A ruled inventory ledger will display real medicine rows, creating a professional and trustworthy first impression.

8. Interaction Model & Motion Direction

• Interaction Model: Static
• Motion Tempo: Restrained
• Hero Dimensionality: Flat
• Landing Hero Motion Brief: The search field's signal dot pulses once on focus, and the order-tracking route line advances its station dot as status changes. Hover on a medicine row swaps the row ground to green and text to paper.

9. Non-Functional Requirements

• The website must be fully responsive and accessible on mobile, tablet, and desktop devices. (explicit)
• The design must adhere to a clean, medical-themed UI with easy navigation. (explicit)
• Prescription medicines must comply with legal requirements for verification. (explicit)

10. Tech Stack

• Frontend: React
• Backend: Python/FastAPI
• Database: PostgreSQL
• Deployment: Docker, Kubernetes (if required)

11. Assumptions and Constraints

• The website will be hosted and maintained by Gupta Medical Store.
• Prescription verification will be handled by licensed pharmacists.
• The system will comply with local regulations for online medicine sales.

12. Glossary

• Rx: Prescription
• MRP: Maximum Retail Price
• COD: Cash on Delivery
• UI: User Interface
• UX: User Experience