Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to create a web application that serves as a clone of YouTube, enhancing the existing features while keeping the core functionalities intact. The application will allow users to upload, view, and share videos, similar to YouTube, but with improved performance and user experience.

## CORE FEATURES
1. **User Authentication:** Allow users to sign up, log in, and manage their profiles, including their uploaded videos and playlists.
2. **Video Upload and Management:** Users can upload videos, edit titles, descriptions, and tags, and manage their content seamlessly.
3. **Video Playback and Recommendations:** Offer a smooth video playback experience with an intelligent recommendation system to suggest videos based on user preferences.
4. **Search and Filters:** Implement a robust search functionality with filters to help users find videos quickly and efficiently.
5. **Comments and Interactions:** Allow users to comment on videos, like/dislike, and engage with other viewers to create a community feel.
6. **Playlists and Subscriptions:** Users can create playlists and subscribe to channels, providing personalized content delivery.

## DESIGN SPECIFICATIONS
- **Visual Style:** minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography
- **Color Mode:** Light theme with dark text on light backgrounds
- **Primary Color:** #1978E5 (accent for buttons, links, highlights)
- **Typography:** Use Inter from Google Fonts for headings, Inter for body text and UI elements
- **Border Radius:** 8px (moderately rounded) for buttons, cards, and inputs
- **Layout:** The main layout will feature a top navigation bar, a central video display area, and sidebars for recommendations and user interactions. The video grid will be responsive, adjusting to various screen sizes with a focus on usability.

## TECHNICAL REQUIREMENTS
- **Framework:** React with TypeScript
- **Styling:** Tailwind CSS
- **UI Components:** shadcn/ui
- **State Management:** Redux (for managing user authentication state and video data)

## IMPLEMENTATION STEPS
1. **Set up the Project:**
   - Initialize a new React project using Create React App with TypeScript.
   - Install necessary dependencies: Tailwind CSS, Redux, and shadcn/ui.

2. **Create Project Structure:**
   - Organize the project into components (e.g., Navbar, VideoPlayer, VideoGrid, UserProfile), pages (e.g., Home, Upload, Profile), and services (for API calls).

3. **Implement Authentication:**
   - Create authentication functionality using Firebase or a similar service for user sign-up and login.

4. **Build Video Upload Functionality:**
   - Implement a video upload form that allows users to upload videos and metadata.

5. **Develop Video Playback Feature:**
   - Create a video player component that supports playback, volume control, and full-screen options.

6. **Search and Filtering System:**
   - Implement a search bar and filters to allow users to find specific content easily.

7. **Integrate Comments and Users Interaction:**
   - Build a comments section under each video and implement like/dislike buttons.

8. **Test and Optimize:**
   - Conduct user testing to gather feedback and make iterative improvements based on usability findings.

## USER EXPERIENCE
Users will have a seamless experience while navigating through the application. Upon landing on the homepage, they will see a curated grid of videos tailored to their preferences. The top navigation bar provides easy access to search functionality, user profiles, and upload options. Users can interact with videos through comments and likes, creating a vibrant community atmosphere. The design emphasizes simplicity and clarity, ensuring that users can focus on content discovery without distractions.