Merge version_1 into main #2
312
src/app/page.tsx
312
src/app/page.tsx
@@ -25,224 +25,112 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Technology",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Analytics",
|
||||
id: "metrics",
|
||||
},
|
||||
{
|
||||
name: "Support",
|
||||
id: "faq",
|
||||
},
|
||||
]}
|
||||
brandName="FaceAI Med"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Technology", id: "features" },
|
||||
{ name: "Analytics", id: "metrics" },
|
||||
{ name: "Support", id: "faq" },
|
||||
]}
|
||||
brandName="FaceAI Med"
|
||||
button={{ text: "Get Access", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Precision Facial Analytics"
|
||||
description="Revolutionizing medical diagnostics through AI-powered 3D facial bone analysis and skull health insights."
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png?_wi=1",
|
||||
imageAlt: "AI Facial Scan",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png?_wi=2",
|
||||
imageAlt: "3D Bone Mapping",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png?_wi=3",
|
||||
imageAlt: "Diagnostics UI",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png?_wi=4",
|
||||
imageAlt: "Skull Structure",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png?_wi=5",
|
||||
imageAlt: "Clinical Analytics",
|
||||
},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png?_wi=6",
|
||||
imageAlt: "AI Accuracy",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "plain" }}
|
||||
title="Precision Facial Analytics"
|
||||
description="Revolutionizing medical diagnostics through AI-powered 3D facial bone analysis and skull health insights."
|
||||
mediaItems={[
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png", imageAlt: "AI Facial Scan" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png", imageAlt: "3D Bone Mapping" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png", imageAlt: "Diagnostics UI" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png", imageAlt: "Skull Structure" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png", imageAlt: "Clinical Analytics" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-highly-sophisticated-3d-digital-scan-o-1774684974344-8f8de793.png", imageAlt: "AI Accuracy" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Camera Integration",
|
||||
author: "Hardware Sync",
|
||||
description: "Connect any high-res camera for real-time 3D facial capture and processing.",
|
||||
tags: [
|
||||
"AI",
|
||||
"Hardware",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-sleek-modern-interface-window-showing--1774684979817-7a19ca59.png?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Bone Modeling",
|
||||
author: "Engine V2",
|
||||
description: "Automatic 3D reconstruction of facial bone structure for precise clinical assessment.",
|
||||
tags: [
|
||||
"Medical",
|
||||
"3D",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-sleek-modern-interface-window-showing--1774684979817-7a19ca59.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Cognitive Insights",
|
||||
author: "Health AI",
|
||||
description: "Detailed AI-driven insights into cranial health and structural development patterns.",
|
||||
tags: [
|
||||
"Health",
|
||||
"Insights",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-sleek-modern-interface-window-showing--1774684979817-7a19ca59.png?_wi=3",
|
||||
},
|
||||
]}
|
||||
title="Advanced Scanning Capabilities"
|
||||
description="Transform your clinic with state-of-the-art camera integration and AI processing."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ id: "f1", title: "Camera Integration", author: "Hardware Sync", description: "Connect any high-res camera for real-time 3D facial capture and processing.", tags: ["AI", "Hardware"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-sleek-modern-interface-window-showing--1774684979817-7a19ca59.png" },
|
||||
{ id: "f2", title: "Bone Modeling", author: "Engine V2", description: "Automatic 3D reconstruction of facial bone structure for precise clinical assessment.", tags: ["Medical", "3D"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-sleek-modern-interface-window-showing--1774684979817-7a19ca59.png" },
|
||||
{ id: "f3", title: "Cognitive Insights", author: "Health AI", description: "Detailed AI-driven insights into cranial health and structural development patterns.", tags: ["Health", "Insights"], imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/a-sleek-modern-interface-window-showing--1774684979817-7a19ca59.png" }
|
||||
]}
|
||||
title="Advanced Scanning Capabilities"
|
||||
description="Transform your clinic with state-of-the-art camera integration and AI processing."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "99.8%",
|
||||
title: "Accuracy Rate",
|
||||
description: "Precision in bone structure mapping verified by medical studies.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/professional-data-visualization-showing--1774684974814-34a428e8.png?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "1.2s",
|
||||
title: "Scan Latency",
|
||||
description: "Near-instant reconstruction of complex facial anatomy via GPU acceleration.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/professional-data-visualization-showing--1774684974814-34a428e8.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "24/7",
|
||||
title: "Clinic Uptime",
|
||||
description: "Reliable support and cloud-based processing for seamless workflow.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/professional-data-visualization-showing--1774684974814-34a428e8.png?_wi=3",
|
||||
},
|
||||
]}
|
||||
title="Clinical Performance"
|
||||
description="Quantifying the accuracy and impact of our facial analysis engine."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "99.8%", title: "Accuracy Rate", description: "Precision in bone structure mapping verified by medical studies.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/professional-data-visualization-showing--1774684974814-34a428e8.png" },
|
||||
{ id: "m2", value: "1.2s", title: "Scan Latency", description: "Near-instant reconstruction of complex facial anatomy via GPU acceleration.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/professional-data-visualization-showing--1774684974814-34a428e8.png" },
|
||||
{ id: "m3", value: "24/7", title: "Clinic Uptime", description: "Reliable support and cloud-based processing for seamless workflow.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7s7QHXMYUEWqr9yv61nCFhe4/professional-data-visualization-showing--1774684974814-34a428e8.png" }
|
||||
]}
|
||||
title="Clinical Performance"
|
||||
description="Quantifying the accuracy and impact of our facial analysis engine."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How does the scanning work?",
|
||||
content: "Our system captures depth data to generate a precise 3D model of bone structures.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Is this medically approved?",
|
||||
content: "Our platform is designed for research and diagnostic support with high precision.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "What equipment is needed?",
|
||||
content: "A high-resolution RGB-D camera or integrated medical-grade imaging device.",
|
||||
},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Answers to your queries about our AI medical diagnostic tools."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "q1", title: "How does the scanning work?", content: "Our system captures depth data to generate a precise 3D model of bone structures." },
|
||||
{ id: "q2", title: "Is this medically approved?", content: "Our platform is designed for research and diagnostic support with high precision." },
|
||||
{ id: "q3", title: "What equipment is needed?", content: "A high-resolution RGB-D camera or integrated medical-grade imaging device." }
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Answers to your queries about our AI medical diagnostic tools."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Get Started"
|
||||
title="Contact Our Sales Team"
|
||||
description="Ready to bring advanced AI facial analytics to your medical practice?"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Get Started"
|
||||
title="Contact Our Sales Team"
|
||||
description="Ready to bring advanced AI facial analytics to your medical practice?"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="FaceAI Med"
|
||||
columns={[
|
||||
{
|
||||
title: "Product",
|
||||
items: [
|
||||
{
|
||||
label: "Technology",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Analytics",
|
||||
href: "#metrics",
|
||||
},
|
||||
{
|
||||
label: "API Access",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Documentation",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="FaceAI Med"
|
||||
columns={[
|
||||
{
|
||||
title: "Product", items: [
|
||||
{ label: "Technology", href: "#features" },
|
||||
{ label: "Analytics", href: "#metrics" },
|
||||
{ label: "API Access", href: "#" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Documentation", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user