250 lines
15 KiB
TypeScript
250 lines
15 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
|
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
|
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
|
|
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import { Award, BookOpen, Clock, Crown, Shield, Sparkles, Star, Users, Users2 } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="largeSmall"
|
|
background="circleGradient"
|
|
cardStyle="soft-shadow"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="medium"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
brandName="ElderAI Learn"
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Lessons", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "FAQ", id: "faq" }
|
|
]}
|
|
button={{ text: "Sign Up Now", href: "#contact" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroCentered
|
|
title="Learn AI at Your Own Pace"
|
|
description="Designed specifically for seniors who want to understand and master artificial intelligence. Our patient instructors break down complex concepts into simple, digestible lessons you can follow from home."
|
|
background={{ variant: "gradient-bars" }}
|
|
avatars={[
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-woman-1773792105079-917fdf77.png", alt: "Senior student Margaret" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-man-a-1773792105282-bab749a2.png", alt: "Senior student Robert" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-man-a-1773792105203-de55b0bb.png", alt: "Senior student James" },
|
|
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-woman-1773792105891-f75d4b52.png", alt: "Senior student Patricia" }
|
|
]}
|
|
avatarText="Join 2,000+ seniors already learning"
|
|
buttons={[
|
|
{ text: "Book Your First Lesson", href: "#contact" },
|
|
{ text: "Learn More", href: "#about" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextSplitAbout
|
|
title="Why ElderAI Learn?"
|
|
description={[
|
|
"We believe everyone deserves access to understanding AI, regardless of age or tech experience. Our platform is built from the ground up with seniors in mind—featuring large text, simple navigation, and patient instructors who love teaching.", "Unlike generic tech courses, our curriculum is tailored for older learners. We start with the basics of artificial intelligence, real-world applications you'll recognize, and gradually build your confidence. No jargon. No pressure. Just genuine learning.", "Our instructors are carefully selected for both technical expertise and patience. Many have experience teaching family members and understand the unique needs of mature learners. Your questions matter. Your pace matters. Your success matters."
|
|
]}
|
|
buttons={[
|
|
{ text: "Meet Our Instructors", href: "#features" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureBorderGlow
|
|
title="Our Learning Approach"
|
|
description="We've designed our lessons to work for your learning style. Clear, patient, and effective."
|
|
features={[
|
|
{ icon: Users, title: "One-on-One Mentoring", description: "Work with a dedicated instructor who adapts to your pace and learning style. No rush, no judgment." },
|
|
{ icon: BookOpen, title: "Interactive Lessons", description: "Learn through simple, hands-on activities. See AI in action with everyday examples you can relate to." },
|
|
{ icon: Users2, title: "Supportive Community", description: "Connect with fellow learners your age. Share experiences, ask questions, and celebrate wins together." },
|
|
{ icon: Clock, title: "Learn on Your Schedule", description: "Lessons available in flexible time slots. Take breaks whenever you need. No pressure to keep up." },
|
|
{ icon: Shield, title: "Safe & Secure", description: "Your privacy and data security are our top priority. Learn with complete peace of mind." },
|
|
{ icon: Award, title: "Certificates Included", description: "Complete lessons and earn certificates to show your friends and family your new skills." }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="How We Teach"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardTwo
|
|
title="Simple, Affordable Plans"
|
|
description="Choose the plan that works best for you. All plans include 24/7 support and lifetime access to materials."
|
|
plans={[
|
|
{
|
|
id: "beginner", badge: "Most Popular", badgeIcon: Star,
|
|
price: "$49", subtitle: "Perfect for getting started", buttons: [{ text: "Start Learning", href: "#contact" }],
|
|
features: ["4 introductory lessons", "Email support", "Access to community forum", "Lifetime access to lesson materials", "Certificate of completion"]
|
|
},
|
|
{
|
|
id: "explorer", badge: "Best Value", badgeIcon: Sparkles,
|
|
price: "$99", subtitle: "Go deeper into AI", buttons: [{ text: "Start Learning", href: "#contact" }],
|
|
features: ["12 intermediate lessons", "Priority email & chat support", "Monthly group sessions", "Lifetime access to all materials", "Advanced certificate", "Personal progress tracker"]
|
|
},
|
|
{
|
|
id: "master", badge: "Premium", badgeIcon: Crown,
|
|
price: "$149", subtitle: "Become an AI expert", buttons: [{ text: "Start Learning", href: "#contact" }],
|
|
features: ["24+ advanced lessons", "1-on-1 instructor calls (weekly)", "Weekly group sessions", "Lifetime access + future updates", "Professional certificate", "Career guidance & consultation"]
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
tag="Pricing"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
title="What Our Learners Say"
|
|
description="Hear from seniors who've transformed their relationship with technology and AI."
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Margaret Chen", role: "Retired Teacher", company: "San Francisco, CA", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-woman-1773792105079-917fdf77.png?_wi=1"
|
|
},
|
|
{
|
|
id: "2", name: "Robert Williams", role: "Retired Engineer", company: "Austin, TX", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-man-a-1773792105282-bab749a2.png?_wi=1"
|
|
},
|
|
{
|
|
id: "3", name: "Patricia Johnson", role: "Retired Nurse", company: "Portland, OR", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-woman-1773792105891-f75d4b52.png"
|
|
},
|
|
{
|
|
id: "4", name: "James Rodriguez", role: "Retired Accountant", company: "Denver, CO", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-man-a-1773792105203-de55b0bb.png"
|
|
},
|
|
{
|
|
id: "5", name: "Dorothy Garcia", role: "Retired Artist", company: "Seattle, WA", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-woman-1773792105079-917fdf77.png?_wi=2"
|
|
},
|
|
{
|
|
id: "6", name: "David Miller", role: "Retired Principal", company: "Boston, MA", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/portrait-of-a-warm-friendly-senior-man-a-1773792105282-bab749a2.png?_wi=2"
|
|
}
|
|
]}
|
|
kpiItems={[
|
|
{ value: "98%", label: "Course Completion Rate" },
|
|
{ value: "2000+", label: "Active Learners" },
|
|
{ value: "4.9/5", label: "Average Rating" }
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
tag="Success Stories"
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
title="Frequently Asked Questions"
|
|
description="Have questions about our program? We've got answers."
|
|
faqs={[
|
|
{ id: "faq-1", title: "Do I need any tech experience?", content: "Not at all! Our program starts from scratch and teaches the fundamentals. We assume no prior knowledge and explain everything in plain English." },
|
|
{ id: "faq-2", title: "What if I'm not comfortable with computers?", content: "That's perfectly okay. Our instructors will help you get comfortable at your own pace. Many of our students had the same concerns before starting—now they're confident AI learners." },
|
|
{ id: "faq-3", title: "Can I take lessons on my tablet or phone?", content: "Yes! All our lessons are designed to work on tablets, phones, and computers. You can learn on whatever device you're most comfortable with." },
|
|
{ id: "faq-4", title: "What if I fall behind or need extra help?", content: "We offer flexible pacing and additional support. You can ask questions anytime, and our instructors are happy to slow down or explain concepts differently." },
|
|
{ id: "faq-5", title: "Is there a money-back guarantee?", content: "Yes! If you're not satisfied with your first lesson, we'll refund your money within 30 days, no questions asked." },
|
|
{ id: "faq-6", title: "How long does each lesson take?", content: "Most lessons are 45-60 minutes. Some are shorter, some longer—we provide the time commitment upfront so you can plan accordingly." }
|
|
]}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/an-older-person-using-a-smartphone-or-ta-1773792105926-505c2e3f.png"
|
|
imageAlt="Customer support team helping senior"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
faqsAnimation="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
tag="Questions?"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplit
|
|
tag="Get Started"
|
|
title="Book Your First Lesson Today"
|
|
description="Join thousands of seniors learning AI. Sign up now and schedule your introductory session with one of our patient instructors."
|
|
background={{ variant: "radial-gradient" }}
|
|
useInvertedBackground={false}
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/a-warm-welcoming-scene-of-a-senior-perso-1773792106018-62a8e7b0.png"
|
|
imageAlt="Senior learning AI on tablet"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
inputPlaceholder="Enter your email address"
|
|
buttonText="Get Started Free"
|
|
termsText="By clicking Get Started, you agree to our Terms of Service and Privacy Policy. We'll send you a confirmation email with your first lesson details."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B5w1ZTPKBxGDR3waVRCDA55VUG/a-soft-abstract-background-image-showing-1773792105324-ffaf4f9c.png"
|
|
imageAlt="Community connection background"
|
|
logoText="ElderAI Learn"
|
|
copyrightText="© 2025 ElderAI Learn. All rights reserved. Designed for seniors, by educators."
|
|
columns={[
|
|
{
|
|
title: "Learning", items: [
|
|
{ label: "Lessons", href: "#features" },
|
|
{ label: "Pricing", href: "#pricing" },
|
|
{ label: "Meet Instructors", href: "#about" },
|
|
{ label: "FAQ", href: "#faq" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Contact", href: "#contact" },
|
|
{ label: "Blog", href: "#" },
|
|
{ label: "Careers", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{ label: "Help Center", href: "#" },
|
|
{ label: "Community Forum", href: "#" },
|
|
{ label: "Technical Support", href: "#" },
|
|
{ label: "Accessibility", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Legal", items: [
|
|
{ label: "Privacy Policy", href: "#" },
|
|
{ label: "Terms of Service", href: "#" },
|
|
{ label: "Cookie Policy", href: "#" },
|
|
{ label: "Disclaimer", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |