Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application serves as an intelligent budgeting tool that automatically categorizes expenses for users. By leveraging AI technology, the app simplifies the budgeting process, allowing users to gain insights into their spending habits while maintaining an organized overview of their finances.

## CORE FEATURES
1. **Automatic Categorization**: Utilizes machine learning algorithms to automatically categorize transactions into predefined categories such as groceries, entertainment, utilities, etc.
2. **Budget Tracking**: Allows users to set and monitor budgets for each category, providing visual feedback on spending against budget limits.
3. **Expense Analysis**: Generates reports and visualizations to help users understand their spending patterns over time.
4. **User-Friendly Dashboard**: A clean and intuitive dashboard displaying key metrics, recent transactions, and budget statuses at a glance.
5. **Customizable Categories**: Users can create, edit, and delete categories to tailor the app to their specific needs.
6. **Responsive Design**: Ensures accessibility and usability on various devices, including desktops, tablets, and smartphones.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist design focusing on simplicity, with ample white space to enhance readability and user engagement.
- **Color Mode**: Light theme featuring dark text on light backgrounds, promoting clarity and ease of navigation.
- **Layout**: A clean, grid-based layout that organizes content into distinct sections, with a sidebar for navigation and a main content area for detailed views.
- **Typography**: Use of sans-serif fonts for a modern look; headings should be bold and prominent, while body text remains subtle yet legible.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript to ensure type safety and scalability of the application.
- **Styling**: Tailwind CSS for utility-first styling, allowing for rapid and responsive design adjustments.
- **UI Components**: Integration with shadcn/ui for reusable and customizable components that align with the minimalist design.
- **State Management**: Utilize Redux or Context API as needed to manage application state efficiently.

## IMPLEMENTATION STEPS
1. **Set up the Development Environment**: Initialize a new React project with TypeScript and install necessary dependencies, including Tailwind CSS and shadcn/ui.
2. **Create the App Structure**: Organize the project files into components, pages, and styles folders to facilitate maintainability.
3. **Develop Core Features**:
   - Implement the automatic categorization feature using a machine learning API or library.
   - Create the budget tracking and expense analysis functionalities, ensuring they are integrated with state management.
4. **Design the User Interface**: Build the minimalist layout using Tailwind CSS, focusing on creating responsive components that adapt to various screen sizes.
5. **Test User Interactions**: Conduct usability testing to refine user flows, ensuring intuitive navigation and interaction with the app.
6. **Deploy the Application**: Use a platform like Vercel or Netlify for deployment, ensuring that the app is accessible to users.

## USER EXPERIENCE
Users will start by onboarding through a simple, guided setup process where they can link their bank accounts and set initial budget categories. The dashboard will present a clear overview of their spending, with visual indicators showing how close they are to exceeding their budget. Users can click on categories to dive deeper into their spending habits and receive tailored insights based on their transaction history. The responsive design ensures that users can seamlessly interact with the app on any device, providing a consistent and engaging experience.