Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Create a web application for task management inspired by Trello, featuring a modern and minimalist design. The application will allow users to organize their projects through boards, lists, and cards, enhancing collaboration and productivity with an intuitive interface.

## CORE FEATURES
1. **Board Management**
   - Users can create, edit, and delete boards, each representing a unique project.

2. **List Organization**
   - Each board contains multiple lists (e.g., "To Do," "In Progress," "Completed") that users can create, rename, and remove.

3. **Task Cards**
   - Users can create cards within lists, drag and drop them between lists, edit titles and descriptions, set due dates, and mark them as completed.

4. **Labeling and Comments**
   - Implement a color-coded labeling system, allow comments on cards, and enable file attachments for better task management.

5. **Real-Time Updates**
   - Ensure real-time updates across the application when tasks are moved or edited, keeping all users synchronized.

6. **User Authentication**
   - Include user login and registration, allowing users to have personalized boards and lists.

## DESIGN SPECIFICATIONS
- **Visual Style:** Minimalist—clean, simple design with ample white space and a focus on typography.
- **Color Mode:** Light theme with dark text on light backgrounds for readability.
- **Layout:** A Kanban-style layout that allows for easy organization of lists and cards, with a responsive design that adapts to desktop and mobile devices.
- **Typography:** Use a modern sans-serif font for clarity and professionalism, with a clear hierarchy for titles, headings, and body text.

## TECHNICAL REQUIREMENTS
- **Framework:** React with TypeScript for robust development.
- **Styling:** Tailwind CSS for fast and responsive design.
- **UI Components:** Utilize shadcn/ui for consistent and modern UI elements.
- **State Management:** Use Context API or Redux for effective state management across components.

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**
   - Initialize a new React project with TypeScript and install Tailwind CSS.
   
2. **Create Project Structure**
   - Organize components, pages, and services folders for better maintainability.

3. **Develop Authentication System**
   - Implement user registration and login functionalities, using JWT for authentication.

4. **Build Board, List, and Card Components**
   - Create reusable components for boards, lists, and cards with drag-and-drop functionality.

5. **Integrate Real-Time Updates**
   - Set up WebSocket or real-time database (e.g., Firebase) for instant updates when tasks are modified.

6. **Implement UI Design**
   - Apply Tailwind CSS styles to all components to achieve the desired minimalist aesthetic.

7. **Testing and Debugging**
   - Thoroughly test the application for usability and bugs, ensuring a smooth user experience.

## USER EXPERIENCE
- Users will have a seamless experience navigating through their boards and lists, with intuitive drag-and-drop interactions for task management. The application will be responsive, ensuring usability across devices, and provide real-time feedback on actions taken, enhancing collaboration among users.