Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The application is a web-based dashboard designed for comprehensive UI/UX auditing and enhancement proposals. Its main purpose is to provide an interactive platform for senior designers to assess, critique, and suggest improvements for various dashboard interfaces, ensuring a production-ready plan that enhances user experience.

## CORE FEATURES
1. **Dashboard Overview**: A high-level view of all active projects with key metrics, allowing users to quickly assess the status of each dashboard.
2. **Audit Tool**: A feature that enables users to perform detailed audits of UI components, workflows, and overall user experience, with the ability to add comments and suggestions.
3. **Enhancement Proposals**: Users can create and submit proposals for UI/UX enhancements, complete with visual examples and implementation plans.
4. **Feedback Loop**: A section for team members to provide feedback on proposals, ensuring collaborative improvement of the dashboards.
5. **User Journey Mapping**: Interactive mapping of user flows and paths to identify pain points and areas for improvement.
6. **Reporting System**: Generate reports based on audits and proposals to track progress and validate enhancements.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with plenty of white space to enhance readability and focus on content.
- **Color Mode**: Light theme with dark text on light backgrounds, ensuring high contrast and legibility.
- **Layout**: A structured layout featuring a sidebar for navigation, a main content area for dashboards, and a feedback panel for collaborative discussions. The layout should prioritize clarity and ease of use.
- **Typography**: Use a modern sans-serif font like Inter or Roboto for body text, with larger, bolder headings to create a clear hierarchy and guide the user’s eye through the dashboard.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building a robust and scalable application.
- **Styling**: Tailwind CSS for rapid styling and responsive design capabilities.
- **UI Components**: Utilize shadcn/ui for pre-built, accessible UI components that fit the minimalist aesthetic.
- **State Management**: Consider using Zustand or Redux for state management, depending on complexity needs.

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Initialize a new React project with TypeScript and integrate Tailwind CSS for styling.
2. **Create a Basic Layout Component**: Develop a layout component that includes a sidebar for navigation and a main content area.
3. **Build Core Features**: Implement each core feature as separate components, ensuring they are modular and reusable.
4. **Integrate UI Components**: Use shadcn/ui components for buttons, forms, and other UI elements to maintain consistency and accessibility.
5. **Implement State Management**: Set up Zustand or Redux for managing the application state and ensuring smooth interactions between components.
6. **Add Responsive Design**: Ensure all components are responsive and perform well on various screen sizes using Tailwind CSS utilities.
7. **Conduct User Testing**: Gather feedback from potential users to refine UI/UX elements and functionality before final deployment.

## USER EXPERIENCE
Users will interact with the dashboard by navigating through the sidebar to access the audit tool, enhancement proposals, and user journey mapping. They can perform audits by clicking on dashboard elements to reveal detailed feedback options. Proposals can be created with ease, allowing users to attach mockups and visual references. The feedback loop will facilitate discussions, enabling a collaborative approach to UI/UX enhancements. The overall experience will prioritize clarity, allowing users to focus on improving the dashboards without distraction.