Lovable Prompt Creator - AI Prompt Generator

#```markdown
# APPLICATION OVERVIEW
This project is a web application designed as a dashboard system that provides users with an organized and efficient way to manage and visualize their data. The dashboard will feature a minimalist aesthetic, focusing on usability and clarity, allowing users to access vital information at a glance.

# CORE FEATURES
1. **User Authentication**: Secure login and registration system to manage user accounts and data access.
2. **Data Visualization**: Interactive charts and graphs that display key metrics clearly and concisely.
3. **Customizable Widgets**: Users can add, remove, and rearrange widgets to personalize their dashboard view.
4. **Real-time Updates**: Automatic data refresh to ensure the information displayed is current and relevant.
5. **Notifications**: Alerts and notifications for important updates or actions required by the user.
6. **Settings Management**: Options for users to configure their preferences and manage their account settings.

# 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 header for navigation, a sidebar for additional options, and a central content area displaying the dashboard metrics and widgets. The layout will be responsive to ensure usability across devices.

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

# IMPLEMENTATION STEPS
1. **Initialize the Project**: Set up a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Add Tailwind CSS, shadcn/ui, and Redux (if state management is required) to your project.
3. **Configure Tailwind CSS**: Set up Tailwind by creating the configuration files and integrating it into your project.
4. **Create Components**: Develop reusable components for the dashboard, including a header, sidebar, and widget cards.
5. **Implement Authentication**: Set up user authentication using a suitable method (e.g., Firebase, Auth0).
6. **Data Integration**: Connect the application to data sources (APIs or databases) for real-time data fetching.
7. **Implement Routing**: Set up routing for different application views using React Router.
8. **Test Responsiveness**: Ensure the application is responsive and adjusts to various screen sizes.
9. **Final Testing**: Conduct thorough testing to identify and fix bugs before deployment.

# USER EXPERIENCE
Users will interact with the dashboard through a clean and intuitive interface. Upon logging in, they will see their personalized dashboard with real-time data visualizations. Users can customize their experience by rearranging widgets and setting preferences in the settings menu. Notifications will alert them to important updates, ensuring they can take timely actions based on the data presented.
```