Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a personal portfolio website designed to showcase the user's background, skills, and projects in a clean, minimalist format. The site will feature sections that highlight the user's biography, educational background, personal skills, and various design projects in UI/UX, including web design, mobile app design, and analytics dashboards.

## CORE FEATURES
1. **About Me Section**: A brief introduction of the user, highlighting their personal story, values, and motivations.
2. **Education Background**: A timeline or list detailing the user's educational achievements and relevant coursework.
3. **Skills Section**: A categorized display of soft and hard skills, showcasing proficiency levels for each.
4. **Project Gallery**: A visually appealing showcase of projects grouped by categories (UI/UX, web design, mobile app design, analytics dashboard, etc.), with images and descriptions.
5. **Contact Form**: A simple form allowing visitors to reach out via email for inquiries or collaborations.
6. **Call to Action (CTA)**: Prominent buttons throughout the site encouraging visitors to view projects or contact the user.

## 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 a vertical scrolling structure that includes distinct sections for each core feature. Each section will be clearly defined with ample spacing to ensure a clean presentation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this project as it is primarily static.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript template.
   ```bash
   npx create-react-app portfolio --template typescript
   ```
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and components.
   ```bash
   npm install tailwindcss postcss autoprefixer
   npx tailwindcss init -p
   ```
3. **Configure Tailwind**: Set up Tailwind in `tailwind.config.js` and include its directives in your `index.css`.
4. **Create Layout Components**: Develop functional components for each section (About Me, Education, Skills, Projects, Contact).
5. **Implement Navigation**: Add a sticky navigation bar for easy scrolling between sections.
6. **Style Components**: Use Tailwind CSS classes to apply the defined design specifications, ensuring a responsive design.
7. **Deploy**: Choose a hosting platform (like Vercel or Netlify) for deployment.

## USER EXPERIENCE
The user will have a seamless experience navigating the portfolio. The sticky navigation allows easy access to each section. Each project in the gallery can be clicked to reveal more details or images, encouraging exploration. The contact form will be straightforward, enabling users to reach out effortlessly. The minimalist design ensures that users focus on content without distractions, while responsive design will provide a consistent experience across devices.