241 lines
17 KiB
TypeScript
241 lines
17 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
|
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
|
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
|
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import { Instagram, Linkedin, Twitter, Mail, CheckCircle, Zap, Shield, Smartphone } from "lucide-react";
|
|
|
|
const navItems = [
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Services", id: "/services" },
|
|
{ name: "Portfolio", id: "/portfolio" },
|
|
{ name: "About", id: "/about" },
|
|
{ name: "Contact", id: "/contact" },
|
|
];
|
|
|
|
export default function ServicesPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="small"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="noise"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="medium"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={navItems}
|
|
brandName="NickToPixels"
|
|
bottomLeftText="Greater Toronto Area"
|
|
bottomRightText="hello@nicktopixels.ca"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardTestimonial
|
|
title="Professional Web Design Services for GTA Businesses"
|
|
description="Fast, affordable, high-converting websites. We combine strategic design with conversion optimization to deliver websites that turn visitors into customers. 3-7 day turnaround with ongoing support included."
|
|
tag="Comprehensive Web Solutions"
|
|
tagIcon={undefined}
|
|
tagAnimation="slide-up"
|
|
buttons={[
|
|
{
|
|
text: "Start Your Free Consultation", href: "#pricing"},
|
|
{
|
|
text: "View Our Process", href: "#how-it-works"},
|
|
]}
|
|
buttonAnimation="blur-reveal"
|
|
testimonials={[
|
|
{
|
|
name: "Sarah Chen", handle: "@sarrah_bakes", testimonial: "Nick transformed our online presence. Website launched in 5 days. Sales up 40% in month one. Incredible value and service.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-smiling-femal-1773935711800-8c62d304.png?_wi=1", imageAlt: "Sarah Chen bakery owner"},
|
|
{
|
|
name: "Marcus Williams", handle: "@marcs_contracting", testimonial: "Professional, responsive, on-time. Best investment for my contracting business. Customers find me easily now.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-confident-mal-1773935711567-a0bd5f8e.png?_wi=1", imageAlt: "Marcus Williams contractor"},
|
|
{
|
|
name: "Priya Patel", handle: "@priya_fitness", testimonial: "Affordable, fast, and exactly what my gym needed. Nick listened and delivered. Five stars without hesitation.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-female-fitnes-1773935711339-852b68f5.png?_wi=1", imageAlt: "Priya Patel fitness manager"},
|
|
{
|
|
name: "David Thompson", handle: "@thompson_law", testimonial: "Professional design meets strategic marketing. Our law firm looks credible and attracts quality clients.", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-distinguished-1773935713362-894a53c8.png?_wi=1", imageAlt: "David Thompson lawyer"},
|
|
]}
|
|
testimonialRotationInterval={5000}
|
|
background={{
|
|
variant: "noise"}}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
title="Service Packages Built for Every Stage of Growth"
|
|
description="Choose the solution that fits your business. All packages include responsive mobile design, SEO optimization, fast load times, 30 days of free support, and unlimited revisions."
|
|
tag="Service Tiers"
|
|
tagIcon={undefined}
|
|
tagAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
animationType="scale-rotate"
|
|
plans={[
|
|
{
|
|
id: "starter", tag: "For Getting Started", price: "$899", period: "one-time", description: "Perfect for local businesses and startups ready to establish their online presence.", button: {
|
|
text: "Get Started", href: "#final-cta"},
|
|
featuresTitle: "What's Included", features: [
|
|
"5-page responsive website", "Mobile-optimized design", "SEO basics (keywords, meta tags)", "Contact form integration", "Social media links", "SSL security certificate", "30 days free support", "Domain setup assistance"],
|
|
},
|
|
{
|
|
id: "growth", tag: "Most Popular", price: "$1,499", period: "one-time", description: "Ideal for growing businesses looking to convert more leads and showcase their services effectively.", button: {
|
|
text: "Choose Growth", href: "#final-cta"},
|
|
featuresTitle: "Everything in Starter, plus", features: [
|
|
"Up to 10 custom pages", "Advanced SEO optimization", "Blog setup and content strategy", "E-commerce basics (up to 20 products)", "Email newsletter integration", "Google Analytics setup", "Fast load time optimization", "90 days free support", "1 month free maintenance"],
|
|
},
|
|
{
|
|
id: "premium", tag: "Full Custom Solution", price: "$2,499", period: "one-time", description: "Complete custom web solution with advanced features, integrations, and ongoing performance optimization.", button: {
|
|
text: "Schedule Consultation", href: "#final-cta"},
|
|
featuresTitle: "Everything in Growth, plus", features: [
|
|
"Unlimited custom pages", "Full e-commerce platform", "Advanced integrations (CRM, tools)", "Custom API development", "Payment gateway setup", "Priority support (30-day response)", "3 months free maintenance", "Performance audit & optimization", "Custom feature development"],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="how-it-works" data-section="how-it-works">
|
|
<FeatureCardTwentyThree
|
|
title="Our Proven Process"
|
|
description="From initial consultation to launch and beyond. We keep things simple, transparent, and results-focused. Your business deserves a partner who listens."
|
|
features={[
|
|
{
|
|
id: "step-1", title: "Discovery & Strategy", tags: ["Day 1", "15-30 mins"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/illustration-of-a-creative-discovery-cal-1773935714880-17bdc309.png?_wi=1", imageAlt: "Discovery call illustration"},
|
|
{
|
|
id: "step-2", title: "Design & Development", tags: ["Days 2-5", "Mobile-First Approach"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/illustration-of-web-design-and-developme-1773935712636-0fc20480.png", imageAlt: "Web design development illustration"},
|
|
{
|
|
id: "step-3", title: "Review & Refine", tags: ["Day 6", "Your Feedback Matters"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/screenshot-mockup-of-a-modern-bakery-web-1773935714815-c71f4d59.png?_wi=1", imageAlt: "Website review process"},
|
|
{
|
|
id: "step-4", title: "Launch & Training", tags: ["Day 7", "Live & Ready"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/illustration-of-website-launch-celebrati-1773935711780-4fe2661c.png?_wi=1", imageAlt: "Website launch celebration"},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Our Approach"
|
|
tagAnimation="slide-up"
|
|
carouselMode="buttons"
|
|
/>
|
|
</div>
|
|
|
|
<div id="service-features" data-section="service-features">
|
|
<FeatureCardTwentyThree
|
|
title="What Makes Our Service Different"
|
|
description="We're not just building websites. We're building conversion machines designed specifically for local GTA businesses that want to grow faster."
|
|
features={[
|
|
{
|
|
id: "feature-1", title: "Conversion-Focused Design", tags: ["Strategic Layout", "Higher ROI"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/modern-illustration-of-a-growth-focused--1773935712416-8420f0ec.png?_wi=1", imageAlt: "Conversion focused design"},
|
|
{
|
|
id: "feature-2", title: "SEO Built-In", tags: ["Better Rankings", "More Visibility"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/premium-illustration-of-a-full-featured--1773935714549-f058d2a4.png?_wi=1", imageAlt: "SEO optimization"},
|
|
{
|
|
id: "feature-3", title: "Lightning Fast Loading", tags: ["Mobile Optimized", "User Experience"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/screenshot-mockup-of-a-modern-fitness-st-1773935714366-af6321ed.png?_wi=1", imageAlt: "Fast loading speed"},
|
|
{
|
|
id: "feature-4", title: "Local Business Focus", tags: ["GTA Expertise", "Real Understanding"],
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/screenshot-mockup-of-a-contractor-constr-1773935714113-1d2d71f3.png?_wi=1", imageAlt: "Local business expertise"},
|
|
]}
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Our Advantage"
|
|
tagAnimation="slide-up"
|
|
carouselMode="buttons"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardOne
|
|
title="Why Business Owners Trust Us"
|
|
description="Real results from real GTA business owners. See how our service has transformed their online presence and revenue."
|
|
testimonials={[
|
|
{
|
|
id: "testimonial-1", name: "Sarah Chen", role: "Owner", company: "Sweet Dreams Bakery", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-smiling-femal-1773935711800-8c62d304.png?_wi=2", imageAlt: "Sarah Chen"},
|
|
{
|
|
id: "testimonial-2", name: "Marcus Williams", role: "Founder", company: "Thompson Contracting", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-confident-mal-1773935711567-a0bd5f8e.png?_wi=2", imageAlt: "Marcus Williams"},
|
|
{
|
|
id: "testimonial-3", name: "Priya Patel", role: "Manager", company: "Prestige Fitness Studio", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-female-fitnes-1773935711339-852b68f5.png?_wi=2", imageAlt: "Priya Patel"},
|
|
{
|
|
id: "testimonial-4", name: "David Thompson", role: "Senior Partner", company: "Thompson & Associates Legal", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-distinguished-1773935713362-894a53c8.png?_wi=2", imageAlt: "David Thompson"},
|
|
{
|
|
id: "testimonial-5", name: "Jessica Rodriguez", role: "CEO", company: "Raya Restaurant Group", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-female-restau-1773935712170-60e5d814.png?_wi=1", imageAlt: "Jessica Rodriguez"},
|
|
{
|
|
id: "testimonial-6", name: "Ahmed Hassan", role: "Owner", company: "Elite Hair Salon", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/professional-headshot-of-a-male-hair-sal-1773935711950-38f36bc8.png?_wi=1", imageAlt: "Ahmed Hassan"},
|
|
]}
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="scale-rotate"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Success Stories"
|
|
tagAnimation="slide-up"
|
|
carouselMode="buttons"
|
|
/>
|
|
</div>
|
|
|
|
<div id="final-cta" data-section="final-cta">
|
|
<ContactSplit
|
|
tag="Ready to Transform Your Online Presence?"
|
|
title="Get Your Free Website Quote Today"
|
|
description="Schedule your 15-minute consultation. We'll understand your business, discuss your goals, and show you exactly how we can help you convert more customers online. No pressure. No sales pitch. Just real talk about what your business needs."
|
|
tagAnimation="slide-up"
|
|
background={{
|
|
variant: "animated-grid"}}
|
|
useInvertedBackground={false}
|
|
mediaPosition="right"
|
|
mediaAnimation="slide-up"
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BAcvqI0IFhWz9EwREGjXu0WNvG/illustration-of-a-business-growth-succes-1773935712218-6a6ba0cd.png?_wi=1"
|
|
inputPlaceholder="Enter your email"
|
|
buttonText="Get My Free Quote"
|
|
termsText="We respect your privacy. No spam, ever. We'll reach out within 24 hours to schedule your free consultation."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="NickToPixels"
|
|
copyrightText="© 2025 NickToPixels. Web Design for Toronto Businesses. All rights reserved."
|
|
socialLinks={[
|
|
{
|
|
icon: Instagram,
|
|
href: "https://instagram.com/nicktopixels", ariaLabel: "Follow us on Instagram"},
|
|
{
|
|
icon: Linkedin,
|
|
href: "https://linkedin.com/company/nicktopixels", ariaLabel: "Connect on LinkedIn"},
|
|
{
|
|
icon: Twitter,
|
|
href: "https://twitter.com/nicktopixels", ariaLabel: "Follow us on Twitter"},
|
|
{
|
|
icon: Mail,
|
|
href: "mailto:hello@nicktopixels.ca", ariaLabel: "Email us"},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
}
|