🚀 About The Project

ThumbFace AI is a React-based SaaS application that solves the biggest pain point for YouTubers: creating expressive faces for thumbnails without spending hours doing photo shoots.

It leverages AI to transform standard selfies into "Clickbait-Ready" expressions (Shock, Rage, Hysterical Laughter) while keeping the user's identity intact. The platform features advanced Gamification, Dynamic Regional Pricing, and a Reward Ad System to maximize user retention and monetization.

🌟 Key Features

🎭 AI Expression Generator: Instantly generate "Ultra Shock", "Rage Mode", or "Pog Face" expressions.

🎮 Gamified Experience: Users earn XP, level up, and maintain streaks to unlock perks.

🌍 Dynamic Pricing: Automatically detects user location (US, IN, UK, EU) and adjusts pricing tiers (PPP) and currency symbols.

📺 Reward Ad System: "Watch to Earn" implementation allows free users to gain credits by watching simulated ads.

🛡️ Enterprise Security: Client-side rate limiting, input sanitization, and strict Firestore security rules.

📱 Responsive Design: Fully optimized mobile and desktop experience using Tailwind CSS.

🛠️ Tech Stack

Frontend: React.js (Vite)

Styling: Tailwind CSS, Lucide React (Icons)

Backend & Auth: Firebase (Authentication, Firestore Database)

AI Integration: Stable Diffusion / Midjourney API (Proxy)

Deployment: Vercel / Netlify

⚡ Getting Started

Follow these steps to set up the project locally on your machine.

Prerequisites

Node.js (v18 or higher)

npm or yarn

Installation

Clone the repository

git clone [https://github.com/thekartikeyamishra/thumbface-ai.git] cd thumbface-ai

Install dependencies

npm install

Configure Environment Variables Create a .env file in the root directory and add your Firebase and API keys:

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 VITE_AI_API_KEY=your_ai_provider_key

Run the development server

npm run dev

🔮 Roadmap

[x] Initial UI/UX & Gamification Logic

[x] Dynamic Pricing Engine

[x] Ad Reward System Integration

[ ] Connect Real Stability AI API

[ ] User Gallery & History

[ ] Drag-and-Drop Thumbnail Editor

🤝 Contributing

Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

Fork the Project

Create your Feature Branch (git checkout -b feature/AmazingFeature)

Commit your Changes (git commit -m 'Add some AmazingFeature')

Push to the Branch (git push origin feature/AmazingFeature)

Open a Pull Request

📄 License

Distributed under the MIT License. See LICENSE for more information.