Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The application is a web app designed for a solar company, aimed at providing users with information about solar products, services, and energy solutions. The platform will allow users to explore solar options, request quotes, and learn about the benefits of solar energy, all while maintaining a clean and user-friendly interface.

## CORE FEATURES
1. **Product Catalog**: A comprehensive listing of solar products including panels, inverters, and accessories with detailed descriptions and specifications.
2. **Quote Request Form**: A user-friendly form that allows potential customers to request quotes for solar installations based on their specific needs.
3. **Educational Resources**: A section dedicated to articles, videos, and FAQs about solar energy, installation processes, and financing options.
4. **Customer Testimonials**: A feature showcasing reviews and experiences from satisfied customers to build trust and credibility.
5. **Contact Information**: An easy-to-access contact page with multiple ways to reach the company including phone, email, and live chat options.
6. **Newsletter Signup**: An option for users to subscribe to a newsletter to receive updates on new products, offers, and industry news.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist with a focus on a clean and simple design, emphasizing ample white space to enhance readability and user focus.
- **Color Mode**: Light theme featuring dark text on light backgrounds to ensure high contrast and readability.
- **Layout**: A grid-based layout with a clear header, a prominent hero section for key messages, followed by organized sections for products, resources, and testimonials, all easily navigable.
- **Typography**: Use a sans-serif font like 'Helvetica Neue' for a modern look, with varying font sizes to establish a clear hierarchy—larger sizes for headings and smaller sizes for body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type-checking and component-based architecture.
- **Styling**: Tailwind CSS to facilitate a responsive and customizable design.
- **UI Components**: Utilize shadcn/ui for pre-built, accessible UI components that align with the minimalist aesthetic.
- **State Management**: Use React's Context API or Redux as needed for global state management.

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Install Node.js, create a new React project with TypeScript, and integrate Tailwind CSS for styling.
2. **Build the Layout**: Create the main layout using a grid system, ensuring to leave ample space for content and navigation.
3. **Develop Core Features**:
   - Implement the product catalog with dynamic fetching of data.
   - Create the quote request form with validation.
   - Develop the educational resources section with categorized content.
   - Integrate the customer testimonials feature with a carousel display.
   - Set up the contact information page with a simple form and links.
   - Add the newsletter signup form and connect it to an email marketing service.
4. **Style Components**: Use Tailwind CSS to style all components, ensuring they align with the minimalist design principles.
5. **Test Responsiveness**: Verify the application on various devices to ensure it maintains usability and aesthetics.
6. **Deploy the Application**: Use a platform like Vercel or Netlify for deployment, ensuring optimal performance and accessibility.

## USER EXPERIENCE
The user journey begins on the homepage, where visitors are greeted with a clear header and a compelling hero section. Users can easily navigate to the product catalog, read educational resources, or request a quote. Each section is designed to be intuitive, with simple forms and clear calls to action. The layout ensures that users can quickly find the information they need, enhancing their experience and encouraging engagement with the solar company's offerings.