Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The application is a web-based platform designed for creative individuals to explore, create, and share their artwork in a collaborative environment. It emphasizes a minimalist aesthetic, providing users with a clean and distraction-free space to express their creativity.

## CORE FEATURES
1. **User Profiles**: Users can create and customize profiles showcasing their artwork, bio, and social links, fostering a community feel.
2. **Art Creation Tools**: A set of intuitive tools allowing users to create digital art directly within the application, including brushes, color palettes, and layer management.
3. **Gallery Showcase**: A public gallery where users can display their artwork, receive feedback, and interact with other artists through comments and likes.
4. **Collaboration Spaces**: Dedicated areas where users can invite others to collaborate on projects in real-time, enhancing community engagement and teamwork.
5. **Art Challenges**: Weekly challenges to encourage creativity, with participants able to submit their works for community voting.
6. **Resource Library**: A collection of tutorials, articles, and tips for users to enhance their skills and inspire new ideas.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist design with a focus on simplicity and ample white space. The interface should be uncluttered, allowing artwork to take center stage.
- **Color Mode**: Light theme featuring dark text on light backgrounds to ensure readability and comfort.
- **Layout**: A grid-based layout for the gallery and a sidebar for navigation. The main content area should be flexible to accommodate varying artwork sizes while keeping the focus on user-generated content.
- **Typography**: Use a modern sans-serif font for body text (e.g., Inter or Helvetica) and a slightly bolder version for headings to create a clear hierarchy. Maintain consistent spacing for readability.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and enhanced developer experience.
- **Styling**: Tailwind CSS for utility-first design, enabling rapid styling and responsive design.
- **UI Components**: Utilize shadcn/ui components for a cohesive and polished user interface.
- **State Management**: Implement Redux or Context API as needed for managing application state effectively.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install required dependencies including Tailwind CSS and shadcn/ui.
2. **Create Layout Components**: Build the main layout components including Header, Sidebar, and Footer. Use Tailwind CSS for styling.
3. **Develop Core Features**: 
   - Implement user authentication and profile management.
   - Create art creation tools using canvas APIs.
   - Develop the gallery showcase with filtering and sorting options.
   - Set up collaboration spaces using WebSocket for real-time interactions.
   - Design and implement art challenges with voting functionality.
   - Build the resource library with categorized content.
4. **Optimize for Responsiveness**: Ensure all components are responsive and adapt seamlessly to different screen sizes using Tailwind’s responsive utilities.
5. **Testing**: Conduct thorough testing for functionality and user experience, focusing on accessibility and performance.
6. **Deployment**: Prepare the application for deployment on a web hosting platform, ensuring all assets are optimized.

## USER EXPERIENCE
Users will start by creating an account and customizing their profile. The intuitive navigation will allow them to easily access the art creation tools, gallery, and community features. The layout will guide users through the application with clear calls to action, such as “Create Art,” “Join a Challenge,” or “Explore the Gallery.” Feedback mechanisms (comments and reactions) will enhance interactions and encourage community engagement, ensuring a smooth and enjoyable user journey throughout the application.