Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves creating a comprehensive financial management web application that offers users an intuitive interface for tracking their finances, visualizing spending habits through dynamic graphs, and managing budgets. The application aims to provide a modern, minimalist experience that prioritizes usability and clarity.

## CORE FEATURES
1. **User Authentication**: Secure sign-up and login functionality for users to create and manage their accounts.
2. **Dashboard**: A central hub displaying an overview of financial health, including income, expenses, and savings.
3. **Budget Tracking**: Tools for users to set budgets, track spending, and receive alerts when nearing budget limits.
4. **Visual Reports**: Interactive graphs and charts that visualize spending patterns and financial trends over time.
5. **Expense Categorization**: Ability for users to categorize expenses for better tracking and management.
6. **Goal Setting**: Features allowing users to set financial goals and track progress towards achieving them.

## 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 top navigation bar, a sidebar for quick access to features, and a central content area displaying the dashboard and reports.

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

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Components**:
   - Build the authentication components (sign-up, login).
   - Develop the dashboard layout with responsive design.
   - Implement budget tracking and expense categorization features.
   - Integrate charting libraries for visual reports.
4. **State Management**: Set up Redux for managing user authentication state and financial data.
5. **Testing**: Conduct unit tests and user testing to ensure functionality and user experience are up to standard.
6. **Deployment**: Deploy the application using a service like Vercel or Netlify.

## USER EXPERIENCE
Users will first encounter a clean login screen followed by a dashboard that presents a clear overview of their financial status. They can easily navigate through the sidebar to access budgeting tools, view visual reports, and manage their goals. The minimalist design ensures that users can focus on their financial data without distraction, promoting better financial management and planning.