261 lines
15 KiB
TypeScript
261 lines
15 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
|
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
|
|
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
|
import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
|
|
import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
|
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
|
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
|
import ContactFaq from "@/components/sections/contact/ContactFaq";
|
|
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
|
import { Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="compact"
|
|
sizing="largeSmall"
|
|
background="aurora"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="light"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="Elevate"
|
|
navItems={[
|
|
{ name: "About", id: "about" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Work", id: "work" },
|
|
{ name: "Clients", id: "clients" },
|
|
]}
|
|
button={{ text: "Start Conversation", href: "contact" }}
|
|
animateOnLoad={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardCarousel
|
|
title="Websites that drive real conversations"
|
|
description="We build digital experiences that transform visitors into engaged customers. Strategic design meets conversion-focused development."
|
|
tag="Digital Agency"
|
|
background={{ variant: "plain" }}
|
|
buttons={[
|
|
{ text: "Get Free Strategy Session", href: "contact" },
|
|
{ text: "View Our Work", href: "work" },
|
|
]}
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/empty-startup-office-with-pc-desk-be-used-by-programmers_482257-125560.jpg", imageAlt: "Modern digital workspace"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/digital-environment-scene_23-2151873114.jpg", imageAlt: "Web design mockup"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/business-project-planning-office_482257-119225.jpg", imageAlt: "Strategic planning"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-vector/marketing-conversion-funnel_23-2148021286.jpg", imageAlt: "Conversion optimization"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-colleagues-office-coworking_171337-17719.jpg", imageAlt: "Creative team collaboration"},
|
|
]}
|
|
tagAnimation="slide-up"
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
title="Why Elevate"
|
|
description={[
|
|
"We believe exceptional design is the bridge between your vision and customer action. Every pixel, every interaction, every word serves a single purpose: meaningful conversation.", "Our approach combines strategic insight with meticulous execution. We don't just build websites—we craft conversion systems that align perfectly with your business goals.", "From initial discovery through launch and beyond, we remain committed to your success. Your growth is our mission."]}
|
|
buttons={[{ text: "Learn Our Process", href: "#services" }]}
|
|
showBorder={true}
|
|
useInvertedBackground={false}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwelve
|
|
title="Our Services"
|
|
description="Comprehensive digital solutions designed to elevate your brand and drive conversions at every stage."
|
|
features={[
|
|
{
|
|
id: "design", label: "Design", title: "Thoughtful, conversion-focused design that captures attention", items: [
|
|
"User experience strategy", "Visual design & branding", "Interactive prototypes", "Design systems"],
|
|
buttons: [{ text: "Explore", href: "#contact" }],
|
|
},
|
|
{
|
|
id: "development", label: "Development", title: "Clean, performant code built for scale and speed", items: [
|
|
"Next.js & React", "Responsive web apps", "Performance optimization", "API integration"],
|
|
buttons: [{ text: "Learn More", href: "#contact" }],
|
|
},
|
|
{
|
|
id: "strategy", label: "Strategy", title: "Data-informed planning that aligns design with business goals", items: [
|
|
"Conversion optimization", "User research & testing", "Analytics & insights", "Growth planning"],
|
|
buttons: [{ text: "Get Started", href: "#contact" }],
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
tag="Services"
|
|
tagAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
title="Service Packages"
|
|
description="Choose the engagement model that fits your needs and budget."
|
|
plans={[
|
|
{
|
|
id: "starter", tag: "Starter", price: "$8,500", period: "/mo", description: "Perfect for growing businesses ready to elevate their web presence.", button: { text: "Get Started", href: "contact" },
|
|
featuresTitle: "What's Included:", features: [
|
|
"Custom website design (5-8 pages)", "Conversion optimization setup", "Basic SEO configuration", "Mobile responsive"],
|
|
},
|
|
{
|
|
id: "professional", tag: "Professional", price: "$15,000", period: "/mo", description: "Comprehensive solution with advanced features and dedicated support.", button: { text: "Schedule Call", href: "contact" },
|
|
featuresTitle: "What's Included:", features: [
|
|
"Advanced design system", "Conversion funnel optimization", "Analytics integration", "E-commerce capabilities", "Ongoing maintenance"],
|
|
},
|
|
{
|
|
id: "enterprise", tag: "Enterprise", price: "Custom", period: "/quarter", description: "Tailored solutions for large-scale projects with custom requirements.", button: { text: "Contact Us", href: "contact" },
|
|
featuresTitle: "What's Included:", features: [
|
|
"Custom architecture design", "Full conversion strategy", "Advanced integrations", "Dedicated project team", "Priority support"],
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Pricing"
|
|
tagAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="clients" data-section="clients">
|
|
<SocialProofOne
|
|
title="Trusted by Industry Leaders"
|
|
description="Join forward-thinking companies that are transforming their digital presence."
|
|
tag="Clients"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
names={[
|
|
"TechVision", "CloudScale", "InnovateLab", "GrowthCo", "DigitalEdge", "FutureFlow", "PrimeDesign", "VelocityMedia"]}
|
|
logos={[
|
|
"http://img.b2bpic.net/free-vector/business-logo-design_1043-218.jpg", "http://img.b2bpic.net/free-vector/gradient-hub-logo-design_23-2149872182.jpg", "http://img.b2bpic.net/free-vector/influencers-logo-template-design_742173-15118.jpg", "http://img.b2bpic.net/free-vector/technology-logo-template-with-abstract-shapes_23-2148240848.jpg", "http://img.b2bpic.net/free-vector/flat-design-consultancy-logo-template_23-2150106124.jpg", "http://img.b2bpic.net/free-vector/gradient-marketing-logo-collection_23-2149119292.jpg", "http://img.b2bpic.net/free-vector/professional-business-card-with-abstract-shapes_23-2147947455.jpg"]}
|
|
speed={40}
|
|
showCard={true}
|
|
tagAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
title="What Our Clients Say"
|
|
description="Real results from real businesses that partnered with us."
|
|
tag="Testimonials"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Chen", handle: "@sarahchen_founder", testimonial:
|
|
"Elevate transformed our entire online presence. Conversions increased 340% in the first three months. The team is exceptional.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "Sarah Chen, CEO of TechVision"},
|
|
{
|
|
id: "2", name: "Michael Rodriguez", handle: "@mrodriguez_cto", testimonial:
|
|
"The design system they built scales perfectly with our growth. Deployment cycles are faster, and user satisfaction is at an all-time high.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageAlt: "Michael Rodriguez, CTO"},
|
|
{
|
|
id: "3", name: "Emma Thompson", handle: "@emmathompson_ceo", testimonial:
|
|
"Not just a vendor—a true partner invested in our success. The conversion optimization work alone paid for itself multiple times over.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "Emma Thompson, CEO"},
|
|
{
|
|
id: "4", name: "David Kim", handle: "@davidkim_pm", testimonial:
|
|
"Working with Elevate was seamless. Their understanding of conversion funnels and user psychology is unmatched in the industry.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3", imageAlt: "David Kim, Product Manager"},
|
|
{
|
|
id: "5", name: "Jessica Liu", handle: "@jliu_marketing", testimonial:
|
|
"The analytics integration and data-driven insights have revolutionized how we approach digital marketing. Highly recommend.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4", imageAlt: "Jessica Liu, Marketing Director"},
|
|
{
|
|
id: "6", name: "Alex Martinez", handle: "@alexmartinez_ops", testimonial:
|
|
"From discovery to launch and beyond, the team was professional, communicative, and obsessed with quality. Five stars.", imageSrc:
|
|
"http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=5", imageAlt: "Alex Martinez, Operations Lead"},
|
|
]}
|
|
speed={40}
|
|
animationType="slide-up"
|
|
tagAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactFaq
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What's your typical project timeline?", content:
|
|
"Most projects are completed within 8-12 weeks from kickoff to launch. Timelines vary based on scope and complexity. We'll provide a detailed schedule during our initial consultation."},
|
|
{
|
|
id: "2", title: "Do you offer post-launch support?", content:
|
|
"Yes. All our packages include 30 days of post-launch support. We also offer ongoing maintenance and optimization packages for long-term partnership."},
|
|
{
|
|
id: "3", title: "Can you help with strategy, not just design?", content:
|
|
"Absolutely. Strategy is at the core of everything we do. We conduct thorough research, user testing, and competitive analysis before any design begins."},
|
|
{
|
|
id: "4", title: "What technologies do you work with?", content:
|
|
"We primarily work with Next.js, React, TypeScript, and modern web technologies. We choose the right stack for each project based on your specific needs."},
|
|
]}
|
|
ctaTitle="Ready to transform your digital presence?"
|
|
ctaDescription="Let's discuss how we can drive real conversations and conversions for your business."
|
|
ctaButton={{ text: "Schedule Consultation", href: "#" }}
|
|
ctaIcon={Zap}
|
|
useInvertedBackground={true}
|
|
animationType="slide-up"
|
|
accordionAnimationType="smooth"
|
|
showCard={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
logoText="Elevate"
|
|
columns={[
|
|
{
|
|
items: [
|
|
{ label: "About", href: "#about" },
|
|
{ label: "Services", href: "#services" },
|
|
{ label: "Work", href: "#work" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Pricing", href: "#pricing" },
|
|
{ label: "Clients", href: "#clients" },
|
|
{ label: "Contact", href: "#contact" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Twitter", href: "https://twitter.com" },
|
|
{ label: "LinkedIn", href: "https://linkedin.com" },
|
|
{ label: "Instagram", href: "https://instagram.com" },
|
|
],
|
|
},
|
|
{
|
|
items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Cookie Policy", href: "#" },
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|