Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed for IT departments to manage and track user terminations within a company. It provides a structured workflow for handling tasks associated with user offboarding, allowing teams to monitor task completion rates and store relevant data in a database.

## CORE FEATURES
1. **User Management**: Ability to add, edit, and remove users who are leaving the company, capturing essential information.
2. **Task Workflow**: Define and assign mandatory and optional tasks that need to be completed during the offboarding process.
3. **Progress Tracking**: Monitor the completion percentage of tasks associated with each offboarding user, allowing for insights into workflow efficiency.
4. **Database Storage**: All task data and user information are securely stored in a database for easy retrieval and reporting.
5. **Reporting Dashboard**: A visual dashboard displaying key metrics such as total offboarded users, task completion rates, and overdue tasks.
6. **Notifications**: Automated alerts for the IT team to remind them of pending tasks and deadlines related to user offboarding.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with ample white space to enhance readability and focus on content.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure high contrast and legibility.
- **Layout**: 
  - Header section for navigation.
  - Main content area with a sidebar for task management and user details.
  - A central dashboard displaying key metrics and user progress.
  - Footer with contact information and links to support resources.
- **Typography**: 
  - Use a sans-serif font (e.g., Inter or Roboto) for clarity and modern appearance.
  - Headings should have a larger font size for hierarchy, while body text should be clear and legible.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type safety and component-based architecture.
- **Styling**: Tailwind CSS for utility-first styling, enabling rapid UI development.
- **UI Components**: Utilize shadcn/ui for pre-built, accessible components.
- **State Management**: Consider using React Query for data fetching and state management, especially for task tracking and user updates.

## IMPLEMENTATION STEPS
1. **Project Setup**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Database Integration**: Set up a backend with a database (e.g., PostgreSQL or MongoDB) to store user and task data.
3. **User Management Module**: Create components for adding, editing, and displaying users.
4. **Task Workflow Module**: Develop functionality to define tasks (mandatory and optional) and associate them with users.
5. **Progress Tracking Feature**: Implement logic to calculate and display task completion percentages.
6. **Dashboard Creation**: Build a dashboard component that visualizes key metrics using charts and tables.
7. **Notification System**: Integrate a notification system to alert users about pending tasks.
8. **Testing**: Conduct thorough testing to ensure functionality and usability across devices.
9. **Deployment**: Deploy the application to a cloud service (e.g., Vercel or Netlify) for public access.

## USER EXPERIENCE
Users will interact with the application through a streamlined interface, starting from an easy-to-navigate dashboard. They will be able to add new offboarding users quickly, assign tasks, and track the completion progress in real-time. Notifications will guide them through pending actions, ensuring a smooth and efficient offboarding process. The design will ensure that users can access information on any device seamlessly, enhancing overall usability.