Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a minimalist web portfolio designed for machine learning engineers to showcase their projects, skills, and experiences without the need for a backend or cloud infrastructure. The focus is on simplicity and clarity, allowing users to navigate seamlessly through the content.

## CORE FEATURES
1. **Project Showcase**: A dedicated section to display various machine learning projects, including descriptions, technologies used, and links to GitHub repositories or live demos.
2. **Skills Matrix**: An interactive grid that highlights the user's skills in various machine learning tools and frameworks with visual indicators of proficiency.
3. **About Me Section**: A personal introduction area where users can share their background, education, and interests in machine learning.
4. **Contact Form**: A simple form that allows potential employers or collaborators to reach out via email, ensuring easy communication.
5. **Responsive Design**: A layout that adapts seamlessly across devices, ensuring a consistent user experience on desktops, tablets, and mobile devices.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist with a focus on clean lines and ample white space, allowing content to stand out without distractions.
- **Color Mode**: Light theme featuring dark text on light backgrounds to enhance readability.
- **Layout**: A single-page layout with a vertical scroll structure. The header contains navigation links, followed by sections for Projects, Skills, About Me, and Contact, each clearly defined and spaced.
- **Typography**: Use a sans-serif font family such as "Roboto" or "Open Sans" for clean readability. Establish a hierarchy with larger headings (H1 for section titles, H2 for subsections, and body text in a regular size).

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building interactive UI components.
- **Styling**: Tailwind CSS for utility-first styling, allowing rapid design adjustments while maintaining a consistent look.
- **UI Components**: Utilize shadcn/ui for pre-built components that align with the minimalist design.
- **State Management**: Use local state management with React hooks; no external libraries are necessary for this project.

## IMPLEMENTATION STEPS
1. **Set up the Project**: Initialize a new React application using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create a Layout Component**: Build a header component for navigation and a footer component for contact details.
4. **Develop Core Sections**: Implement components for Project Showcase, Skills Matrix, About Me, and Contact Form, ensuring to follow the minimalist design guidelines.
5. **Style the Application**: Use Tailwind CSS classes to apply the minimalist color scheme and typography throughout the application.
6. **Implement Responsiveness**: Utilize Tailwind CSS breakpoints to ensure the application is fully responsive.
7. **Test User Interactions**: Ensure all links and forms function as intended and provide a smooth user experience.

## USER EXPERIENCE
Users will land on a clean homepage featuring the portfolio header, navigable sections, and a clear call to action. The Projects section will allow users to click through to detailed views of each project, while the Skills Matrix presents an engaging way to visualize expertise. The About Me section provides a personal touch, and the Contact Form is easily accessible for inquiries. Overall, the experience is designed to be straightforward, allowing users to focus on the content without unnecessary distractions.