Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed to assist users in budgeting by integrating with their bank accounts. The main purpose is to help users save money by identifying their spending habits, suggesting cheaper alternatives for services, and providing insights into their financial health.

## CORE FEATURES
1. **Bank Integration**: Securely connect users' bank accounts to automatically import and categorize transactions for easy tracking.
2. **Budgeting Dashboard**: A comprehensive dashboard displaying users' spending habits, budget allocations, and savings goals.
3. **Provider Comparison**: Analyze users’ spending on services and suggest cheaper alternatives based on market data.
4. **Savings Goals**: Allow users to set and track savings goals with visual progress indicators.
5. **Alerts and Notifications**: Send alerts for overspending, bill payments, and suggestions for saving opportunities.
6. **Reports and Insights**: Generate monthly reports that summarize spending, highlight trends, and recommend areas for potential savings.

## 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 layout will feature a top navigation bar, a central dashboard area with widgets for each core feature, and a sidebar for quick access to budgeting tools and settings.

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

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template. Install dependencies including Tailwind CSS and Redux Toolkit.
2. **Design Layout**: Create the main layout structure with a top navigation bar and a responsive dashboard using Tailwind CSS for styling.
3. **Implement Bank Integration**: Set up secure OAuth for bank account integration. Use APIs like Plaid for transaction data.
4. **Build Core Features**: 
   - Develop the budgeting dashboard displaying user data.
   - Implement provider comparison logic to suggest alternatives.
   - Create forms for setting and tracking savings goals.
5. **Add Notifications**: Integrate a notification system to alert users of important updates or suggestions.
6. **Testing**: Conduct thorough testing for functionality, security, and responsiveness across devices.
7. **Deployment**: Deploy the application using a platform like Vercel or Netlify for public access.

## USER EXPERIENCE
Users will have a seamless experience starting from account creation and bank integration to viewing their spending habits on the dashboard. They will receive personalized insights and recommendations based on their financial data, allowing them to make informed decisions about their budgeting and saving strategies. The interface will be intuitive, ensuring users can navigate easily between features and access the information they need quickly.