Update src/app/page.tsx
This commit is contained in:
216
src/app/page.tsx
216
src/app/page.tsx
@@ -11,10 +11,53 @@ import TestimonialCardFifteen from "@/components/sections/testimonial/Testimonia
|
||||
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
||||
import ContactText from "@/components/sections/contact/ContactText";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
import { TrendingUp, Clock, Users, DollarSign, Sparkles, Zap } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { Zap, TrendingUp, Clock, Users, DollarSign, Sparkles } from "lucide-react";
|
||||
|
||||
export default function HomePage() {
|
||||
const navItems = [
|
||||
{ name: "Product", id: "product" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Customers", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Product", items: [
|
||||
{ label: "Features", href: "#features" },
|
||||
{ label: "Pricing", href: "#pricing" },
|
||||
{ label: "Security", href: "#" },
|
||||
{ label: "Roadmap", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "/about" },
|
||||
{ label: "Blog", href: "#" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources", items: [
|
||||
{ label: "Documentation", href: "#" },
|
||||
{ label: "API Reference", href: "#" },
|
||||
{ label: "Support", href: "#" },
|
||||
{ label: "Status", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Security Policy", href: "#" },
|
||||
{ label: "Compliance", href: "#" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="bounce-effect"
|
||||
@@ -28,24 +71,14 @@ export default function HomePage() {
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
{/* Navbar */}
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={navItems}
|
||||
button={{ text: "See Your 10-Minute Setup", href: "#contact" }}
|
||||
brandName="OpenFlow AI"
|
||||
navItems={[
|
||||
{ name: "Product", id: "product" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Customers", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
button={{
|
||||
text: "See Your 10-Minute Setup", href: "contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Hero Section */}
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardTestimonial
|
||||
title="Deploy AI agents Answer questions Never again"
|
||||
@@ -54,41 +87,36 @@ export default function HomePage() {
|
||||
tagIcon={Zap}
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "glowing-orb" }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-modern-clean-saas-dashboard-interface--1773154561537-661c1628.png"
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-modern-clean-saas-dashboard-interface--1773158843938-5f63f61a.jpg"
|
||||
imageAlt="OpenFlow AI Dashboard"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah Chen", handle: "HR Director, TechCorp", testimonial: "OpenFlow AI reduced our HR ticket volume by 65% in the first month. Our team can now focus on strategic initiatives.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-woma-1773154562468-e76be4ee.png"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-woma-1773158838996-2a32a02c.png"
|
||||
},
|
||||
{
|
||||
name: "Marcus Johnson", handle: "IT Head, CloudScale", testimonial: "Password resets and access requests are now instant. Our support team has never been happier.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-man--1773154561908-fb0a471a.png"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-man--1773158843791-c4e8e4f4.jpg"
|
||||
},
|
||||
{
|
||||
name: "Elena Rodriguez", handle: "Finance Manager, FinFlow", testimonial: "Expense approvals that took 2 days now complete in minutes. The ROI was immediate.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-woma-1773154562271-e7fa2e9e.png"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-woma-1773158836415-73e69831.png"
|
||||
},
|
||||
{
|
||||
name: "David Kim", handle: "COO, Enterprise Solutions", testimonial: "The no-code setup was remarkable. We were live with our first bot in under 10 minutes.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-man--1773154562277-e1364c7b.jpg"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/professional-headshot-portrait-of-a-man--1773158837298-70f8b9eb.png"
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "See Your 10-Minute Setup", href: "contact"
|
||||
},
|
||||
{
|
||||
text: "Watch Demo", href: "https://example.com/demo"
|
||||
},
|
||||
{ text: "See Your 10-Minute Setup", href: "#contact" },
|
||||
{ text: "Watch Demo", href: "https://example.com/demo" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Product Section */}
|
||||
<div id="product" data-section="product">
|
||||
<ProductCardTwo
|
||||
title="AI Agents for Every Department"
|
||||
@@ -100,22 +128,21 @@ export default function HomePage() {
|
||||
products={[
|
||||
{
|
||||
id: "1", brand: "OpenFlow", name: "HR Agent", price: "Benefits Inquiry", rating: 5,
|
||||
reviewCount: "10k+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-clean-modern-interface-screen-showing--1773154562832-2e4b1741.png", imageAlt: "HR Agent Interface"
|
||||
reviewCount: "10k+", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-clean-modern-interface-screen-showing--1773158837446-b969f948.png", imageAlt: "HR Agent Interface"
|
||||
},
|
||||
{
|
||||
id: "2", brand: "OpenFlow", name: "IT Agent", price: "Access & Support", rating: 5,
|
||||
reviewCount: "8.5k", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-sleek-it-support-dashboard-interface-s-1773154564104-9391b699.png", imageAlt: "IT Agent Interface"
|
||||
reviewCount: "8.5k", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-sleek-it-support-dashboard-interface-s-1773158837039-e706c0c2.png", imageAlt: "IT Agent Interface"
|
||||
},
|
||||
{
|
||||
id: "3", brand: "OpenFlow", name: "Finance Agent", price: "Approval Workflow", rating: 5,
|
||||
reviewCount: "7.2k", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-professional-finance-dashboard-showing-1773154562106-b1a6949b.jpg", imageAlt: "Finance Agent Interface"
|
||||
reviewCount: "7.2k", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/a-professional-finance-dashboard-showing-1773158843254-5364a9ce.jpg", imageAlt: "Finance Agent Interface"
|
||||
},
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Features Section */}
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwelve
|
||||
title="Why Enterprise Teams Choose OpenFlow"
|
||||
@@ -129,21 +156,13 @@ export default function HomePage() {
|
||||
id: "deployment", label: "10 Min", title: "Deploy in Minutes, Not Months", items: [
|
||||
"No code required", "Pre-built templates", "Instant configuration", "Live within 10 minutes"
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "See Demo", href: "https://example.com/demo"
|
||||
},
|
||||
],
|
||||
buttons: [{ text: "See Demo", href: "https://example.com/demo" }],
|
||||
},
|
||||
{
|
||||
id: "policy", label: "Smart", title: "Policy-Based AI Responses", items: [
|
||||
"Upload company policies", "Context-aware answers", "Compliance guaranteed", "Zero hallucinations"
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Learn More", href: "#"
|
||||
},
|
||||
],
|
||||
buttons: [{ text: "Learn More", href: "#" }],
|
||||
},
|
||||
{
|
||||
id: "integration", label: "Seamless", title: "Deploy Across Your Stack", items: [
|
||||
@@ -154,7 +173,6 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Metrics Section */}
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
title="OpenFlow AI Impact"
|
||||
@@ -184,7 +202,6 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Pricing Section */}
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
title="Simple, Transparent Pricing"
|
||||
@@ -196,12 +213,8 @@ export default function HomePage() {
|
||||
plans={[
|
||||
{
|
||||
id: "1", price: "Custom", name: "Starter", buttons: [
|
||||
{
|
||||
text: "Get Started", href: "contact"
|
||||
},
|
||||
{
|
||||
text: "Learn More", href: "#"
|
||||
},
|
||||
{ text: "Get Started", href: "#contact" },
|
||||
{ text: "Learn More", href: "#" },
|
||||
],
|
||||
features: [
|
||||
"1 AI Agent", "Up to 1,000 queries/month", "Slack integration", "Email support", "30-day onboarding"
|
||||
@@ -210,12 +223,8 @@ export default function HomePage() {
|
||||
{
|
||||
id: "2", badge: "Most Popular", badgeIcon: Sparkles,
|
||||
price: "Custom", name: "Professional", buttons: [
|
||||
{
|
||||
text: "Get Started", href: "contact"
|
||||
},
|
||||
{
|
||||
text: "Chat with Sales", href: "contact"
|
||||
},
|
||||
{ text: "Get Started", href: "#contact" },
|
||||
{ text: "Chat with Sales", href: "#contact" },
|
||||
],
|
||||
features: [
|
||||
"Up to 3 AI Agents", "Unlimited queries", "All channels (Slack, intranet, web)", "Priority support", "Custom integrations", "Analytics dashboard"
|
||||
@@ -223,12 +232,8 @@ export default function HomePage() {
|
||||
},
|
||||
{
|
||||
id: "3", price: "Custom", name: "Enterprise", buttons: [
|
||||
{
|
||||
text: "Contact Sales", href: "contact"
|
||||
},
|
||||
{
|
||||
text: "Schedule Demo", href: "contact"
|
||||
},
|
||||
{ text: "Contact Sales", href: "#contact" },
|
||||
{ text: "Schedule Demo", href: "#contact" },
|
||||
],
|
||||
features: [
|
||||
"Unlimited AI Agents", "White-label deployment", "Advanced security & compliance", "Dedicated success manager", "Custom training", "SLA guarantee (99.9% uptime)"
|
||||
@@ -238,7 +243,6 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Testimonials Section */}
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
testimonial="OpenFlow AI transformed how we handle employee support. What used to take our team days now happens instantly. The ROI was clear within the first month. This is exactly what we needed."
|
||||
@@ -249,28 +253,27 @@ export default function HomePage() {
|
||||
useInvertedBackground={false}
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-divers-1773154562085-06e8065d.png", alt: "Team member 1"
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-divers-1773158843356-07c7132a.jpg", alt: "Team member 1"
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-profes-1773154562814-b37ac6ef.png", alt: "Team member 2"
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-profes-1773158837490-915263bb.png", alt: "Team member 2"
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-profes-1773154562621-12add09e.png", alt: "Team member 3"
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-profes-1773158839600-470e1c22.png", alt: "Team member 3"
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-divers-1773154562606-3ba07073.jpg", alt: "Team member 4"
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-divers-1773158844787-cceef96d.jpg", alt: "Team member 4"
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-profes-1773154562281-8b0fa2b3.png", alt: "Team member 5"
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-profes-1773158837766-60decb90.png", alt: "Team member 5"
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-divers-1773154564718-495f9123.jpg", alt: "Team member 6"
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Al5lXq4FuvVTsncx15643rVlte/small-circular-profile-photo-of-a-divers-1773158837237-24071b8c.png", alt: "Team member 6"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Social Proof Section */}
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
title="Trusted by Leading Enterprises"
|
||||
@@ -286,93 +289,22 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Contact Section */}
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
text="Ready to transform your support operations? See your personalized 10-minute setup today and join enterprise teams automating their workflow."
|
||||
animationType="background-highlight"
|
||||
background={{ variant: "glowing-orb" }}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{
|
||||
text: "See Your 10-Minute Setup", href: "contact"
|
||||
},
|
||||
{
|
||||
text: "Schedule a Demo", href: "contact"
|
||||
},
|
||||
{ text: "See Your 10-Minute Setup", href: "#" },
|
||||
{ text: "Schedule a Demo", href: "#" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Product", items: [
|
||||
{
|
||||
label: "Features", href: "#features"
|
||||
},
|
||||
{
|
||||
label: "Pricing", href: "#pricing"
|
||||
},
|
||||
{
|
||||
label: "Security", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Roadmap", href: "#"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About", href: "/about"
|
||||
},
|
||||
{
|
||||
label: "Blog", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Careers", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Contact", href: "#contact"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources", items: [
|
||||
{
|
||||
label: "Documentation", href: "#"
|
||||
},
|
||||
{
|
||||
label: "API Reference", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Support", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Status", href: "#"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Terms of Service", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Security Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Compliance", href: "#"
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={footerColumns}
|
||||
bottomLeftText="© 2025 OpenFlow AI. All rights reserved."
|
||||
bottomRightText="Powering Enterprise AI Automation"
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user