diff --git a/teams/stream-titans/README.md b/teams/stream-titans/README.md new file mode 100644 index 0000000..ab740ad --- /dev/null +++ b/teams/stream-titans/README.md @@ -0,0 +1,211 @@ +# ๐ŸŽฅ StreamTitans โ€” Live Commerce Platform + +> **Where fashion meets live streaming.** Discover, claim, and buy thrifted & trending fashion in real-time. + +--- + +## Team Name +**Team StreamTitans** + +## Team Members +- Ayush Bharti (GitHub: @Ayush-2511) +- Eshita Modi (GitHub: @Eshita65) +- Aadya Agarwal (GitHub: @Aadya25416) +- Manjeet Singh Meena (GitHub: @manjeetsinghmeena) +- Aranya Kumar (GitHub: @Aranya0811) + +--- + +## ๐Ÿ’ก Idea Chosen +**Custom: StreamTitans โ€” AI-Powered Live Commerce for Fashion & Thrifting** + +--- + +## ๐Ÿงฉ Problem Statement + +India's resale and thrifting market is fragmented and mostly offline. Gen-Z buyers want the excitement of live shopping โ€” the thrill of claiming a limited item before it's gone โ€” but platforms like Instagram Live lack real-time commerce infrastructure. Simultaneously, independent fashion creators struggle to reach buyers, manage inventory, and price their thrifted goods competitively. + +StreamTitans bridges this gap by combining **live streaming**, **real-time commerce**, and **AI-powered features** into a single platform tailored for fashion and thrifting in India. + +--- + +## ๐Ÿ› ๏ธ Tech Stack + +| Layer | Technology | +|---|---| +| Frontend Framework | React 19 + Vite 8 | +| Styling | Vanilla CSS with CSS Variables (Brutalist Design System) | +| Authentication | Firebase Auth (Google OAuth + Email/Password) | +| Database | Firebase Firestore | +| Media Uploads | Cloudinary | +| AI Features | Google Gemini API (`gemini-flash-latest`) via `@google/generative-ai` | +| Icons | Lucide React | +| Notifications | React Hot Toast | +| Routing | Hash-based SPA routing (no React Router) | +| Deployment | Vercel / Netlify | + +--- + +## โœจ Key Features + +### ๐Ÿ›’ Buyer Experience +- **Live Stream Discovery** โ€” Browse ongoing fashion live streams in a card-based deck +- **Thrift Marketplace** โ€” Browse polaroid-style thrift items with rapid claim system +- **E-commerce View** โ€” Browse curated drops and trending pieces +- **AI Semantic Search** โ€” Natural language search across the full product catalog (e.g. *"something warm for winter in earth tones"*) +- **Personalized Feed** โ€” AI-powered recommendation engine that re-ranks items based on your interaction history +- **Advanced Filters** โ€” Full-screen popup filter system with price sliders, size grids, brand search, and colour swatches +- **Cart & Wallet** โ€” Order management and balance tracking + +### ๐ŸŽฌ Creator Experience +- **Creator Dashboard** โ€” Full analytics, inventory management, and stream scheduling +- **AI Price Estimator** โ€” Instantly suggests optimal INR pricing for thrifted items based on title, category, and condition +- **Live Stream Controls** โ€” Start streams, add product drops, and manage orders in real-time +- **Inventory Manager** โ€” Add products (with Cloudinary image upload), track live vs. draft listings, view stock and revenue metrics + +### ๐Ÿค– AI Features (Powered by Gemini) +- **Titans AI Chatbot** โ€” Floating assistant that answers buyer questions about claims, shipping, and the platform +- **Semantic Search Engine** โ€” Understands natural language queries and returns relevant products by meaning, not keywords +- **AI Price Estimator** โ€” Real-time price range suggestions for thrifted fashion items +- **Personalized Recommendation Feed** โ€” Re-ranks content based on session activity + +--- + +## ๐Ÿ—๏ธ Architecture Overview + +``` +StreamTitans/ +โ”œโ”€โ”€ frontend/ +โ”‚ โ”œโ”€โ”€ src/ +โ”‚ โ”‚ โ”œโ”€โ”€ pages/ # Top-level views (Home, LandingFlow, CreatorDashboard) +โ”‚ โ”‚ โ”œโ”€โ”€ components/ # All UI components +โ”‚ โ”‚ โ”‚ โ”œโ”€โ”€ landing/ # Landing page components (Hero, Auth, Email) +โ”‚ โ”‚ โ”‚ โ”œโ”€โ”€ profile/ # Buyer profile & settings +โ”‚ โ”‚ โ”‚ โ”œโ”€โ”€ creator/ # Creator dashboard tabs & components +โ”‚ โ”‚ โ”‚ โ”œโ”€โ”€ ecommerce-v2/# E-commerce section +โ”‚ โ”‚ โ”‚ โ””โ”€โ”€ thrift-v2/ # Thrift section +โ”‚ โ”‚ โ”œโ”€โ”€ context/ # Global state (Auth, Stream, Product, UserActivity) +โ”‚ โ”‚ โ”œโ”€โ”€ firebase/ # Firebase config, auth, firestore, cloudinary +โ”‚ โ”‚ โ”œโ”€โ”€ data/ # Mock data for streams, products, creators +โ”‚ โ”‚ โ””โ”€โ”€ index.css # Global Brutalist CSS Design System +``` + +**State Management Strategy:** +- `AuthContext` โ€” Firebase user session, role (buyer/seller), real-time listener +- `StreamContext` โ€” Controls the global stream overlay modal +- `ProductContext` โ€” Controls the global product claim overlay modal +- `UserActivityContext` โ€” Tracks click events to power the personalized feed algorithm +- Local `useState` for all UI-specific interactions + +--- + +## ๐Ÿš€ How to Run Locally + +### Prerequisites +- Node.js 18+ +- A Firebase project with **Authentication** (Google + Email/Password) and **Firestore** enabled +- A Google Gemini API key from [Google AI Studio](https://aistudio.google.com/app/apikey) +- A [Cloudinary](https://cloudinary.com/) account (for image uploads) + +### Steps + +```bash +# 1. Clone the repository +git clone https://github.com/Ayush-2511/StreamTitans.git +cd StreamTitans/frontend + +# 2. Install dependencies +npm install + +# 3. Set up environment variables +cp .env.example .env.local +# Then edit .env.local and fill in your keys (see below) + +# 4. Start the development server +npm run dev +``` + +### Environment Variables (`.env.local`) + +```env +# Firebase Configuration +VITE_FIREBASE_API_KEY=your_firebase_api_key +VITE_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com +VITE_FIREBASE_PROJECT_ID=your_project_id +VITE_FIREBASE_STORAGE_BUCKET=your_project.appspot.com +VITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id +VITE_FIREBASE_APP_ID=your_app_id + +# Google Gemini AI +VITE_GEMINI_API_KEY=your_gemini_api_key + +# Cloudinary (for product image uploads) +VITE_CLOUDINARY_CLOUD_NAME=your_cloud_name +VITE_CLOUDINARY_UPLOAD_PRESET=your_upload_preset +``` + +> โ„น๏ธ A `.env.example` template is included in the repository with all required variable names. + +--- + +## ๐ŸŒ Live Demo + +๐Ÿ”— **[StreamTitans Live โ†’](https://stream-titans.vercel.app)** + +--- + +## ๐Ÿ“ธ Screenshots / Demo + +### Demo Video link โ€” +๐Ÿ”— **[Demo link โ†’](https://www.youtube.com/watch?v=aBeuu__VSco)** + +### Landing Page โ€” Infinite Scrolling Fashion Grid +> Animated, tilted columns of fashion imagery with a smooth Auth flow +![landing-page](./frontend/public/screenshots/landing_page.png) + +### Buyer Home โ€” Live Stream Deck +> Real-time live stream cards with category filtering and a Claim button +![buyer-home](./frontend/public/screenshots/buyer_home.png) + +### Thrift Marketplace โ€” Polaroid Grid +> Vintage-style product cards with fast claim mechanics +![thrift-marketplace](./frontend/public/screenshots/thrift_marketplace.png) + +### Creator Dashboard โ€” Inventory Manager +> Full product management with AI Price Estimator and Cloudinary uploads +![dashboard](./frontend/public/screenshots/dashboard.png) + +### AI Chatbot โ€” Titans AI Assistant +> Floating chat widget powered by Gemini, answers platform-specific questions +![ai-chatbot](./frontend/public/screenshots/ai_chatbot.png) + +### AI Semantic Search +> Natural language search modal accessible from the navbar +![ai-search](./frontend/public/screenshots/ai_search.png) + +### Other screenshots +![alt-text](./frontend/public/screenshots/analytics.png) +![alt-text](./frontend/public/screenshots/creator_profile.png) +![alt-text](./frontend/public/screenshots/ecommerce_deals.png) +![alt-text](./frontend/public/screenshots/editors_pick.png) +![alt-text](./frontend/public/screenshots/general_settings.png) +![alt-text](./frontend/public/screenshots/inventory.png) +![alt-text](./frontend/public/screenshots/join_seller.png) +![alt-text](./frontend/public/screenshots/live_stream_view.png) +![alt-text](./frontend/public/screenshots/login.png) +![alt-text](./frontend/public/screenshots/my_streams.png) +![alt-text](./frontend/public/screenshots/onboarding.png) +![alt-text](./frontend/public/screenshots/orders.png) +![alt-text](./frontend/public/screenshots/seller_verification.png) +![alt-text](./frontend/public/screenshots/user_profile_settings.png) +![alt-text](./frontend/public/screenshots/wallet.png) + +--- + +## ๐Ÿค Contributing + +This project was built as part of a hackathon. For collaboration, please open an issue or reach out to the team directly. + +--- + +*StreamTitans ยฉ 2026 ยท Built with LOVE for the live commerce generation* \ No newline at end of file diff --git a/teams/stream-titans/project-files b/teams/stream-titans/project-files new file mode 160000 index 0000000..067c2ac --- /dev/null +++ b/teams/stream-titans/project-files @@ -0,0 +1 @@ +Subproject commit 067c2ac6c7f6b209d4d6a3b8ed85743777273987