https://github.com/srikant-code/prelook-studio
https://github.com/srikant-code/prelook-studio
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/srikant-code/prelook-studio
- Owner: srikant-code
- Created: 2026-02-01T13:44:14.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2026-02-01T18:50:50.000Z (5 months ago)
- Last Synced: 2026-02-02T03:11:51.731Z (5 months ago)
- Language: TypeScript
- Homepage: https://prelook-studio.vercel.app
- Size: 127 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 💈 Prelook Studio
AI-powered hairstyle visualization platform that lets users try on different hairstyles before visiting the salon.
View your app in AI Studio: https://ai.studio/apps/drive/1w567IJmIOBuw_O9ASVvs4u5kWlVe5Jxk
## ✨ Features
### For Customers
- 📸 **Upload or Capture** - Use your camera or upload an existing photo
- 🎨 **AI Transformation** - Generate photorealistic hairstyle previews instantly
- 🔄 **360° Views** - Unlock front, left, right, and back angles (premium feature)
- 📱 **Quick Login** - Returning users get 1-tap access to their history
- 💾 **Session History** - All your generated styles saved automatically
- 📍 **Salon Finder** - Book appointments at nearby salons
### For Salon Partners
- 🏪 **Admin Dashboard** - Manage bookings and customer flow
- 📊 **Analytics** - Track AI sessions and revenue
- 🎫 **Walk-in Codes** - Issue special codes for customers with salon perks
## 🚀 Quick Start
**Prerequisites:** Node.js 18+
1. **Install dependencies:**
```bash
npm install
```
2. **Set up environment:**
- Copy `.env.local.example` to `.env.local` (if not exists)
- Add your Gemini API key:
```
API_KEY=your_gemini_api_key_here
```
3. **Run the app:**
```bash
npm run dev
```
4. Visit `http://localhost:5173`
## 📁 Project Structure
```
prelook-studio/
├── src/ # NEW: Organized source (in progress)
│ ├── components/ui/ # Reusable UI components ✅
│ ├── hooks/ # Custom React hooks ✅
│ ├── services/ # API & business logic ✅
│ ├── types/ # TypeScript definitions ✅
│ └── constants/ # App constants ✅
├── components/ # Current components (active)
├── services/ # Current services (active)
├── App.tsx # Main application
└── types.ts # Type definitions
```
See [ARCHITECTURE.md](./ARCHITECTURE.md) for complete documentation.
## 🎯 User Flow Improvements
### ✅ New Users
- **Before:** Forced to login first
- **After:** Directly see upload/camera interface - no login required to start!
### ✅ Returning Users
- **Before:** Manual email/password every time
- **After:** 1-tap quick login from recent users list with OTP
## 🛠️ Technology Stack
- **React 18** + **TypeScript** - UI framework with type safety
- **Vite** - Lightning-fast build tool
- **Tailwind CSS** - Utility-first styling
- **Google Gemini AI** - Image generation
- **Lucide React** - Beautiful icons
## 💳 Credit System
- **Free**: 2 credits (try before you buy)
- **Pro**: ₹99 - 15 credits
- **Ultimate**: ₹169 - 60 credits
**Usage:**
- 1 credit = Front view generation
- 2 credits = Unlock 360° views (all angles)
## 🎨 New UI Component Library
Production-ready components in `src/components/ui/`:
```typescript
import { Button, Card, Avatar, Badge, Modal, Input } from '@/components/ui';
Active
Get Started
```
## 📱 Responsive Design
Fully responsive across:
- 📱 Mobile: Touch-optimized, full-screen camera
- 📧 Tablet: Adaptive layouts
- 💻 Desktop: Multi-column interface
## 🔄 Migration Status
### ✅ Completed
- Production folder structure created
- Reusable UI component library built
- Custom hooks implemented (useAuth, useHistory, useLocalStorage)
- **Fixed authentication flow** for new vs returning users
- Comprehensive documentation added
### 🚧 In Progress
- Migrating components to new `src/` structure
- Updating import paths
### 📋 Planned
- Complete migration & cleanup
- Unit tests
- Performance optimization
## 📄 License
MIT License - see [LICENSE](LICENSE) for details.
---
**Built with ❤️ by the Prelook Studio Team**