👗 StyleSync – AI-Powered Virtual Fashion Try-On & Recommendation System

StyleSync is a modern AI-powered fashion web application that redefines the online shopping experience.
It offers Virtual Try-On with 3D models, a personalized body-type–based recommendation system, and a 24/7 chatbot with voice support.
Users can explore outfits virtually, build their wardrobe, receive suggestions, and even redirect to platforms like Flipkart and Meesho for seamless purchases.

---

🚀 Features

🎭 Virtual Try-On

• Built with Genne 3D modeling software.
• Users can try on outfits on customizable 3D avatars.
• Includes a personal wardrobe to save and manage outfits.

💬 Chatbot with TTS & STT

• 24/7 chatbot support.
• Groq API → real-time chatbot responses.
• ElevenLabs API → Text-to-Speech (TTS) + Speech-to-Text (STT).
• Voice-enabled, making the chatbot interactive & accessible.

👕 Recommendation System

• Users fill out a Body Type Form (height, weight, shape).
• AI generates personalized clothing suggestions.
• Redirects users to Meesho/Flipkart for similar product exploration.

---

🛠️ Tech Stack

• Frontend: React.js, Bootstrap
• Backend & Database: Firebase (Auth, Storage, Database)
• APIs & AI Integrations:
  • Groq API → Chatbot
  • ElevenLabs API → TTS/STT
  • Genne Software → 3D Virtual Try-On
• Hosting & CI/CD: GitHub Pages, GitHub Actions
• Development Methodology: Agile (sprint-based development)

---

🔄 Workflow

1. User Registration/Login → Managed via Firebase.
2. Virtual Try-On → Upload/select outfits → Try them on avatars → Save to wardrobe.
3. Recommendation System → Fill form → Get body-type–based outfit suggestions.
4. Chatbot Interaction → Chat via text/voice → AI responds in real-time.
5. Shopping Redirect → Explore similar outfits on Flipkart/Meesho.

---

✅ Key Benefits

• Personalized Experience → Outfits tailored to each user’s body type.
• Immersive Shopping → Virtual Try-On reduces uncertainty.
• 24/7 Support → Voice-enabled chatbot always available.
• Seamless Integration → Quick redirection to trusted e-commerce platforms.
• Modern Tech Adoption → Combines AI, speech, and 3D modeling.

---

📌 Development Practices

• Agile methodology → Iterative development with sprint reviews.
• CI/CD pipeline → Automated with GitHub Actions.
• Hosting → Deployed on GitHub Pages for easy access.

---

📂 Project Structure

StyleSync/ ├── public/ # Static assets ├── src/ # React source code │ ├── components/ # Reusable components │ ├── pages/ # App pages (Try-On, Chatbot, Recommendations) │ ├── services/ # API integrations (Groq, ElevenLabs, Firebase) │ ├── App.js # Main app entry │ └── index.js # React DOM render ├── .github/workflows/ # CI/CD pipeline (GitHub Actions) ├── README.md # Project documentation ├── package.json # Dependencies & scripts └── firebase.json # Firebase config