golden-video

byArman Khan

Create a fully functional AI Video Dubbing Web App similar to Crayo AI with a clean modern UI and responsive design. TECH STACK: - Frontend: React + Tailwind CSS - Backend: Node.js (Express) - Database: MongoDB - Use FFmpeg for audio/video processing - Use open-source/free APIs (no watermark) CORE FEATURES: 1. USER INTERFACE: - Homepage with drag & drop video upload - Supported formats: MP4, MOV - Video preview player - Language selection dropdown (Hindi, Chinese, English) - Voice selection (Male/Female AI voices) - “Start Dubbing” button - Progress bar (real-time processing status) - Download button after completion 2. VIDEO PROCESSING FLOW: - Upload video - Extract original audio using FFmpeg - Convert speech to text (Speech-to-Text) - Translate text into selected language (Hindi/Chinese) - Convert translated text to speech (Text-to-Speech) - Replace original audio with new dubbed audio - Sync lip timing approximately - Export final dubbed video 3. AI INTEGRATION: - Speech-to-Text: OpenAI Whisper (or free alternative) - Translation: LibreTranslate API (free) - Text-to-Speech: - Hindi voices - Chinese voices - Natural sounding AI voices - Allow voice speed & pitch control 4. BUTTON FUNCTIONALITY: - Upload button → uploads video - Language dropdown → changes target language - Start button → triggers full pipeline - Progress bar → shows real-time % status - Download button → downloads final video - Error handling → show proper messages 5. EXTRA FEATURES: - Dark mode UI - History of previous dubbed videos - File size limit (e.g. 100MB) - Loading animations - Mobile responsive 6. BACKEND LOGIC: - REST API routes: /upload /process /status /download - Queue system for processing jobs - Use temporary storage for files - Clean up old files automatically 7. UI DESIGN: - Modern glassmorphism style - Gradient buttons - Smooth animations - Clean dashboard layout 8. NO WATERMARK: - Ensure output video has no watermark - Use only open-source tools 9. DEPLOYMENT: - Frontend: Vercel - Backend: Render / Railway - Storage: Local or Cloudinary (optional) 10. CODE QUALITY: - Clean, modular code - Proper comments - Error handling everywhere IMPORTANT: - All buttons must work properly - Full working pipeline (upload → dub → download) - No fake UI, everything functional

LandingError
Landing

Comments (0)

No comments yet. Be the first!

Project Tasks

No tasks generated yet.

Tasks will appear here as requirements are defined.

Landing design preview
Landing: View Homepage
Landing: Drag Drop Upload
Upload: Select Video File
Preview: Watch Video
Settings: Select Language
Settings: Choose Voice
Settings: Start Dubbing
Processing: View Progress
Results: Download Video
History: View Recent Projects
Settings: Toggle Dark Mode