Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The application is a vibrant, minimalist web app designed to provide users with accurate and real-time weather information. It aims to combine aesthetic appeal with functionality, allowing users to easily access and understand weather forecasts through a clean interface that embodies the Bauhaus design principles.

## CORE FEATURES
1. **Current Weather Overview**: Displays the current temperature, condition (sunny, rainy, etc.), and location with a simple, intuitive layout.
2. **5-Day Forecast**: A sleek, horizontal scrollable view that presents the weather forecast for the next five days, including temperature highs and lows.
3. **Interactive Map**: A minimalistic weather map showcasing different weather conditions in various regions; users can click on locations for more detailed forecasts.
4. **Search Functionality**: Allows users to search for weather information by city or region, with auto-suggestions and recent search history.
5. **Personalized Settings**: Users can customize units (Celsius/Fahrenheit) and themes (light/dark) to enhance their experience.
6. **Notifications**: Users can opt-in for weather alerts and updates, delivered in a non-intrusive manner.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The design will feature a clean and simple aesthetic with ample white space, focusing on essential elements while minimizing distractions.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure readability and a fresh look.
- **Layout**: A grid-based layout that organizes content into distinct sections, ensuring intuitive navigation. The header will feature the app logo and a search bar, while the main section will display weather data prominently.
- **Typography**: Use modern sans-serif fonts such as "Roboto" or "Helvetica Neue" for body text, and a bold typeface for headings. Maintain a clear hierarchy with larger font sizes for titles and smaller sizes for supporting text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for a robust and type-safe development process.
- **Styling**: Tailwind CSS for utility-first styling that promotes rapid UI development.
- **UI Components**: Utilize `shadcn/ui` for pre-designed components that fit the minimalistic aesthetic.
- **State Management**: Use React Context API or Zustand for managing application state, ensuring a smooth user experience.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install necessary dependencies including Tailwind CSS and shadcn/ui.
2. **Create Basic Layout**: Develop the main layout structure using Tailwind CSS, incorporating the header, main content area, and footer.
3. **Implement Core Features**: 
   - Build the Current Weather Overview component and integrate an API for real-time data.
   - Create the 5-Day Forecast component with a horizontal scrolling feature.
   - Develop the Interactive Map using a suitable mapping library.
   - Implement the Search Functionality with auto-suggestions.
   - Design the Personalized Settings page for user customization.
   - Set up Notification features with user preferences.
4. **Style Components**: Use Tailwind CSS to apply styling to components, ensuring they align with the minimalist design principles.
5. **Test User Interactions**: Conduct usability testing to gather feedback on user experience and make necessary adjustments.
6. **Deploy Application**: Prepare the application for deployment on a web hosting service, ensuring it meets performance and accessibility standards.

## USER EXPERIENCE
Users will enjoy a seamless interaction with the application, starting from the intuitive search bar that allows them to quickly find weather information. The clean layout will present the current weather and forecasts in an easily digestible format, with smooth transitions and responsive design ensuring usability across devices. Notifications will be unobtrusive, allowing users to stay informed without overwhelming them, creating an overall pleasant user experience.