Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a high-converting SaaS landing page designed for AI application development. It aims to effectively showcase the benefits of a rapid, 21-day development sprint that includes AI integration, appealing to startups and businesses looking for efficient and innovative solutions.

## CORE FEATURES
1. **Hero Section**: Engaging headline and subheadline emphasizing the quick turnaround and comprehensive service.
2. **Value Proposition**: Clear articulation of benefits including fixed pricing, no equity loss, and full ownership of the codebase.
3. **Tech Stack Showcase**: Display of industry-leading technology logos to establish credibility.
4. **3-Week Breakdown**: Visual timeline detailing each week’s focus in the development process.
5. **Featured Capabilities**: Highlight of key features such as GPT/Claude integration and user authentication.
6. **Success Metrics Section**: Showcases previous projects with metrics to build trust and demonstrate effectiveness.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist design focusing on clarity with ample white space. The layout should be modern and clean, emphasizing the typography and content.
- **Color Mode**: Light theme featuring a combination of dark text on light backgrounds with accent colors of electric blue and mint green for interactive elements.
- **Layout**: A single-page layout with distinct sections for the Hero, Value Proposition, Tech Stack, Timeline, Features, Success Metrics, Comparison Table, and Dual CTA, ensuring smooth vertical scrolling and quick navigation.
- **Typography**: Use a sans-serif font for a modern feel, with headlines in bold for emphasis and body text in regular weight for easy readability. Maintain a consistent hierarchy with larger sizes for headings and smaller sizes for descriptions.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type safety and component-based architecture.
- **Styling**: Tailwind CSS for utility-first styling, enabling quick adjustments and responsive design.
- **UI Components**: Utilize shadcn/ui for pre-built, customizable components to ensure consistency and speed in development.
- **State Management**: Implement Redux or Context API for managing application state as needed.

## IMPLEMENTATION STEPS
1. **Set up the development environment**: Create a new React project with TypeScript and install Tailwind CSS.
2. **Build the Hero Section**: Implement the headline, subheadline, and primary CTA button with interactive elements, integrating an AI app mockup or demo video.
3. **Create the Value Proposition Section**: Use bullet points to list the benefits succinctly.
4. **Design the Tech Stack Showcase**: Create a responsive grid to display technology logos.
5. **Implement the 3-Week Breakdown**: Design a timeline with visual indicators for each week’s focus.
6. **Add the Featured Capabilities Section**: List capabilities with icons for visual interest.
7. **Develop the Success Metrics Section**: Create a card layout to display project metrics effectively.
8. **Build the Comparison Table**: Design a table that clearly contrasts traditional development with the 21-day sprint.
9. **Incorporate the Dual CTA**: Ensure both CTAs are prominent and visually distinct.
10. **Final touches**: Add trust badges and ensure all elements are responsive across devices.

## USER EXPERIENCE
The user experience should be intuitive and straightforward, guiding visitors seamlessly through the information. Key interactions include clicking the primary CTA to initiate the project, interacting with the timeline for more details, and exploring featured capabilities. The layout and interactive elements should foster engagement, ensuring that users can easily navigate and understand the offerings without distractions. Responsive design will ensure that the application performs well on both desktop and mobile devices, enhancing accessibility and user satisfaction.