Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves creating a personal website that showcases the skills and experience of a product manager. The website will serve as a marketing tool to highlight achievements, methodologies, and insights, engaging potential employers or collaborators with a clean and minimalist design.

## CORE FEATURES
1. **Hero Section**: A compelling introduction with a brief overview of the product manager's skills, accompanied by a professional photo and a call-to-action (CTA) button.
2. **About Me**: A section that details the product manager's background, experience, and approach to product management, presented in a concise and engaging format.
3. **Projects Showcase**: A visually appealing display of key projects, including descriptions, outcomes, and the methodologies applied, emphasizing the impact made.
4. **Testimonials**: A section featuring quotes from colleagues or clients that validate the product manager's expertise and effectiveness.
5. **Contact Form**: A simple form allowing visitors to reach out for inquiries or networking opportunities, with fields for name, email, and message.
6. **Blog/Insights**: (Optional) A section for sharing articles or thoughts on product management trends, showcasing thought leadership.

## 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 sections stacked vertically, ensuring smooth scrolling and easy navigation. The hero section at the top, followed by About Me, Projects Showcase, Testimonials, Contact Form, and an optional Blog/Insights section.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not required for this static content but can be considered for future enhancements.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui components via npm.
3. **Configure Tailwind CSS**: Set up the Tailwind configuration file and include the necessary styles in the main CSS file.
4. **Create Layout Structure**: Develop the basic structure of the app, including the main App component and individual section components (Hero, About Me, Projects, Testimonials, Contact).
5. **Implement Hero Section**: Design the hero section with a professional photo, introduction text, and CTA button styled with Tailwind classes.
6. **Build About Me Section**: Create a visually appealing layout that presents the product manager's background and approach.
7. **Showcase Projects**: Develop a grid or card layout for displaying projects, including images and descriptions.
8. **Add Testimonials**: Design a section for testimonials that can be displayed in a carousel or grid format.
9. **Create Contact Form**: Implement a simple form with validation that captures user input for name, email, and message.
10. **Optional Blog Section**: If desired, set up a simple blog layout to display articles or insights with links to full posts.
11. **Test and Optimize**: Ensure the website is responsive and works across different devices and browsers. Make adjustments as needed for optimal user experience.

## USER EXPERIENCE
The user experience should be intuitive, allowing visitors to easily navigate through sections with smooth scrolling. Each section will be visually distinct yet cohesive, ensuring that the focus remains on the content. The contact form will provide immediate feedback upon submission, encouraging engagement. The minimalist design will create a calming environment that highlights the product manager's capabilities without overwhelming the visitor with unnecessary information.