Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for TheSkinClinic, a premium skincare business based in Abuja. The website aims to provide a professional and inviting online presence that showcases services, features a contact form, and includes a map for easy navigation to the clinic. The design will focus on a minimalist aesthetic with a light theme to enhance user experience and conversion rates.

## CORE FEATURES
1. **Hero Section**: A prominent area at the top of the page featuring the clinic’s name, a brief tagline, and a call-to-action button encouraging users to get in touch.
2. **Services Overview**: A section detailing the various skincare services offered, such as acne treatment, chemical peels, and botox, to inform potential clients about available options.
3. **Contact Form**: An interactive form where users can input their name, email, WhatsApp number, and a short message to facilitate communication with the clinic.
4. **Map Integration**: A visual map section showing the location of TheSkinClinic, allowing users to easily find directions and understand the clinic's proximity.
5. **Gallery**: A space dedicated to showcasing photos of the clinic and its services, enhancing visual appeal and providing social proof.
6. **Testimonials Section**: A section highlighting reviews and ratings from previous customers to build trust and credibility.

## 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 be structured with a clear hierarchy, starting with the hero section at the top, followed by service details, the contact form, map integration, gallery, and testimonials. Each section will be visually separated to enhance readability and engagement.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for responsive and utility-first styling.
- **UI Components**: Use shadcn/ui for consistent and accessible component design.
- **State Management**: Not specified, but consider using React's built-in state management for form handling.

## IMPLEMENTATION STEPS
1. **Set up the React application**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create the main layout**: Implement the layout structure with sections for the hero, services, contact form, map, gallery, and testimonials.
3. **Design the hero section**: Add text elements and a call-to-action button styled with the primary color and typography specifications.
4. **Develop the services overview**: Create a grid or list layout to display the skincare services, ensuring each service is clearly defined.
5. **Implement the contact form**: Build the form with input fields for name, email, WhatsApp number, and message, applying the specified styling.
6. **Integrate the map**: Use a mapping service (like Google Maps) to embed a map showing the clinic's location.
7. **Create the gallery**: Design and implement a responsive gallery to showcase images related to the clinic.
8. **Add testimonials**: Include a section for customer reviews, ensuring it is visually appealing and easy to read.
9. **Test responsiveness**: Ensure that the website is fully responsive and looks great on various devices.

## USER EXPERIENCE
Users will be greeted with a visually appealing hero section that draws them in, followed by clear information about services. The contact form will be easy to fill out, ensuring quick and effective communication. The map integration will help users find directions with ease, while the gallery and testimonials will provide a sense of trust and professionalism, encouraging potential clients to reach out to TheSkinClinic. Overall, the user experience will be seamless, engaging, and informative, aligning with the premium vibe of the brand.