raven-idea

1. Introduction

The purpose of this System Requirements Document (SRD) is to outline the requirements for the "raven-idea" project, which aims to develop a website for Sharik Enterprises. This website will serve as a platform for showcasing the company's manufacturing, supply, and export business, with a focus on jackets. The website will be designed to appear trustworthy and minimalistic, integrating various social media platforms and contact functionalities.

2. System Overview

The "raven-idea" project will create a website for Sharik Enterprises that highlights their manufacturing and export capabilities. The website will include features such as product galleries, social media integration, and customer inquiry forms. The design will emphasize a minimalistic and aesthetic look to build trust with potential buyers.

3. Functional Requirements

• As a User, I should be able to view the homepage with an overview of Sharik Enterprises.
• As a User, I should be able to access the product gallery to view images of jackets.
• As a User, I should be able to click on a jacket image to view its details.
• As a User, I should be able to fill out a contact form to send a query to the supplier.
• As a User, I should be able to enter my name, mobile number, email address, desired quantity, price, budget, and product type in the contact form.
• As a User, I should be able to access the company's Instagram and Facebook pages via links.
• As a User, I should be able to upload jacket images and their details to the website.
• As a User, I should not see statistics sections like "30+ countries served" or "500K+ jackets exported" on the website.
• As a User, I should be able to contact the company via WhatsApp by clicking an icon on the website.
• As a User, I should be able to view the company's privacy policy and contact information.
• As a User, I should be able to access the company's business email for inquiries.

4. User Personas

• Visitor: A potential customer browsing the website to learn more about Sharik Enterprises and their products.
• Supplier: A representative from Sharik Enterprises who manages inquiries and updates product information on the website.

5. Core User Flows

• Visitor lands on the homepage -> Navigates to product gallery -> Clicks on a jacket image -> Views product details -> Fills out contact form -> Submits inquiry.
• Visitor clicks on social media icons -> Redirected to Instagram or Facebook page.
• Visitor clicks on WhatsApp icon -> Redirected to WhatsApp chat with Sharik Enterprises.

6. Visuals Colors and Theme

• primary: #1A1A1D (Dark Charcoal)
• primary_light: #4E4E50 (Light Charcoal)
• secondary: #C3073F (Crimson Red)
• accent: #950740 (Deep Magenta)
• highlight: #FF5733 (Vibrant Orange)
• bg: #F5F5F5 (Light Grey)
• surface: rgba(255, 255, 255, 0.9) (White)
• text: #1A1A1D (Dark Charcoal)
• text_muted: #6C757D (Muted Grey)
• border: rgba(0, 0, 0, 0.1) (Light Black)

7. Signature Design Concept

The homepage of the Sharik Enterprises website will feature an interactive "Jacket Carousel" using framer-motion. Users can scroll horizontally through a 3D carousel of jacket images. Each jacket will rotate and enlarge slightly when hovered over, revealing additional details and a "Contact Supplier" button. The background will subtly change colors based on the jacket's color scheme, creating a dynamic and engaging experience. This interactive element will make the website memorable and encourage user interaction.

8. Interaction Model & Motion Direction

The landing page will utilize a "parallax" interaction model. The jacket carousel will be the focal point, with layered depth effects as users scroll. The background will shift subtly, and content will reveal itself with smooth transitions. Internal pages will maintain a "static" interaction model for clarity and ease of use.

9. Non-Functional Requirements

• The website should load within 3 seconds on standard broadband connections.
• The website must be responsive and accessible on mobile devices.
• The website should adhere to privacy and data protection regulations applicable in India.

10. Tech Stack

• Frontend: React for Web
• Backend: FastAPI
• Database: MySQL
• AI Tools: Not applicable
• Orchestration: Docker, docker-compose

11. Assumptions and Constraints

• The website will primarily target customers in India.
• The website will be hosted on a reliable cloud service with adequate uptime.
• The design will prioritize minimalism and aesthetics to build trust with users.

12. Glossary

• Jacket Carousel: An interactive element displaying jacket images in a rotating manner.
• Parallax: A scrolling effect where background images move slower than foreground images, creating a sense of depth.
• Static Interaction Model: A design approach focusing on clarity and minimal motion, suitable for content-heavy pages.