Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to develop a mobile web application similar to YouTube, allowing users to upload, watch, like, comment, and share videos. The application will focus on a clean and modern interface, providing a seamless user experience for video consumption and interaction.

## CORE FEATURES
- **Home Page**: Displays a curated list of recommended videos based on user preferences and trending content.
- **Search Functionality**: A search bar for users to easily find videos by keywords, titles, or channels.
- **Video Player**: An integrated player with controls for play, pause, volume adjustment, and full-screen viewing.
- **Video Upload**: A dedicated button to allow users to upload their videos effortlessly.
- **Engagement Buttons**: Options for users to like, dislike, comment, and share videos, facilitating community interaction.
- **User Profile/Channel Page**: A personalized space for users to manage their content and subscriptions, showcasing their uploaded videos.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The design will prioritize clean lines, ample white space, and a minimal color palette to enhance usability and focus on content.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure readability and a fresh appearance.
- **Layout**: 
  - A bottom navigation bar featuring icons for Home, Shorts, Upload (+), Subscriptions, and Library for easy access.
  - A grid layout for the home page showcasing video thumbnails with titles and engagement metrics beneath.
- **Typography**: 
  - Primary Font: "Roboto" for a modern feel with good legibility.
  - Hierarchy: Use larger font sizes for headings and smaller sizes for video titles and descriptions to establish a clear visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for a robust and type-safe development experience.
- **Styling**: Tailwind CSS to facilitate responsive design and maintain a consistent minimalist aesthetic.
- **UI Components**: Utilize shadcn/ui for pre-built, customizable components that align with the overall design.
- **State Management**: Implement Zustand or React Context for managing user authentication and video states efficiently.

## IMPLEMENTATION STEPS
1. **Project Setup**: Initialize a new React project with TypeScript and install necessary dependencies (Tailwind CSS, Zustand, shadcn/ui).
2. **Create Layout**: Build the main layout with the bottom navigation bar and a responsive grid for the home page.
3. **Implement Core Features**:
   - Develop the video upload functionality with file input and API integration for storage.
   - Create the video player component with all necessary controls.
   - Set up the search functionality to filter videos based on user input.
   - Develop user profile and channel pages to display uploaded content and subscriptions.
4. **Style the Application**: Use Tailwind CSS to apply the minimalist design elements, ensuring consistency across pages.
5. **Testing and Optimization**: Conduct user testing for usability and performance, optimizing the app for mobile devices.

## USER EXPERIENCE
Users will experience a straightforward and intuitive interface. Upon launching the app, they will be greeted by the home page filled with recommended videos. The search bar will enable quick navigation, while the video player provides an engaging viewing experience. Users can effortlessly upload content, interact through likes and comments, and manage their profiles, ensuring a seamless flow throughout the application. The bottom navigation bar will provide easy access to all key functionalities, enhancing overall user satisfaction.