Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed to provide a project management tool similar to Trello, tailored exclusively for managing personal projects. It will feature an interactive board, table, calendar, timeline (Gantt), and progress panel to facilitate efficient project organization and tracking.

## CORE FEATURES
- **Board View**: A Kanban-style board to organize tasks, allowing users to drag and drop cards between columns representing different stages of the project.
- **Table View**: A spreadsheet-like interface for detailed task management, enabling users to sort, filter, and edit task attributes easily.
- **Calendar Integration**: A calendar view that displays tasks and deadlines clearly, allowing users to manage their schedules effectively.
- **Gantt Timeline**: A visual representation of project timelines, enabling users to see task durations, dependencies, and overall project progress.
- **Progress Panel**: A dashboard that provides insights into project status, including completed tasks, upcoming deadlines, and overall progress metrics.

## 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 consist of a sidebar for navigation, a top bar for search and actions, and a central content area that dynamically adjusts based on the selected view (board, table, calendar, or timeline).

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Zustand for managing application state (if needed)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui components to the project.
3. **Create Layout Structure**: Implement the main layout with a sidebar, top bar, and central content area.
4. **Develop Core Features**: 
   - Build the Board View component with drag-and-drop functionality.
   - Create the Table View component with sorting and filtering capabilities.
   - Integrate a Calendar component to display tasks.
   - Implement the Gantt Timeline component for project scheduling.
   - Design the Progress Panel to visualize project metrics.
5. **Implement State Management**: Set up Redux or Zustand to handle the application's state across different components.
6. **Apply Styling**: Use Tailwind CSS to style components according to the design specifications.
7. **Test Responsiveness**: Ensure that the application is fully responsive across various devices and screen sizes.

## USER EXPERIENCE
Users will interact with the application by selecting different views (board, table, calendar, Gantt) through the sidebar. They can create, edit, and delete tasks with intuitive drag-and-drop functionality on the board. The table view allows for detailed manipulation of task attributes, while the calendar and Gantt views provide visual timelines for better project management. The progress panel will give quick insights into the project's status, ensuring users stay informed about their tasks and deadlines.