Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a comprehensive landing page designed to showcase the portfolio of a developer specializing in Minecraft server logos, Discord bots, and Minecraft development. The site will serve as a professional online presence, highlighting the developer's skills, experience, and projects in a clean and animated format.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a background animation, a brief overview of the developer, and a call-to-action (CTA) button leading to the portfolio section.
2. **Portfolio Showcase**: A visually appealing grid layout displaying the developer’s best work, including logos, Discord bots, and Minecraft projects with hover effects for interactivity.
3. **Experience Overview**: A section detailing the developer's experience, emphasizing 2 years in bot development, 4 years in Minecraft development, and 1.5 years in design, presented with engaging animations.
4. **Testimonials**: A carousel featuring client testimonials to build credibility and showcase the developer's impact on previous projects.
5. **Contact Section**: A simple contact form allowing potential clients to reach out, complete with smooth animations and validation feedback.
6. **Animated Transitions**: Smooth transitions and hover effects throughout the site to enhance user engagement and create a dynamic experience.

## 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**: The layout will be structured as a single-page scrollable format, featuring sections for the hero, portfolio, experience, testimonials, and contact, with a sticky navigation menu for easy access.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for responsive design and utility-first styling.
- **UI Components**: shadcn/ui to enhance the user interface.
- **State Management**: React's built-in state management for handling form inputs and animations.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Components**: Develop individual components for the hero section, portfolio showcase, experience, testimonials, and contact form.
3. **Implement Routing**: Set up a sticky navigation menu that allows users to scroll smoothly to different sections of the page.
4. **Add Animations**: Use CSS animations or libraries like Framer Motion to create engaging transitions and effects on hover.
5. **Style Components**: Apply Tailwind CSS classes to achieve the minimalist design, ensuring responsiveness across devices.
6. **Test and Optimize**: Test the website for performance and responsiveness, making adjustments as needed.

## USER EXPERIENCE
The user experience will focus on intuitive navigation and engaging interactions. Users will be greeted by an animated hero section that draws them in. As they scroll, they will encounter a visually appealing portfolio and experience section, complemented by client testimonials that enhance credibility. The contact form will be straightforward, allowing users to easily reach out for services. Overall, the design will prioritize clarity and ease of use, ensuring visitors can quickly find the information they need.