311 lines
17 KiB
TypeScript
311 lines
17 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import { Award, DollarSign, Rocket, Shield, Sparkles, Zap } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="soft"
|
|
contentWidth="smallMedium"
|
|
sizing="medium"
|
|
background="none"
|
|
cardStyle="gradient-mesh"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{ text: "Get Started", href: "contact" }}
|
|
brandName="Webild"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroCentered
|
|
background={{ variant: "downward-rays-static" }}
|
|
avatars={[
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-business-woman-portrait-smi-1772496657304-d1e9ecba.png", alt: "Customer testimonial"
|
|
},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-business-man-portrait-confi-1772496657504-0e5270f5.png", alt: "Customer testimonial"
|
|
},
|
|
{
|
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-diverse-business-person-por-1772496657109-8badd6f9.png", alt: "Customer testimonial"
|
|
}
|
|
]}
|
|
avatarText="Trusted by 500+ businesses worldwide"
|
|
title="Build Stunning Websites with AI-Powered Speed"
|
|
description="Transform your vision into reality. Webild creates beautiful, responsive websites using cutting-edge AI technology. From concept to launch in days, not months."
|
|
buttons={[
|
|
{ text: "Start Your Project", href: "contact" },
|
|
{ text: "View Our Work", href: "features" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
tag="About Webild"
|
|
tagIcon={Sparkles}
|
|
title="AI-Powered Web Creation That Works"
|
|
description="We combine artificial intelligence with expert design to create websites that convert. Our AI analyzes your business needs and generates custom solutions tailored to your audience, industry, and goals. No templates. No compromises. Just your perfect website."
|
|
metrics={[
|
|
{ value: "3-5x", title: "Faster development than traditional agencies" },
|
|
{ value: "95%", title: "Client satisfaction rate" }
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/modern-ai-web-design-dashboard-interface-1772496658579-5f9b6b19.png"
|
|
imageAlt="AI web creation dashboard showing design interface"
|
|
useInvertedBackground={false}
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyThree
|
|
title="Powerful Features Built for Your Success"
|
|
description="Every feature is designed to accelerate your web presence and drive conversions"
|
|
tag="Capabilities"
|
|
tagIcon={Zap}
|
|
features={[
|
|
{
|
|
id: "1", title: "AI-Powered Design Generation", tags: ["AI", "Design", "Automation"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/abstract-illustration-of-artificial-inte-1772496657950-490988d7.png"
|
|
},
|
|
{
|
|
id: "2", title: "Responsive Mobile-First Development", tags: ["Mobile", "Responsive", "Performance"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/multiple-devices-desktop-tablet-mobile-p-1772496658652-c3839b17.png"
|
|
},
|
|
{
|
|
id: "3", title: "SEO Optimization Built-In", tags: ["SEO", "Optimization", "Rankings"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/seo-optimization-visualization-showing-s-1772496658092-c833c3a7.png"
|
|
},
|
|
{
|
|
id: "4", title: "Lightning-Fast Performance", tags: ["Performance", "Speed", "Analytics"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/lightning-bolt-or-speed-visualization-sh-1772496658871-0a4c2e01.png"
|
|
},
|
|
{
|
|
id: "5", title: "Easy Content Management", tags: ["CMS", "Management", "Updates"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/content-management-system-interface-show-1772496659830-d31bc25c.png"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="showcase" data-section="showcase">
|
|
<ProductCardTwo
|
|
title="Showcase of AI-Generated Websites"
|
|
description="See the incredible results our AI and creative team have delivered for clients across industries"
|
|
tag="Portfolio"
|
|
tagIcon={Award}
|
|
products={[
|
|
{
|
|
id: "1", brand: "TechStartup Inc", name: "SaaS Platform Landing Page", price: "Delivered in 7 days", rating: 5,
|
|
reviewCount: "Exceeds expectations", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/modern-saas-landing-page-with-clean-hero-1772496661935-a08eb25e.png"
|
|
},
|
|
{
|
|
id: "2", brand: "Fashion & Design Co", name: "E-Commerce Store", price: "Delivered in 10 days", rating: 5,
|
|
reviewCount: "Best investment", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/beautiful-e-commerce-store-website-showc-1772496658916-463a2cd3.png"
|
|
},
|
|
{
|
|
id: "3", brand: "Local Services Pro", name: "Service Business Website", price: "Delivered in 5 days", rating: 5,
|
|
reviewCount: "Highly recommended", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-service-business-website-wi-1772496659321-e62457b1.png"
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardTwo
|
|
title="Simple, Transparent Pricing"
|
|
description="Choose the perfect plan for your business needs. All plans include AI-powered design and professional development."
|
|
tag="Pricing"
|
|
tagIcon={DollarSign}
|
|
plans={[
|
|
{
|
|
id: "1", badge: "Starter", badgeIcon: Rocket,
|
|
price: "$2,999", subtitle: "Perfect for small businesses and startups", buttons: [
|
|
{ text: "Get Started", href: "contact" },
|
|
{ text: "Learn More", href: "#" }
|
|
],
|
|
features: [
|
|
"5-7 page website", "Mobile responsive design", "Basic SEO optimization", "Contact form integration", "1 month of support"
|
|
]
|
|
},
|
|
{
|
|
id: "2", badge: "Professional", badgeIcon: Sparkles,
|
|
price: "$5,999", subtitle: "Best for growing businesses", buttons: [
|
|
{ text: "Get Started", href: "contact" },
|
|
{ text: "Learn More", href: "#" }
|
|
],
|
|
features: [
|
|
"10-15 page website", "Advanced SEO optimization", "Blog integration", "E-commerce capabilities", "3 months of support"
|
|
]
|
|
},
|
|
{
|
|
id: "3", badge: "Enterprise", badgeIcon: Shield,
|
|
price: "Custom", subtitle: "For large-scale projects", buttons: [
|
|
{ text: "Schedule Call", href: "contact" },
|
|
{ text: "Learn More", href: "#" }
|
|
],
|
|
features: [
|
|
"Unlimited pages", "Custom integrations", "Advanced analytics", "API access", "Ongoing support & updates"
|
|
]
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
title="Trusted by Industry Leaders"
|
|
description="Join hundreds of companies that have already transformed their web presence with Webild"
|
|
tag="Partners"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"TechFlow Solutions", "Innovate Labs", "CloudSync Pro", "Digital Ventures", "NextGen Services", "Growth Accelerator", "Future Systems", "Prime Digital"
|
|
]}
|
|
speed={40}
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
title="What Our Clients Say"
|
|
description="Real feedback from businesses that have grown with Webild's AI-powered web creation"
|
|
tag="Testimonials"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Chen", role: "CEO", company: "TechFlow Solutions", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-headshot-of-a-confident-bus-1772496657705-6c3f23e5.png"
|
|
},
|
|
{
|
|
id: "2", name: "Michael Rodriguez", role: "Founder", company: "Innovate Labs", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-headshot-of-a-business-man--1772496658113-c597a28c.png"
|
|
},
|
|
{
|
|
id: "3", name: "Jessica Williams", role: "Marketing Director", company: "CloudSync Pro", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-marketing-director-portrait-1772496658271-8a1b507b.png"
|
|
},
|
|
{
|
|
id: "4", name: "David Park", role: "Business Owner", company: "Digital Ventures", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/professional-business-owner-headshot-app-1772496657657-07be8306.png"
|
|
}
|
|
]}
|
|
kpiItems={[
|
|
{ value: "98%", label: "Client satisfaction rate" },
|
|
{ value: "500+", label: "Websites created" },
|
|
{ value: "24/7", label: "Customer support" }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
title="Frequently Asked Questions"
|
|
description="Everything you need to know about our AI web creation services"
|
|
tag="Help"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "How fast is the AI web creation process?", content: "Our AI can generate your initial website in 3-5 days, depending on complexity. We handle design, development, optimization, and deployment all in parallel, significantly accelerating your time to market."
|
|
},
|
|
{
|
|
id: "2", title: "Can I customize the AI-generated designs?", content: "Absolutely! The AI generates a strong foundation, but we work closely with you to refine every detail. Your brand voice, colors, messaging, and functionality are fully customizable."
|
|
},
|
|
{
|
|
id: "3", title: "Is my website optimized for SEO?", content: "Yes, SEO optimization is built into every website we create. Our AI analyzes best practices and implements on-page optimization, technical SEO, and performance enhancements automatically."
|
|
},
|
|
{
|
|
id: "4", title: "What about ongoing support and updates?", content: "We include ongoing support with every plan. You can request updates, new features, or design changes. Our team ensures your website stays current and continues to perform at peak levels."
|
|
},
|
|
{
|
|
id: "5", title: "Do you handle e-commerce integration?", content: "Yes! We integrate with popular e-commerce platforms like Shopify, WooCommerce, and custom solutions. Payment processing, inventory management, and shipping integrations are all available."
|
|
}
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3APa7L7qpaDjShGyoiqbxwHKwhR/friendly-customer-support-illustration-s-1772496657900-af981ee8.png"
|
|
imageAlt="Customer support and help illustration"
|
|
mediaAnimation="slide-up"
|
|
faqsAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
mediaPosition="left"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Product", items: [
|
|
{ label: "Features", href: "#features" },
|
|
{ label: "Pricing", href: "#pricing" },
|
|
{ label: "Portfolio", href: "#showcase" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Testimonials", href: "#testimonials" },
|
|
{ label: "Contact", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Resources", items: [
|
|
{ label: "FAQ", href: "#faq" },
|
|
{ label: "Blog", href: "#" },
|
|
{ label: "Support", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Cookie Policy", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
bottomLeftText="© 2025 Webild. All rights reserved."
|
|
bottomRightText="Built with AI-powered innovation"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|