296 lines
14 KiB
TypeScript
296 lines
14 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
|
|
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import FeatureCardThirteen from '@/components/sections/feature/FeatureCardThirteen';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
|
|
import { Twitter, Linkedin, Github, Mail } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="dotGrid"
|
|
cardStyle="gradient-subtle"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleMinimal
|
|
brandName="Webild"
|
|
button={{
|
|
text: "Get Started", href: "contact"
|
|
}}
|
|
className="border-b border-opacity-10"
|
|
buttonClassName="rounded-pill"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboardSplit
|
|
logoText="WEBILD"
|
|
description="Transform your digital presence with innovative design solutions. We create stunning, responsive experiences that captivate audiences and drive real results."
|
|
buttons={[
|
|
{
|
|
text: "Explore Solutions", href: "features"
|
|
},
|
|
{
|
|
text: "View Case Studies", href: "testimonials"
|
|
}
|
|
]}
|
|
layoutOrder="default"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717186718-2w0ix4wj.jpg"
|
|
imageAlt="Digital innovation and modern design workspace"
|
|
frameStyle="browser"
|
|
logoLineHeight={1.15}
|
|
ariaLabel="Hero section showcasing Webild design services"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
heading={[
|
|
{
|
|
type: "text", content: "Building digital futures with"
|
|
},
|
|
{
|
|
type: "image", src: "https://img.b2bpic.net/free-vector/geometric-harmony-hills-private-school-logo-template_742173-18879.jpg", alt: "Webild brand mark"
|
|
},
|
|
{
|
|
type: "text", content: "cutting-edge design and"
|
|
},
|
|
{
|
|
type: "image", src: "https://img.b2bpic.net/free-vector/psychology-logos-with-colorful-geometric-shapes_23-2147590277.jpg", alt: "Innovation symbol"
|
|
},
|
|
{
|
|
type: "text", content: "strategic thinking"
|
|
}
|
|
]}
|
|
buttons={[
|
|
{
|
|
text: "Learn Our Process", href: "features"
|
|
},
|
|
{
|
|
text: "Contact Us", href: "contact"
|
|
}
|
|
]}
|
|
useInvertedBackground="invertDefault"
|
|
ariaLabel="About Webild design philosophy and mission"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardThirteen
|
|
title="Our Design Process"
|
|
description="A proven methodology to transform your vision into exceptional digital experiences"
|
|
tag="Workflow"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
features={[
|
|
{
|
|
id: "01", title: "Discovery & Strategy", description: "We dive deep into understanding your business goals, target audience, and competitive landscape to craft a strategic foundation."
|
|
},
|
|
{
|
|
id: "02", title: "Design & Prototyping", description: "Our team creates beautiful, intuitive designs and interactive prototypes that bring your vision to life with precision."
|
|
},
|
|
{
|
|
id: "03", title: "Development & Optimization", description: "We build performant, accessible solutions and optimize every detail to ensure seamless user experiences across all devices."
|
|
},
|
|
{
|
|
id: "04", title: "Launch & Support", description: "We launch your project with confidence and provide ongoing support to ensure continued success and growth."
|
|
}
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground="noInvert"
|
|
buttons={[
|
|
{
|
|
text: "Start Your Project", href: "contact"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="Client Success Stories"
|
|
description="See how we've helped innovative brands achieve their digital goals"
|
|
tag="Testimonials"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="invertCard"
|
|
speed={30}
|
|
topMarqueeDirection="left"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Chen", handle: "@sarahchen_creative", testimonial: "Webild transformed our entire digital presence. Their strategic approach combined with stunning design resulted in a 150% increase in user engagement.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767698836114-ric6d4b4.jpg", imageAlt: "Sarah Chen"
|
|
},
|
|
{
|
|
id: "2", name: "Michael Rodriguez", handle: "@mrodriguez_design", testimonial: "Working with Webild was a game-changer. They understood our vision perfectly and delivered beyond expectations. Highly recommend!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717189290-37iyik7e.jpg", imageAlt: "Michael Rodriguez"
|
|
},
|
|
{
|
|
id: "3", name: "Emma Thompson", handle: "@emmathompson_tech", testimonial: "Their attention to detail and innovative thinking set them apart. Our new platform has become a key competitive advantage in our market.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717190681-i2cfacd9.jpg", imageAlt: "Emma Thompson"
|
|
},
|
|
{
|
|
id: "4", name: "James Patterson", handle: "@jpatterson_co", testimonial: "Exceptional team that delivers exceptional results. The entire process was smooth, professional, and the final product exceeded all expectations.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767698836698-ror4nxcc.jpg", imageAlt: "James Patterson"
|
|
},
|
|
{
|
|
id: "5", name: "Lisa Wang", handle: "@lisawang_ventures", testimonial: "Webild brings both creative excellence and technical expertise. They're a trusted partner we continue to work with on multiple projects.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767703280295-jyqaitc4.jpg", imageAlt: "Lisa Wang"
|
|
},
|
|
{
|
|
id: "6", name: "David Kumar", handle: "@davidkumar_digital", testimonial: "From concept to launch, Webild demonstrated professionalism and creativity that elevated our brand. Fantastic experience working with them.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717192014-j1rpv8a9.jpg", imageAlt: "David Kumar"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about our services, process, and partnership approach"
|
|
tag="Help"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
imageSrc="https://img.b2bpic.net/free-vector/flat-timeline-infographic-template_23-2148927216.jpg"
|
|
imageAlt="Customer support and FAQ illustration"
|
|
mediaPosition="left"
|
|
animationType="smooth"
|
|
showCard={true}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What industries do you specialize in?", content: "We work across diverse industries including SaaS, fintech, e-commerce, healthcare, and more. Our team has experience delivering exceptional results for startups through enterprise clients."
|
|
},
|
|
{
|
|
id: "2", title: "How long does a typical project take?", content: "Project timelines vary based on scope and complexity. Most projects take 8-16 weeks from initial discovery through launch. We'll provide a detailed timeline during our planning phase."
|
|
},
|
|
{
|
|
id: "3", title: "Do you offer ongoing support after launch?", content: "Yes! We offer comprehensive post-launch support including maintenance, updates, performance optimization, and feature enhancements to ensure continued success."
|
|
},
|
|
{
|
|
id: "4", title: "What is your design and development process?", content: "Our process includes discovery & strategy, design & prototyping, development & optimization, and launch & support. We keep you involved at every stage with regular check-ins."
|
|
},
|
|
{
|
|
id: "5", title: "Can you work with our existing team?", content: "Absolutely! We excel at collaborating with internal teams and other agencies. We provide clear documentation and knowledge transfer to ensure seamless integration."
|
|
},
|
|
{
|
|
id: "6", title: "How do you ensure quality and accessibility?", content: "We follow WCAG accessibility guidelines, conduct thorough testing, and implement best practices for performance, security, and user experience across all projects."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Newsletter"
|
|
title="Stay Updated on Design Trends"
|
|
description="Subscribe to our newsletter and receive weekly insights on digital design, innovation strategies, and industry trends delivered to your inbox."
|
|
useInvertedBackground="invertCard"
|
|
imageSrc="https://img.b2bpic.net/free-vector/flat-process-infographic-concept_23-2148564973.jpg"
|
|
imageAlt="Newsletter subscription and email communication"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Enter your email address"
|
|
buttonText="Subscribe"
|
|
termsText="We respect your privacy. Unsubscribe at any time. See our privacy policy."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseSocial
|
|
logoText="Webild"
|
|
description="Creating exceptional digital experiences through strategic design and innovative thinking. We transform visions into remarkable digital realities."
|
|
copyrightText="© 2025 Webild. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{
|
|
label: "Design Services", href: "features"
|
|
},
|
|
{
|
|
label: "Web Development", href: "features"
|
|
},
|
|
{
|
|
label: "UX Strategy", href: "features"
|
|
},
|
|
{
|
|
label: "Branding", href: "features"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "About Us", href: "about"
|
|
},
|
|
{
|
|
label: "Our Process", href: "features"
|
|
},
|
|
{
|
|
label: "Case Studies", href: "testimonials"
|
|
},
|
|
{
|
|
label: "Contact", href: "contact"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Resources", items: [
|
|
{
|
|
label: "Blog", href: "#blog"
|
|
},
|
|
{
|
|
label: "Design Guide", href: "#guide"
|
|
},
|
|
{
|
|
label: "FAQ", href: "faq"
|
|
},
|
|
{
|
|
label: "Support", href: "contact"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{
|
|
label: "Privacy Policy", href: "#privacy"
|
|
},
|
|
{
|
|
label: "Terms of Service", href: "#terms"
|
|
},
|
|
{
|
|
label: "Cookie Policy", href: "#cookies"
|
|
}
|
|
]
|
|
}
|
|
]}
|
|
socialLinks={[
|
|
{
|
|
icon: Twitter,
|
|
href: "https://twitter.com", ariaLabel: "Follow us on Twitter"
|
|
},
|
|
{
|
|
icon: Linkedin,
|
|
href: "https://linkedin.com", ariaLabel: "Connect on LinkedIn"
|
|
},
|
|
{
|
|
icon: Github,
|
|
href: "https://github.com", ariaLabel: "View our GitHub"
|
|
},
|
|
{
|
|
icon: Mail,
|
|
href: "mailto:hello@webild.io", ariaLabel: "Email us"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |