Welcome to CereStyle, an AI-powered fashion recommendation system that helps users discover outfits that enhance their natural features. By analyzing hair, skin, and eye color from uploaded photos, CereStyle compares these with reference images and suggests products worn by similar individuals. Whether you're looking for casual or professional attire, CereStyle offers personalized suggestions to help you feel confident in every setting.

1. Project Overview
2. Requirements
3. Backend Setup (FastAPI)
   • Step 1: Create a Virtual Environment
   • Step 2: Install Backend Dependencies
   • Step 3: Run the FastAPI Backend
4. Frontend Setup (React)
   • Step 1: Install Frontend Dependencies
   • Step 2: Start the React Frontend
5. How to Use the Project
6. Project Directory Structure
7. Key Commands
8. Tech Stack
9. Contributors

CereStyle is designed to solve the common struggle of finding clothing that perfectly matches individual features. By blending color theory and AI, this platform provides fashion suggestions that complement users' natural attributes, helping them feel more confident and positively impacting their mental health and confidence. CereStyle brings a personalized shopping experience to your fingertips with advanced image processing and real-time product recommendations.

Before setting up the project, ensure you have the following installed on your system:

• Python 3.8+ (for the FastAPI backend)
• Node.js (for the React frontend)
• pip (Python package manager)

The backend uses FastAPI to handle tasks like file uploads, image analysis, and product recommendations.

Creating a virtual environment ensures that the project dependencies are isolated from your global Python environment.

For Windows:

python -m venv venv
venv\Scripts\activate

For macOS/Linux:

python3 -m venv venv
source venv/bin/activate

After activating the virtual environment, install the necessary packages:

pip install fastapi uvicorn python-multipart Pillow scikit-learn

Navigate to the backend/ folder and start the FastAPI server:

cd backend
uvicorn main:app --reload

The backend should now be running at http://127.0.0.1:8000.

The frontend is built using React and provides an intuitive interface for uploading images and receiving fashion suggestions.

Navigate to the react-frontend/ folder and install the required dependencies:

cd react-frontend
npm install

Once the dependencies are installed, start the development server:

npm start

The frontend should now be running at http://localhost:3000.

1. Open the React App:

   • Open your browser and navigate to http://localhost:3000.

2. Upload a Photo:

   • Use the upload form on the main page to submit a photo of yourself.

3. Get Recommendations:

   • The backend analyzes the uploaded photo and suggests products based on the closest matching reference image.

Here's an overview of the project's directory structure:

project_root/
│
├── backend/                      # Backend code (FastAPI)
│   ├── __pycache__/              # Python cache files
│   ├── main.py                   # Main FastAPI app
│   └── reference_images/         # Reference images for comparison
│
├── react-frontend/               # Frontend code (React)
│   ├── node_modules/             # Node.js modules
│   ├── public/                   # Public assets for React
│   ├── src/                      # React source code
│   ├── package.json              # Frontend dependencies list
│   ├── package-lock.json         # Lockfile for dependencies
│   └── README.md                 # Frontend README
│
└── README.md                     # Main project README

• Install Backend Dependencies:

  pip install fastapi uvicorn python-multipart Pillow scikit-learn

• Run the Backend Server:

  uvicorn main:app --reload

• Install Frontend Dependencies:

  npm install

• Run the Frontend:

  npm start

CereStyle is built with modern technologies to ensure efficiency, scalability, and an exceptional user experience. Here’s a breakdown of the tools and frameworks used:

• React: JavaScript library for building user interfaces.
• JavaScript: Primary programming language for client-side scripting.
• HTML5: For structuring web content.
• CSS3: For styling web components.

• FastAPI: Fast web framework for building APIs in Python.
• Python: Backend processing, including image analysis.
• Flask: Lightweight framework for rapid prototyping.
• Uvicorn: ASGI server for running FastAPI applications.

• Cerebras API: AI-powered image analysis for skin tone, hair, and eye color detection.
• Pillow: Image processing library.
• Scikit-learn: Machine learning library for color matching and recommendations.

• Git: Version control system.
• GitHub: Code hosting platform for collaboration.

• SerpAPI: Real-time product recommendations.
• Pexels API: Image sourcing for fashion items.

• VS Code: Code editor.

This project was created by a team of passionate developers:

• maheessh
• BinayakJha
• sujalshah0444

We hope you enjoy using CereStyle as much as we enjoyed building it!