Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a web design agency that focuses on creating custom projects tailored to clients' unique ideas and workflows. The landing page will embody a high-quality, minimalist design similar to Apple.com, emphasizing smooth animations and a clean user experience to encourage potential clients to schedule a call.

## CORE FEATURES
1. **Hero Section**: A visually striking introduction with a clear value proposition and a prominent call-to-action (CTA) button to schedule a call.
2. **Services Overview**: A concise description of the custom web design services offered, featuring engaging visuals and brief explanations.
3. **Client Testimonials**: A section showcasing client feedback to build trust and credibility, using smooth animations for transitions.
4. **Portfolio Showcase**: A gallery of past projects to demonstrate the agency's capabilities and design quality, enhancing visual appeal.
5. **Contact Form**: An easy-to-use form allowing potential clients to reach out for inquiries or to schedule a consultation, integrated with smooth transitions.
6. **FAQ Section**: Frequently asked questions to address common client concerns and provide additional information about the services.

## 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**: A single-page layout with a fixed navigation bar, smooth scrolling to sections, and well-defined areas for each feature, ensuring easy navigation and readability.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specifically required for this landing page, but React Context or a simple state management solution can be considered if needed.

## IMPLEMENTATION STEPS
1. **Project Setup**: Initialize a new React project with TypeScript and install Tailwind CSS for styling.
2. **Create Components**: Develop reusable components for the hero section, services overview, testimonials, portfolio, contact form, and FAQ section.
3. **Implement Navigation**: Set up a fixed navigation bar that smoothly scrolls to different sections of the landing page.
4. **Design Layout**: Use Tailwind CSS to style each section according to the specified design guidelines, ensuring a minimalist aesthetic.
5. **Add Animations**: Integrate smooth scrolling and animations for transitions between sections to enhance user experience.
6. **Testing and Optimization**: Test the landing page across different devices and browsers to ensure responsiveness and performance.

## USER EXPERIENCE
The user experience will focus on simplicity and clarity, allowing visitors to easily navigate through the landing page. Key interactions include:
- **Smooth Scrolling**: Users can smoothly scroll to different sections via navigation links.
- **Interactive Elements**: Hover effects on buttons and links to enhance engagement.
- **Quick Access to Information**: The layout ensures that users can quickly find information about services, testimonials, and contact options without feeling overwhelmed.

This comprehensive prompt is designed to help you create a fully functional minimalist landing page that aligns with your vision for your web design agency.