Landing Page - Copy this React, Tailwind Component to your project
# Detailed Development Prompt for Susan Abong'o's Portfolio Website ## Project Context Please help me develop a professional portfolio website for Susan Abong'o, a Nairobi based 2D/3D artist, model, and event host. The project consists of: Main domain (susanabongo.com) focusing on her artistic portfolio Subdomain (events.susanabongo.com) dedicated to event hosting services ## 1. Technical Requirements Please include: React based development Responsive design (mobile first approach) Tailwind CSS for styling Payment integration (M Pesa) Automated ticket generation system Blog functionality Newsletter subscription system Image/video optimization Contact form functionality Social media integration ## 2. Main Domain Structure (susanabongo.com) ### 2.1 Navigation Create a responsive navigation bar with: Logo/Brand name Main menu items (Home, Portfolio, About, Other Works, Testimonials, Contact) Mobile hamburger menu Link to events subdomain Social media icons ### 2.2 Homepage Hero section featuring: Professional photo of Susan Compelling headline Brief introduction Call to action buttons Featured works section displaying: 4 pieces on desktop (2 each for 2D and 3D) 2 pieces on mobile (1 each for 2D and 3D) "See More" buttons for each category Quick access to recent blog posts Newsletter signup Social proof section ### 2.3 Portfolio Page Filterable gallery with: Category filters (2D/3D) Year filter Medium filter Grid layout with: Thumbnail images Project titles Brief descriptions Click through to detailed project pages Lazy loading for performance Lightbox for image viewing ### 2.4 About Page Professional biography Artist statement Career highlights Skills and expertise Professional photo gallery Link to event hosting services ### 2.5 Other Works Section Modeling portfolio integration: Photo gallery Video showreel Social media feeds Booking information Event hosting preview with link to subdomain ### 2.6 Testimonials Client feedback display Star ratings Client photos (if available) Categorized by service type (Art/Events) ### 2.7 Contact Page Professional contact form with: Name, email, phone fields Project type selection Message field File upload option CAPTCHA protection Direct contact information Business hours Location map ### 2.8 Blog Section Article grid with: Featured image Title Preview text Publication date Category tags Search functionality Category filtering Archive access ## 3. Event Subdomain (events.susanabongo.com) ### 3.1 Homepage Featured upcoming events Quick access calendar Service highlights Call to action for bookings ### 3.2 Upcoming Events Event calendar showing: Dates and times Venues Event types Ticket pricing Available slots Event posters/promotional materials Ticket purchasing system: M Pesa integration Automatic ticket number generation Downloadable/printable tickets Email confirmation ### 3.3 Services Page Detailed service descriptions Pricing packages Past event examples Booking process explanation ### 3.4 Gallery Photo grid of past events Video highlights Event categories Success stories ### 3.5 Booking Information Availability calendar Service packages Booking form Terms and conditions FAQs ### 3.6 Event Testimonials Client testimonials Event photos Success metrics Featured collaborations ## 4. Design Requirements ### 4.1 Main Domain Theme Professional yet artistic Clean layout Subtle animations Portfolio focused design Neutral color palette with artistic accents ### 4.2 Event Subdomain Theme Vibrant and dynamic Bold color scheme Event focused imagery Interactive elements Engaging animations ## 5. Interactive Features Smooth scrolling Image lazy loading Form validation Loading animations Toast notifications Hover effects Modal dialogs Navigation transitions ## 6. Content Management Easy update system for: Portfolio items Blog posts Event listings Testimonials Gallery items ## 7. Performance Requirements Fast loading times Image optimization Code splitting SEO optimization Mobile responsiveness Cross browser compatibility ## 8. Additional Considerations Regular backup system Security measures GDPR compliance Analytics integration Social media sharing Print friendly pages Accessibility features generate this website and do not forget the mpesa intergration and be creative, do not forget any section and fill the sections with dummy texts/videos
