Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a multi-page website for an eye care clinic, designed to provide essential information about services, team, and contact options while ensuring a premium and unique user experience. The design will focus on a minimalist aesthetic, utilizing ample white space and a simple color palette that emphasizes typography for clarity and professionalism.

## CORE FEATURES
1. **Home Page**: A welcoming hero section with a brief introduction to the clinic, featuring a prominent call-to-action button for booking appointments.
2. **Services Page**: Detailed descriptions of the various eye care services offered, each with accompanying images and clear navigation options.
3. **About Us Page**: Information about the clinic’s history, mission, and the professional team, including bios and images to build trust with potential patients.
4. **Testimonials Page**: A dedicated section for patient testimonials to highlight positive experiences and build credibility.
5. **Contact Page**: Easy-to-use contact form for inquiries, clinic address, phone number, and a map integration for directions.
6. **Appointment Booking**: A user-friendly system for patients to schedule appointments online, integrated into the website for ease of use.

## 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 for easy access to different pages, with a consistent header and footer across all pages. Each page will have a clear structure featuring a hero section, content area, and call-to-action elements.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for responsive design and utility-first styling.
- **UI Components**: Utilize shadcn/ui for consistent and modern UI components.
- **State Management**: Not explicitly required but can use React Context API or Redux if needed for managing application state.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create the Page Structure**: Develop the routing setup using React Router to manage navigation between the Home, Services, About Us, Testimonials, Contact, and Appointment Booking pages.
3. **Design the Components**: Utilize Tailwind CSS to create reusable components for buttons, forms, cards, and the navigation bar, ensuring adherence to the design specifications.
4. **Implement Content**: Populate each page with relevant content, ensuring that the typography and color scheme are consistently applied.
5. **Integrate Appointment Booking**: Implement a form for patients to book appointments, ensuring it is user-friendly and linked to backend services if necessary.
6. **Test Responsiveness**: Ensure the website is fully responsive, adapting seamlessly to various screen sizes and devices.

## USER EXPERIENCE
The user experience will focus on simplicity and ease of navigation. Users will be greeted with a clean home page that allows them to quickly access the information they need. Each section will be easy to read and navigate, with clear calls to action guiding users towards booking appointments or contacting the clinic. The minimalist design will enhance readability and ensure that users can find information without distraction.