System Requirements Document (SRD)

Fiery-Owner

1. Introduction

The Fiery-Owner project is a highly customizable and interactive website tailored for Muhammad Bilal Ahmed in Pakistan. Inspired by the design and functionality of Cosmique Gules, this website empowers the owner to manage services, approve customer reviews, and dynamically update the homepage background video. It also provides customers with seamless booking and review submission options. The website will feature modern UI/UX motion graphics to enhance user engagement and will be packaged into a folder named "New Parlor Website" for easy deployment and future updates.

The theme will incorporate a sophisticated skin and white color palette, creating a warm and inviting atmosphere suitable for a parlor business.

2. System Overview

The Fiery-Owner system is designed to cater to two primary user groups: the owner and customers. The owner will have full control over the website's content and appearance through an intuitive control panel. Customers will be able to book services, submit reviews, and interact with the website's visually appealing interface. The system will leverage cutting-edge technologies to ensure scalability, responsiveness, and a premium user experience.

Key features include:

• Owner Control Panel: Manage services, approve reviews, and update the homepage background video.
• Customer Interaction: Book services and submit reviews.
• UI/UX Motion Graphics: Enhance visual appeal and engagement.
• Dynamic Content Management: Allow the owner to make real-time updates.

3. Functional Requirements

Owner Features:

• As Owner, I should be able to add, edit, or delete main services.
• As Owner, I should be able to add, edit, or delete sub-services.
• As Owner, I should be able to approve or reject customer reviews before they appear on the website.
• As Owner, I should be able to change the background video of the homepage.

Customer Features:

• As Customer, I should be able to book services online.
• As Customer, I should be able to submit reviews for services.
• As Customer, I should be able to view approved reviews on the website.

General Features:

• As User, I should experience smooth UI/UX motion graphics throughout the website.
• As User, I should find the website responsive and visually appealing across devices.

4. User Personas

Owner:

• Description: The owner of the parlor, Muhammad Bilal Ahmed, who manages services, reviews, and website content.
• Goals: To have full control over the website's functionality and appearance.
• Skills: Basic familiarity with web interfaces.

Customer:

• Description: Individuals looking to book services or share their experiences through reviews.
• Goals: To book services easily and share feedback.
• Skills: General internet usage.

5. Visuals Colors and Theme

Unique Color Palette:

• Background: #F5F5DC (Beige White)
• Surface: #FFE4C4 (Bisque Skin Tone)
• Text: #8B4513 (Saddle Brown)
• Accent: #FFDAB9 (Peach Puff)
• Muted Tones: #FAF0E6 (Linen)

Theme:

The website will feature a sleek, modern aesthetic with a warm and inviting skin-and-white color palette. The beige and peach tones will evoke comfort and elegance, while the saddle brown text will provide a professional contrast. Motion graphics will enhance the visual appeal, ensuring a premium experience for users.

6. Signature Design Concept

Concept: Interactive Homepage with Skin-and-White Elegance

The homepage will feature a full-screen dynamic video background that the owner can update at any time via the control panel. Overlaid on the video will be interactive motion graphics, such as:

• Floating Service Cards: Main services will appear as animated cards that "float" into view as the user scrolls, styled in the skin-and-white palette.
• Parallax Scrolling: Elements on the homepage will move at different speeds to create depth and immersion.
• Interactive Booking Button: A glowing booking button styled in peach puff that pulses gently to attract attention.
• Review Carousel: Approved customer reviews will rotate in a 3D carousel format, adding movement and engagement.
• Micro-Interactions: Subtle animations like hover effects, button clicks, and transitions will make the website feel alive.

The homepage will leave visitors with a lasting impression of sophistication and creativity, ensuring they return for future interactions.

7. Non-Functional Requirements

• Performance: The website should load within 3 seconds on standard broadband connections.
• Scalability: The system should handle up to 10,000 concurrent users.
• Security: Implement SSL encryption and secure authentication for the owner control panel.
• Accessibility: Ensure compliance with WCAG 2.1 standards for accessibility.
• Localization: Default language set to English, with potential for multilingual support.

8. Tech Stack

Frontend:

• React for Web

Backend:

• Python
• FastAPI

Database:

• MySQL (preferred) or MariaDB, with Alembic for migrations.

AI Models:

• GPT 5.4 for user-friendly responses.
• Claude 4.6 Opas for coding-related tasks.

AI Tools:

• Litellm for LLM Routing.
• Langchain.

Local Orchestration:

• Docker
• docker-compose

Server-Side Orchestration:

• Kubernetes

9. Assumptions and Constraints

Assumptions:

• The owner has basic familiarity with web interfaces.
• Customers will primarily access the website via mobile and desktop devices.
• The website will initially target users in Pakistan.

Constraints:

• The website must comply with local regulations and data privacy laws in Pakistan.
• The system should be optimized for low-bandwidth connections.

10. Glossary

• Owner Control Panel: A dashboard for managing website content and functionality.
• UI/UX Motion Graphics: Visual animations and transitions that enhance user experience.
• Dynamic Video Background: A homepage feature where the background video can be updated by the owner.
• Parallax Scrolling: A design technique where background and foreground elements move at different speeds.
• SSL Encryption: A security protocol for encrypting data transmitted over the internet.

This document outlines the requirements for the Fiery-Owner project and serves as a blueprint for development. Let me know if there are additional features or adjustments you'd like to include, Muhammad Bilal Ahmed!