Merge version_1 into main #1

Merged
bender merged 1 commits from version_1 into main 2026-04-21 16:39:10 +00:00

View File

@@ -17,390 +17,183 @@ import { Clock, Database, Target, TrendingUp, Users } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="large"
background="none"
cardStyle="solid"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="bold"
defaultButtonVariant="text-stagger"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="large"
background="none"
cardStyle="solid"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "About",
id: "about",
},
{
name: "Skills",
id: "features",
},
{
name: "Projects",
id: "products",
},
{
name: "Testimonials",
id: "testimonials",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Data Scientist Portfolio"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Skills", id: "features" },
{ name: "Projects", id: "products" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" },
]}
brandName="Data Scientist Portfolio"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
background={{
variant: "radial-gradient",
}}
title="Bridging Data and Insights"
description="I transform raw data into actionable business intelligence through predictive modeling, statistical analysis, and machine learning solutions."
buttons={[
{
text: "View Projects",
href: "#products",
},
{
text: "Get In Touch",
href: "#contact",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/3d-abstract-cyber-network-visualization-design_1048-17445.jpg"
imageAlt="Data visualization dashboard"
mediaAnimation="blur-reveal"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/senior-man-with-grey-hair-wearing-business-suit-tie-looking-side-relax-profile-pose-with-natural-face-confident-smile_839833-13950.jpg",
alt: "Senior data professional",
},
{
src: "http://img.b2bpic.net/free-photo/joyful-man-white-tshirt-jacket-smiling-brown-background_197531-26657.jpg",
alt: "Professional partner",
},
{
src: "http://img.b2bpic.net/free-photo/cheerful-european-man-glasses-suit-smiling-excited-looking-camera-with-amazed-happy-face-w_1258-154166.jpg",
alt: "Analytics lead",
},
{
src: "http://img.b2bpic.net/free-photo/closeup-confident-male-employee-white-collar-shirt-smiling-camera-standing-selfassured-agai_1258-112592.jpg",
alt: "Tech consultant",
},
{
src: "http://img.b2bpic.net/free-photo/smiling-senior-engineer-solar-panels-plant-reading-documentation_482257-120499.jpg",
alt: "Data mentor",
},
]}
avatarText="Trusted by 100+ industry leaders"
marqueeItems={[
{
type: "text",
text: "Predictive Analytics",
},
{
type: "text",
text: "Machine Learning",
},
{
type: "text",
text: "Big Data Engineering",
},
{
type: "text",
text: "Cloud Solutions",
},
{
type: "text",
text: "Data Strategy",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
background={{ variant: "radial-gradient" }}
title="Bridging Data and Insights"
description="I transform raw data into actionable business intelligence through predictive modeling, statistical analysis, and machine learning solutions."
buttons={[
{ text: "View Projects", href: "#products" },
{ text: "Get In Touch", href: "#contact" },
]}
imageSrc="http://img.b2bpic.net/free-photo/3d-abstract-cyber-network-visualization-design_1048-17445.jpg"
imageAlt="Data visualization dashboard"
mediaAnimation="blur-reveal"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/senior-man-with-grey-hair-wearing-business-suit-tie-looking-side-relax-profile-pose-with-natural-face-confident-smile_839833-13950.jpg", alt: "Senior data professional" },
{ src: "http://img.b2bpic.net/free-photo/joyful-man-white-tshirt-jacket-smiling-brown-background_197531-26657.jpg", alt: "Professional partner" },
{ src: "http://img.b2bpic.net/free-photo/cheerful-european-man-glasses-suit-smiling-excited-looking-camera-with-amazed-happy-face-w_1258-154166.jpg", alt: "Analytics lead" },
{ src: "http://img.b2bpic.net/free-photo/closeup-confident-male-employee-white-collar-shirt-smiling-camera-standing-selfassured-agai_1258-112592.jpg", alt: "Tech consultant" },
{ src: "http://img.b2bpic.net/free-photo/smiling-senior-engineer-solar-panels-plant-reading-documentation_482257-120499.jpg", alt: "Data mentor" },
]}
avatarText="Trusted by 100+ industry leaders"
marqueeItems={[
{ type: "text", text: "Predictive Analytics" },
{ type: "text", text: "Machine Learning" },
{ type: "text", text: "Big Data Engineering" },
{ type: "text", text: "Cloud Solutions" },
{ type: "text", text: "Data Strategy" },
]}
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={true}
tag="About Me"
title="Passionate about Uncovering Patterns"
description="With over 5 years of experience in data science, I thrive on solving complex technical challenges. My approach combines rigorous statistics with intuitive data visualization to drive results."
subdescription="I specialize in Python, R, SQL, and cloud platforms like AWS and GCP."
icon={Database}
imageSrc="http://img.b2bpic.net/free-photo/corridor-mstores-shopping-mall-unfocusedall-unfocused_1203-1297.jpg"
imageAlt="Data scientist at work"
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={true}
tag="About Me"
title="Passionate about Uncovering Patterns"
description="With over 5 years of experience in data science, I thrive on solving complex technical challenges. My approach combines rigorous statistics with intuitive data visualization to drive results."
subdescription="I specialize in Python, R, SQL, and cloud platforms like AWS and GCP."
icon={Database}
imageSrc="http://img.b2bpic.net/free-photo/corridor-mstores-shopping-mall-unfocusedall-unfocused_1203-1297.jpg"
imageAlt="Data scientist at work"
mediaAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardThree
animationType="slide-up"
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
features={[
{
title: "Machine Learning",
description: "Developing and training predictive models using advanced algorithms.",
imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-flat-line-icon-set-business-concept-icons-design_1057-10188.jpg",
},
{
title: "Data Visualization",
description: "Turning abstract data into compelling visual stories using BI tools.",
imageSrc: "http://img.b2bpic.net/free-vector/collection-green-blue-infographic-elements_23-2147610425.jpg",
},
{
title: "Statistical Analysis",
description: "Applying rigorous math to extract actionable insights from datasets.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qqa8nr",
},
{
title: "Data Engineering",
description: "Building robust pipelines for scalable data processing.",
imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-element-collection-flat-design_23-2147895368.jpg",
},
{
title: "Strategy Consulting",
description: "Advising businesses on leveraging data for growth.",
imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-icon-set-vector-illustration_47987-29969.jpg",
},
]}
title="My Core Expertise"
description="Technical skills that enable data-driven innovation."
/>
</div>
<div id="features" data-section="features">
<FeatureCardThree
animationType="slide-up"
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
features={[
{ title: "Machine Learning", description: "Developing and training predictive models using advanced algorithms.", imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-flat-line-icon-set-business-concept-icons-design_1057-10188.jpg" },
{ title: "Data Visualization", description: "Turning abstract data into compelling visual stories using BI tools.", imageSrc: "http://img.b2bpic.net/free-vector/collection-green-blue-infographic-elements_23-2147610425.jpg" },
{ title: "Statistical Analysis", description: "Applying rigorous math to extract actionable insights from datasets.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qqa8nr" },
{ title: "Data Engineering", description: "Building robust pipelines for scalable data processing.", imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-element-collection-flat-design_23-2147895368.jpg" },
{ title: "Strategy Consulting", description: "Advising businesses on leveraging data for growth.", imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-icon-set-vector-illustration_47987-29969.jpg" },
]}
title="My Core Expertise"
description="Technical skills that enable data-driven innovation."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="scale-rotate"
textboxLayout="default"
useInvertedBackground={true}
metrics={[
{
id: "m1",
icon: TrendingUp,
title: "Accuracy Improvement",
value: "24%",
},
{
id: "m2",
icon: Clock,
title: "Model Efficiency",
value: "40%",
},
{
id: "m3",
icon: Users,
title: "Insight Engagement",
value: "65%",
},
{
id: "m4",
icon: Database,
title: "Data Processing",
value: "10TB+",
},
{
id: "m5",
icon: Target,
title: "Conversion Rate",
value: "12%",
},
]}
title="Proven Impact"
description="Quantifiable results from recent projects."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="scale-rotate"
textboxLayout="default"
useInvertedBackground={true}
metrics={[
{ id: "m1", icon: TrendingUp, title: "Accuracy Improvement", value: "24%" },
{ id: "m2", icon: Clock, title: "Model Efficiency", value: "40%" },
{ id: "m3", icon: Users, title: "Insight Engagement", value: "65%" },
{ id: "m4", icon: Database, title: "Data Processing", value: "10TB+" },
{ id: "m5", icon: Target, title: "Conversion Rate", value: "12%" },
]}
title="Proven Impact"
description="Quantifiable results from recent projects."
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Customer Segmentation Engine",
price: "AI Models",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-boss-sticker-mug_23-2148636922.jpg",
},
{
id: "p2",
name: "Predictive Forecasting Tool",
price: "Fintech",
imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",
},
{
id: "p3",
name: "Sentiment Analysis Dashboard",
price: "NLP",
imageSrc: "http://img.b2bpic.net/free-photo/investor-analyzing-forex-market-trends_482257-121312.jpg",
},
{
id: "p4",
name: "Sales Geo-Visualization",
price: "Mapping",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-with-map_1153-414.jpg",
},
{
id: "p5",
name: "Trend Forecast Engine",
price: "Time Series",
imageSrc: "http://img.b2bpic.net/free-photo/data-statistic-green-blackboard_1379-290.jpg",
},
{
id: "p6",
name: "Deep Learning Architecture",
price: "R&D",
imageSrc: "http://img.b2bpic.net/free-photo/digital-transformation-corporate-wallpaper_53876-97646.jpg",
},
]}
title="Selected Projects"
description="Showcasing high-impact work across diverse industries."
/>
</div>
<div id="products" data-section="products">
<ProductCardOne
animationType="slide-up"
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Customer Segmentation Engine", price: "AI Models", imageSrc: "http://img.b2bpic.net/free-photo/top-view-boss-sticker-mug_23-2148636922.jpg" },
{ id: "p2", name: "Predictive Forecasting Tool", price: "Fintech", imageSrc: "http://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg" },
{ id: "p3", name: "Sentiment Analysis Dashboard", price: "NLP", imageSrc: "http://img.b2bpic.net/free-photo/investor-analyzing-forex-market-trends_482257-121312.jpg" },
{ id: "p4", name: "Sales Geo-Visualization", price: "Mapping", imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-with-map_1153-414.jpg" },
{ id: "p5", name: "Trend Forecast Engine", price: "Time Series", imageSrc: "http://img.b2bpic.net/free-photo/data-statistic-green-blackboard_1379-290.jpg" },
{ id: "p6", name: "Deep Learning Architecture", price: "R&D", imageSrc: "http://img.b2bpic.net/free-photo/digital-transformation-corporate-wallpaper_53876-97646.jpg" },
]}
title="Selected Projects"
description="Showcasing high-impact work across diverse industries."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="depth-3d"
textboxLayout="split"
useInvertedBackground={true}
testimonials={[
{
id: "t1",
name: "Alex Smith",
role: "Head of Engineering",
testimonial: "An incredible data scientist who truly understands business needs.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-businessman-standing-against-grey-wall-clenching-his-fist_23-2148087510.jpg",
},
{
id: "t2",
name: "Maria Lopez",
role: "CEO",
testimonial: "Their model significantly improved our conversion rates.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-business-man_1303-19609.jpg",
},
{
id: "t3",
name: "James Bond",
role: "Marketing Director",
testimonial: "The insights delivered were clear and actionable.",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-holding-tablet_23-2149927578.jpg",
},
{
id: "t4",
name: "Elena Kim",
role: "Lead Architect",
testimonial: "Professional, fast, and extremely skilled in machine learning.",
imageSrc: "http://img.b2bpic.net/free-photo/laptop-digitally-generated-paper-logistics-working_1134-928.jpg",
},
{
id: "t5",
name: "Sam Johnson",
role: "CTO",
testimonial: "I highly recommend for any complex data project.",
imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",
},
]}
title="Client Feedback"
description="What partners say about our collaborations."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="depth-3d"
textboxLayout="split"
useInvertedBackground={true}
testimonials={[
{ id: "t1", name: "Alex Smith", role: "Head of Engineering", testimonial: "An incredible data scientist who truly understands business needs.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-businessman-standing-against-grey-wall-clenching-his-fist_23-2148087510.jpg" },
{ id: "t2", name: "Maria Lopez", role: "CEO", testimonial: "Their model significantly improved our conversion rates.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-business-man_1303-19609.jpg" },
{ id: "t3", name: "James Bond", role: "Marketing Director", testimonial: "The insights delivered were clear and actionable.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-holding-tablet_23-2149927578.jpg" },
{ id: "t4", name: "Elena Kim", role: "Lead Architect", testimonial: "Professional, fast, and extremely skilled in machine learning.", imageSrc: "http://img.b2bpic.net/free-photo/laptop-digitally-generated-paper-logistics-working_1134-928.jpg" },
{ id: "t5", name: "Sam Johnson", role: "CTO", testimonial: "I highly recommend for any complex data project.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg" },
]}
title="Client Feedback"
description="What partners say about our collaborations."
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "What tools do you use?",
content: "I primarily use Python, PyTorch, TensorFlow, Pandas, SQL, and various cloud platforms.",
},
{
id: "f2",
title: "Can you handle big data?",
content: "Yes, I have extensive experience with distributed computing and large-scale data processing.",
},
{
id: "f3",
title: "Are you available for consulting?",
content: "I am open to new collaborations and consulting opportunities. Let's discuss your project.",
},
]}
sideTitle="Common Inquiries"
sideDescription="Quick answers to help you understand my services."
faqsAnimation="blur-reveal"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{ id: "f1", title: "What tools do you use?", content: "I primarily use Python, PyTorch, TensorFlow, Pandas, SQL, and various cloud platforms." },
{ id: "f2", title: "Can you handle big data?", content: "Yes, I have extensive experience with distributed computing and large-scale data processing." },
{ id: "f3", title: "Are you available for consulting?", content: "I am open to new collaborations and consulting opportunities. Let's discuss your project." },
]}
sideTitle="Common Inquiries"
sideDescription="Quick answers to help you understand my services."
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Let's Connect"
title="Ready for your next project?"
description="Whether you have a specific question or want to explore collaboration opportunities, I'm here to help."
buttons={[
{
text: "Contact Me",
href: "mailto:hello@example.com",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{ variant: "plain" }}
tag="Let's Connect"
title="Ready for your next project?"
description="Whether you have a specific question or want to explore collaboration opportunities, I'm here to help."
buttons={[{ text: "Contact Me", href: "mailto:hello@example.com" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/3d-render-modern-technology-background-with-low-poly-design_1048-15445.jpg"
logoText="Data Portfolio"
columns={[
{
title: "Navigate",
items: [
{
label: "About",
href: "#about",
},
{
label: "Projects",
href: "#products",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Social",
items: [
{
label: "LinkedIn",
href: "https://linkedin.com",
},
{
label: "GitHub",
href: "https://github.com",
},
],
},
]}
copyrightText="© 2025 | Data Scientist Portfolio"
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="http://img.b2bpic.net/free-photo/3d-render-modern-technology-background-with-low-poly-design_1048-15445.jpg"
logoText="Data Portfolio"
columns={[
{ title: "Navigate", items: [{ label: "About", href: "#about" }, { label: "Projects", href: "#products" }, { label: "Contact", href: "#contact" }] },
{ title: "Social", items: [{ label: "LinkedIn", href: "https://linkedin.com" }, { label: "GitHub", href: "https://github.com" }] },
]}
copyrightText="© 2025 | Data Scientist Portfolio"
/>
</div>
</ReactLenis>
</ThemeProvider>
);