Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a personal website for Irfan Akbar Wildani, an AI-driven Digital Marketer and Community Builder based in Sleman, Yogyakarta, Indonesia. The primary purpose is to showcase Irfan's expertise in digital marketing, content creation, and community building, while incorporating engaging 3D elements and a modern aesthetic.

## CORE FEATURES
1. **Home Page**: A welcoming introduction featuring a brief overview of Irfan's professional background and expertise, with a prominent call-to-action button for visitors to contact or learn more.
2. **About Section**: A dedicated page that details Irfan's journey in digital marketing, including milestones, skills, and personal insights, presented in an engaging and visually appealing way.
3. **Services Offered**: A showcase of services (Digital Marketing, Content Creation, Community Building) with engaging descriptions and 3D icons to represent each service visually.
4. **Portfolio**: A gallery or grid layout displaying Irfan's past projects and case studies, allowing visitors to explore the breadth of his work.
5. **Testimonials**: A section for client testimonials, designed to build credibility, featuring rotating quotes in a minimalist card format.
6. **Contact Form**: An easy-to-use contact form for inquiries, integrated with anti-spam measures and clear submission feedback.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist with a clean and simple design, utilizing plenty of white space to enhance readability. The focus on typography ensures clarity and professionalism.
- **Color Mode**: A light theme with dark text on light backgrounds, complemented by a black base with vibrant green accents for buttons, links, and hover states.
- **Layout**: The main layout features a top navigation bar with links to different sections. Each section is clearly defined with ample spacing, allowing users to navigate easily. A footer includes social media links and copyright information.
- **Typography**: Use modern, sans-serif fonts for headings (e.g., Montserrat) to convey professionalism, and a clean serif font for body text (e.g., Roboto) to ensure legibility. Headings should be bold with a larger size to establish a clear hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building dynamic user interfaces.
- **Styling**: Tailwind CSS for utility-first styling, ensuring a responsive design with minimal CSS bloat.
- **UI Components**: Utilize shadcn/ui components for consistent UI elements, such as buttons and forms.
- **State Management**: Use React Context API or Zustand for managing global state where necessary.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Create a new React project using Create React App with TypeScript support.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Layout Components**: Build reusable components for the header, footer, and main sections.
4. **Implement Core Features**: Develop each core feature as a separate component, ensuring smooth navigation between sections.
5. **Add 3D Elements**: Integrate 3D visual elements using a library like Three.js or lightweight animations to enhance the visual appeal.
6. **Test Responsiveness**: Ensure the application is fully responsive across various devices and screen sizes.
7. **Deploy**: Host the website on a platform like Vercel or Netlify for easy access and performance optimization.

## USER EXPERIENCE
The user experience is designed to be intuitive and engaging. Visitors can easily navigate through the homepage to learn about Irfan's offerings, view his portfolio, and read testimonials. The contact form is straightforward, providing instant feedback upon submission. The minimalist design ensures that users are not overwhelmed, allowing them to focus on the content while the strategic use of green accents draws attention to key areas without detracting from the overall aesthetic.