Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project will be a minimalist landing page designed to help users find job opportunities immediately, focusing on remote and in-person jobs. The site will highlight the user's skills and experiences, showcasing their programming knowledge and familiarity with tools like Excel. The primary goal is to convert visitors into potential employers or clients.

## CORE FEATURES
1. **Hero Section**: A visually striking introduction that presents the user’s skills and offers a clear call-to-action for employers to get in touch.
2. **Skills Showcase**: A section that outlines the user's programming abilities, physical work experience, and proficiency in Excel with bullet points or icons for visual clarity.
3. **Project Highlights**: A gallery or list of small projects, like "vibe coding," that demonstrate the user's technical skills and creativity.
4. **Testimonials**: Short quotes or endorsements from previous employers or colleagues to build credibility and trust.
5. **Contact Form**: An easy-to-use form for potential employers to reach out, with fields for name, email, and a message.
6. **Call-to-Action Buttons**: Strategically placed buttons throughout the page encouraging users to contact the individual or view their projects.

## 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-column layout with sections stacked vertically, ensuring easy readability and navigation. The hero section will be at the top, followed by skills, projects, testimonials, and contact form.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specifically required for this landing page, but could be added for form handling.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Components**: Build individual components for the hero section, skills showcase, project highlights, testimonials, and contact form.
3. **Implement Layout**: Use Flexbox or Grid in Tailwind CSS to arrange sections vertically in a single-column layout.
4. **Style Components**: Apply the specified design specifications, including typography, colors, and border radius using Tailwind CSS classes.
5. **Add Interactivity**: Implement the contact form with state management to handle user input and submissions.
6. **Test Responsiveness**: Ensure the layout is responsive across different devices and screen sizes.

## USER EXPERIENCE
Users will be greeted with a clear and engaging hero section that immediately communicates the user’s value proposition. Navigation will be seamless, with each section easily accessible as they scroll down. The contact form will be straightforward, making it simple for potential employers to reach out. The overall experience will emphasize clarity and ease of use, encouraging visitors to engage and connect with the individual seeking job opportunities.