283 lines
19 KiB
TypeScript
283 lines
19 KiB
TypeScript
"use client";
|
|
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import { Sparkles, Award, Zap, TrendingUp, MessageSquare, HelpCircle, Users, Heart, Instagram, Twitter, Linkedin, Mail } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="floatingGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
brandName="PosterX"
|
|
navItems={[
|
|
{ name: "Gallery", id: "products" },
|
|
{ name: "Customizer", id: "features" },
|
|
{ name: "Why Us", id: "testimonials" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero" className="overflow-hidden">
|
|
<HeroSplitDoubleCarousel
|
|
title="Curate Your Walls in 3D"
|
|
description="Transform any image into museum-quality framed posters with ambient lighting. Preview every frame, size, and material before checkout—then track delivery in realtime. Experience the future of customizable wall art with our enterprise-grade platform."
|
|
tag="Luxury Customization"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Start Creating", href: "products" },
|
|
{ text: "View Collections", href: "products" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
background={{ variant: "floatingGradient" }}
|
|
leftCarouselItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/view-modern-entryway-with-interior-designed-furniture_23-2150790936.jpg", imageAlt: "Premium framed poster in modern interior" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-luxury-authentic-dining-room-interior-design-with-picture-frame_53876-126790.jpg", imageAlt: "Elegant poster frame bedroom accent" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-vector/flat-abstract-art-cover-collection_23-2148973607.jpg", imageAlt: "Luxury poster collection showcase" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/realistic-frame-vintage-room_1048-5327.jpg", imageAlt: "Premium wall art with ambient lighting" }
|
|
]}
|
|
rightCarouselItems={[
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-frame-lit-candles_23-2149201956.jpg", imageAlt: "Custom poster frame variety display" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/home-interior-design-with-copy-space_23-2148786394.jpg", imageAlt: "Gallery-style poster arrangement" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-photo-frames-plant-arrangement_23-2149454944.jpg", imageAlt: "Sophisticated poster frame aesthetic" },
|
|
{ imageSrc: "http://img.b2bpic.net/free-photo/empty-photo-frames-books-couch_23-2149454897.jpg", imageAlt: "Minimalist luxury poster interior" }
|
|
]}
|
|
carouselPosition="right"
|
|
ariaLabel="Hero section showcasing luxury poster customization"
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products" className="py-20">
|
|
<ProductCardThree
|
|
title="Curated Poster Gallery"
|
|
description="Explore our premium collection of customizable posters. Each piece is available in multiple sizes and frame options with real-time 3D preview."
|
|
tag="Premium Selection"
|
|
tagIcon={Award}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "View All Collections", href: "features" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
products={[
|
|
{
|
|
id: "product-1", name: "Modern Abstract Blue", price: "$149.00", imageSrc: "http://img.b2bpic.net/free-vector/abstract-background-with-geometric-design_1048-1379.jpg?_wi=1", imageAlt: "Modern abstract blue poster frame", initialQuantity: 1
|
|
},
|
|
{
|
|
id: "product-2", name: "Minimalist Geometric", price: "$129.00", imageSrc: "http://img.b2bpic.net/free-photo/front-view-photo-frame-as-interior-decoration_23-2149390860.jpg", imageAlt: "Minimalist geometric poster black frame", initialQuantity: 1
|
|
},
|
|
{
|
|
id: "product-3", name: "Contemporary Landscape", price: "$159.00", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-frame-with-floral-concept_23-2148140647.jpg?_wi=1", imageAlt: "Contemporary landscape poster white frame", initialQuantity: 1
|
|
}
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features" className="relative">
|
|
<FeatureCardNine
|
|
title="Premium Customization Experience"
|
|
description="Experience our innovative approach to poster customization with cutting-edge 3D visualization and smart frame selection."
|
|
tag="Key Features"
|
|
tagIcon={Zap}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Explore Features", href: "products" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Real-Time 3D Preview", description: "Visualize your poster in stunning 3D before making any purchase. Rotate, zoom, and interact with every frame option and material finish.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-vector/bank-face-recognition-technology-flyer-template_74855-15590.jpg"
|
|
},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-vector/abstract-background-with-geometric-design_1048-1379.jpg?_wi=2"
|
|
}
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Ambient Lighting Integration", description: "Add sophisticated ambient lighting to your custom posters. Choose from professional LED options that enhance your wall art with museum-quality illumination.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-psd/dynamic-electronic-music-instagram-stories_23-2150026448.jpg"
|
|
},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-frame-with-floral-concept_23-2148140647.jpg?_wi=2"
|
|
}
|
|
}
|
|
]}
|
|
showStepNumbers={true}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics" className="py-20">
|
|
<MetricCardOne
|
|
title="PosterX by Numbers"
|
|
description="Join thousands of satisfied customers who trust PosterX for their premium poster needs."
|
|
tag="Proven Excellence"
|
|
tagIcon={TrendingUp}
|
|
tagAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "10K+", title: "Happy Customers", description: "Premium art collectors worldwide", icon: Users
|
|
},
|
|
{
|
|
id: "2", value: "50K+", title: "Posters Sold", description: "Museum-quality frames delivered", icon: Award
|
|
},
|
|
{
|
|
id: "3", value: "98%", title: "Satisfaction Rate", description: "Customer happiness guaranteed", icon: Heart
|
|
},
|
|
{
|
|
id: "4", value: "24-48h", title: "Fast Delivery", description: "Premium expedited shipping", icon: Zap
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="scale-rotate"
|
|
buttons={[
|
|
{ text: "Join Our Community", href: "contact" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials" className="py-20">
|
|
<TestimonialCardFive
|
|
title="Trusted by Design Professionals"
|
|
description="Hear from interior designers, architects, and art collectors who've elevated their spaces with PosterX."
|
|
tag="Client Testimonials"
|
|
tagIcon={MessageSquare}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "See More Reviews", href: "contact" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Elena Rodriguez, Interior Designer at Studio Luxe", date: "Date: 15 November 2024", title: "Transformed my client's entire vision", quote: "PosterX's 3D preview system is revolutionary. My clients can see exactly how their posters will look before installation. The quality is museum-grade, and the delivery was impeccable. This is now my go-to platform for all premium poster projects.", tag: "Interior Design", avatarSrc: "http://img.b2bpic.net/free-photo/cute-young-lady-wearing-her-dark-hair-loose-keeping-hand-neck-having-flirting-look-staring-with-subtle-smile-charming-young-european-woman-relaxing-coffee-shop-free-time_273609-79.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cute-young-lady-wearing-her-dark-hair-loose-keeping-hand-neck-having-flirting-look-staring-with-subtle-smile-charming-young-european-woman-relaxing-coffee-shop-free-time_273609-79.jpg"
|
|
},
|
|
{
|
|
id: "2", name: "James Chen, Lead Architect at Modern Spaces", date: "Date: 8 November 2024", title: "Perfect for architectural visualization", quote: "As an architect, precision is everything. PosterX delivers exactly that. Their customization options and ambient lighting features integrate seamlessly with contemporary design. Our corporate clients absolutely love the results.", tag: "Architecture", avatarSrc: "http://img.b2bpic.net/free-photo/business-woman-sitting-couch-smiling_23-2148095698.jpg", imageSrc: "http://img.b2bpic.net/free-photo/business-woman-sitting-couch-smiling_23-2148095698.jpg"
|
|
},
|
|
{
|
|
id: "3", name: "Sarah Mitchell, Hospitality Director at The Prestige Hotels", date: "Date: 1 November 2024", title: "Luxury experience from start to finish", quote: "We've equipped multiple properties with PosterX custom posters. The white-label customization is exceptional, and their bulk pricing is competitive. Every guest compliments the artwork on the walls.", tag: "Hospitality", avatarSrc: "http://img.b2bpic.net/free-photo/man-standing-surfboard-shop_107420-94958.jpg", imageSrc: "http://img.b2bpic.net/free-photo/man-standing-surfboard-shop_107420-94958.jpg"
|
|
},
|
|
{
|
|
id: "4", name: "Marcus Thompson, Art Collector & Curator", date: "Date: 25 October 2024", title: "Premium quality at every touchpoint", quote: "I'm extremely particular about art display. PosterX exceeded my expectations with their frame options, finish quality, and attention to detail. The ambient lighting feature adds a gallery-like sophistication to my collection.", tag: "Art Curation", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-female-interior-designer-home_23-2150334499.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-female-interior-designer-home_23-2150334499.jpg"
|
|
},
|
|
{
|
|
id: "5", name: "Isabelle Fontaine, Freelance Design Consultant", date: "Date: 18 October 2024", title: "Reliable partner for creative projects", quote: "PosterX has been instrumental in scaling my design consultation practice. Their team is responsive, their product quality is consistent, and their customer support is outstanding. Highly recommended for professionals.", tag: "Design", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-gorgeous-woman-sitting-near-lake_132075-9426.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-gorgeous-woman-sitting-near-lake_132075-9426.jpg"
|
|
},
|
|
{
|
|
id: "6", name: "David Park, Gallery Owner at Park Contemporary", date: "Date: 10 October 2024", title: "Gateway to premium poster distribution", quote: "Partnering with PosterX has allowed us to offer bespoke poster services to our collectors. Their manufacturing quality rivals our in-house production, and the turnaround time is remarkable.", tag: "Gallery", avatarSrc: "http://img.b2bpic.net/free-photo/bearded-black-man-wearing-suit-felt-hat_613910-1878.jpg", imageSrc: "http://img.b2bpic.net/free-photo/bearded-black-man-wearing-suit-felt-hat_613910-1878.jpg"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq" className="py-20">
|
|
<FaqDouble
|
|
title="Frequently Asked Questions"
|
|
description="Everything you need to know about PosterX custom posters, frames, and our premium services."
|
|
tag="Support"
|
|
tagIcon={HelpCircle}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{ text: "Contact Support", href: "contact" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What frame materials are available?", content: "We offer premium frame options in black, white, and brown finishes. All frames are 1-inch deep with museum-grade glass and premium matting. Each frame is hand-assembled and quality-tested to ensure perfect results."
|
|
},
|
|
{
|
|
id: "2", title: "What poster sizes do you offer?", content: "PosterX provides multiple standard sizes: A4 (8.3\" x 11.7\"), A3 (11.7\" x 16.5\"), A2 (16.5\" x 23.4\"), and custom dimensions up to 48\" x 72\". All sizes are available with or without framing."
|
|
},
|
|
{
|
|
id: "3", title: "How does the 3D preview work?", content: "Our interactive 3D preview system lets you rotate, zoom, and customize your poster in real-time. View your image with different frame colors, sizes, and ambient lighting options before confirming your order."
|
|
},
|
|
{
|
|
id: "4", title: "Can I add ambient lighting to my poster?", content: "Yes! Choose from our premium LED ambient lighting options that mount directly onto the frame. Options include warm white, cool white, and RGB adjustable lighting that integrates seamlessly with our smart control app."
|
|
},
|
|
{
|
|
id: "5", title: "What is your return policy?", content: "We offer a 30-day satisfaction guarantee on all orders. If you're not completely satisfied, return your poster for a full refund or exchange. We also provide a 2-year manufacturing warranty on all frames."
|
|
},
|
|
{
|
|
id: "6", title: "How long does delivery take?", content: "Standard delivery is 5-7 business days. Express delivery (24-48 hours) is available for orders placed before 2 PM EST. Track your order in real-time through our customer portal. International shipping available to 150+ countries."
|
|
},
|
|
{
|
|
id: "7", title: "Do you offer bulk pricing and white-label options?", content: "Absolutely. We offer competitive bulk pricing starting at 10+ units. White-label customization is available for corporate and hospitality clients. Contact our B2B team for custom quotes and dedicated account management."
|
|
},
|
|
{
|
|
id: "8", title: "Is the ambient lighting controllable?", content: "Our premium LED lighting features smart control via mobile app or wall-mounted dimmer. Adjust brightness, color temperature, and scheduling. Some models include voice control compatibility with Alexa and Google Home."
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqsAnimation="blur-reveal"
|
|
animationType="smooth"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact" className="py-20">
|
|
<ContactCTA
|
|
tag="Ready to Transform Your Space?"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
title="Start Your Custom Poster Journey Today"
|
|
description="Join thousands of satisfied customers. Our team is ready to help you create the perfect custom posters for your home, office, or project. Get started with our 3D customizer in minutes."
|
|
buttons={[
|
|
{ text: "Launch 3D Customizer", href: "products" },
|
|
{ text: "Schedule Consultation", href: "#" }
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
background={{ variant: "floatingGradient" }}
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="PosterX"
|
|
copyrightText="© 2025 PosterX. All rights reserved. | Premium Custom Posters & Frames"
|
|
socialLinks={[
|
|
{ icon: Instagram, href: "https://instagram.com/posterx", ariaLabel: "Instagram" },
|
|
{ icon: Twitter, href: "https://twitter.com/posterx", ariaLabel: "Twitter" },
|
|
{ icon: Linkedin, href: "https://linkedin.com/company/posterx", ariaLabel: "LinkedIn" },
|
|
{ icon: Mail, href: "mailto:hello@posterx.com", ariaLabel: "Email" }
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|