Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a 3D animated landing page designed to captivate visitors with a visually engaging experience while effectively communicating the brand's message. The landing page will feature a minimalist design, focusing on clarity and simplicity, making it easy for users to navigate and understand the offerings.

## CORE FEATURES
1. **Hero Section**: A striking 3D animated header that grabs attention, featuring a brief tagline and a primary call-to-action button.
2. **Features Showcase**: A section highlighting key features or services offered, using succinct descriptions and engaging visuals.a
3. **Testimonials**: A dedicated area for user testimonials to build trust and credibility, using a clean layout that emphasizes user feedback.
4. **Call-to-Action (CTA)**: Strategically placed buttons throughout the page to encourage users to take action, such as signing up or learning more.
5. **Contact Information**: A simple contact form for inquiries, with fields for name, email, and message.
6. **Footer**: A minimalist footer containing links to social media and additional resources.

## 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 be a single-page structure with a vertical flow, featuring sections for the hero, features, testimonials, CTA, and contact, ensuring smooth scrolling and easy navigation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this static landing page, but can be incorporated if needed for dynamic content.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Layout**: Develop the main layout structure with sections for the hero, features, testimonials, CTA, and contact.
3. **Implement Hero Section**: Add the 3D animation to the hero section and include text and CTA button styled with Tailwind CSS.
4. **Feature Section**: Create a grid or card layout displaying key features with brief descriptions and relevant icons.
5. **Testimonials Section**: Design a simple carousel or list to showcase user testimonials, ensuring readability and visual appeal.
6. **Contact Form**: Implement a contact form with necessary fields and validation, styled using Tailwind CSS.
7. **Footer**: Add a footer with social media links and any additional information, ensuring it aligns with the minimalist theme.
8. **Responsive Design**: Test and ensure that all elements are responsive across various devices and screen sizes.

## USER EXPERIENCE
The user experience will focus on simplicity and engagement. Users will be greeted by an eye-catching hero section that encourages them to explore further. As they scroll, they will encounter well-structured sections that provide essential information in a digestible format. The intuitive navigation and strategically placed CTAs will guide users towards taking desired actions, whether that be signing up or reaching out for more information. The overall experience will be smooth and visually appealing, ensuring users remain engaged throughout their visit.