|
|
|
|
@@ -3,111 +3,124 @@
|
|
|
|
|
import ReactLenis from "lenis/react";
|
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
|
|
|
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
|
|
|
|
import HeroCentered from "@/components/sections/hero/HeroCentered";
|
|
|
|
|
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
|
|
|
|
|
import TeamCardEleven from "@/components/sections/team/TeamCardEleven";
|
|
|
|
|
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
|
|
|
|
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
|
|
|
|
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
|
|
|
|
import { Sparkles, Code, Zap } from "lucide-react";
|
|
|
|
|
import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
|
|
|
|
|
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
|
|
|
|
|
import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
|
|
|
|
|
import TeamCardTen from "@/components/sections/team/TeamCardTen";
|
|
|
|
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
|
|
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
|
|
|
|
import { Sparkles } from "lucide-react";
|
|
|
|
|
|
|
|
|
|
export default function BloxlyLandingPage() {
|
|
|
|
|
return (
|
|
|
|
|
<ThemeProvider
|
|
|
|
|
defaultButtonVariant="hover-magnetic"
|
|
|
|
|
defaultButtonVariant="hover-bubble"
|
|
|
|
|
defaultTextAnimation="reveal-blur"
|
|
|
|
|
borderRadius="rounded"
|
|
|
|
|
contentWidth="medium"
|
|
|
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
|
|
|
background="noise"
|
|
|
|
|
cardStyle="glass-depth"
|
|
|
|
|
primaryButtonStyle="primary-glow"
|
|
|
|
|
background="none"
|
|
|
|
|
cardStyle="solid"
|
|
|
|
|
primaryButtonStyle="flat"
|
|
|
|
|
secondaryButtonStyle="solid"
|
|
|
|
|
headingFontWeight="extrabold"
|
|
|
|
|
>
|
|
|
|
|
<ReactLenis root>
|
|
|
|
|
<NavbarLayoutFloatingOverlay
|
|
|
|
|
brandName="Bloxly"
|
|
|
|
|
navItems={[
|
|
|
|
|
{ name: "Capabilities", id: "capabilities" },
|
|
|
|
|
{ name: "Manifesto", id: "manifesto" },
|
|
|
|
|
{ name: "Beta", id: "beta" },
|
|
|
|
|
]}
|
|
|
|
|
button={{ text: "Get Early Access", href: "#beta" }}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<div id="hero">
|
|
|
|
|
<HeroCentered
|
|
|
|
|
title="Build Roblox Experiences at the Speed of AI"
|
|
|
|
|
description="The enterprise-grade coding platform built for Roblox developers. Ship faster, scale smarter, and focus on the mechanics that matter."
|
|
|
|
|
background={{ variant: "sparkles-gradient" }}
|
|
|
|
|
avatars={[
|
|
|
|
|
{ src: "https://avatar.vercel.sh/1", alt: "Dev" },
|
|
|
|
|
{ src: "https://avatar.vercel.sh/2", alt: "Dev" },
|
|
|
|
|
{ src: "https://avatar.vercel.sh/3", alt: "Dev" }
|
|
|
|
|
<div id="nav" data-section="nav">
|
|
|
|
|
<NavbarLayoutFloatingOverlay
|
|
|
|
|
brandName="Bloxly"
|
|
|
|
|
navItems={[
|
|
|
|
|
{ name: "Capabilities", id: "capabilities" },
|
|
|
|
|
{ name: "Manifesto", id: "manifesto" },
|
|
|
|
|
{ name: "Beta Access", id: "beta" },
|
|
|
|
|
]}
|
|
|
|
|
avatarText="10,000+ developers joined"
|
|
|
|
|
buttons={[{ text: "Get Started", href: "#beta" }]}
|
|
|
|
|
marqueeItems={[{ type: 'text-icon', text: 'AI-Native Engine', icon: Sparkles }, { type: 'text-icon', text: 'Roblox Optimized', icon: Code }, { type: 'text-icon', text: 'Instant Deployment', icon: Zap }]}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="hero">
|
|
|
|
|
<HeroSplitTestimonial
|
|
|
|
|
title="The AI Coding Agent for Roblox Studio"
|
|
|
|
|
description="Accelerate your Luau development with Bloxly's precision coding engine. Generate high-performance, network-safe game logic in seconds."
|
|
|
|
|
background={{ variant: "gradient-bars" }}
|
|
|
|
|
testimonials={[
|
|
|
|
|
{
|
|
|
|
|
name: "Alex Dev", handle: "@alexdev", testimonial: "Bloxly cut my development time by 70%. It's a game-changer for Roblox creators.", rating: 5,
|
|
|
|
|
}
|
|
|
|
|
]}
|
|
|
|
|
buttons={[{ text: "Get Beta Access", href: "#beta" }]}
|
|
|
|
|
mediaAnimation="slide-up"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="capabilities">
|
|
|
|
|
<SocialProofOne
|
|
|
|
|
names={["Optimized Luau Engine", "Real-time Debugging", "Asset Streaming API", "Multiplayer Scaling", "Auto-documented Code"]}
|
|
|
|
|
title="Built for Scale"
|
|
|
|
|
description="Everything you need to ship world-class games."
|
|
|
|
|
textboxLayout="default"
|
|
|
|
|
<MetricCardEleven
|
|
|
|
|
title="AI-Native Luau Power"
|
|
|
|
|
description="Built for scale and performance, Bloxly translates your game ideas into clean, efficient Luau scripts."
|
|
|
|
|
metrics={[
|
|
|
|
|
{
|
|
|
|
|
id: "1", value: "10x", title: "Development Velocity", description: "Automated boilerplate and real-time syntax correction.", imageSrc: "https://images.unsplash.com/photo-1677442136019-21780ecad995?auto=format&fit=crop&q=80&w=800"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: "2", value: "Zero", title: "Technical Debt", description: "Memory-optimized, clean, and modular code structures.", imageSrc: "https://images.unsplash.com/photo-1633356122544-f134324a6cee?auto=format&fit=crop&q=80&w=800"
|
|
|
|
|
}
|
|
|
|
|
]}
|
|
|
|
|
animationType="slide-up"
|
|
|
|
|
textboxLayout="split-actions"
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="features">
|
|
|
|
|
<FeatureCardTwentySeven
|
|
|
|
|
title="What Bloxly Does"
|
|
|
|
|
description="Automate the mundane and amplify your creativity with our suite of AI-driven dev tools."
|
|
|
|
|
<FeatureCardSeven
|
|
|
|
|
title="Precision Engine Tools"
|
|
|
|
|
description="Automate the mundane, focus on the fun. Bloxly handles your backend complexity."
|
|
|
|
|
animationType="slide-up"
|
|
|
|
|
textboxLayout="default"
|
|
|
|
|
useInvertedBackground={true}
|
|
|
|
|
features={[
|
|
|
|
|
{ id: "f1", title: "Code Acceleration", descriptions: ["Context-aware Luau completion", "Auto-generated boilerplate code", "AI-refactored scripts"] },
|
|
|
|
|
{ id: "f2", title: "Visual Mechanics", descriptions: ["Drag-and-drop logic nodes", "Auto-layout UI generation", "Live-preview world states"] },
|
|
|
|
|
{ id: "f3", title: "Optimization Engine", descriptions: ["Automated bottleneck detection", "Memory footprint reduction", "Network throttling smart-fixes"] }
|
|
|
|
|
{ title: "Game Logic Automation", description: "Instant creation of complex mechanics.", imageSrc: "https://images.unsplash.com/photo-1550745165-9bc0b252726f?auto=format&fit=crop&q=80&w=600" },
|
|
|
|
|
{ title: "Smart UI Construction", description: "Responsive, high-fidelity UI layouts in seconds.", imageSrc: "https://images.unsplash.com/photo-1551033406-611cf9a28f67?auto=format&fit=crop&q=80&w=600" },
|
|
|
|
|
{ title: "Deep Optimization", description: "Automatic detection of bottlenecked Luau code.", imageSrc: "https://images.unsplash.com/photo-1587620962725-abab7fe55159?auto=format&fit=crop&q=80&w=600" }
|
|
|
|
|
]}
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="manifesto">
|
|
|
|
|
<TeamCardEleven
|
|
|
|
|
title="Manifesto: Own What You Build"
|
|
|
|
|
description="Powered by MultiversX, Bloxly ensures your IP stays yours. Your assets, your code, your future."
|
|
|
|
|
textboxLayout="split"
|
|
|
|
|
animationType="slide-up"
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
groups={[
|
|
|
|
|
{
|
|
|
|
|
id: "g1", groupTitle: "The Bloxly Standard", members: [{ id: "m1", title: "On-Chain Security", subtitle: "Verification", detail: "Every asset is anchored in trust with MultiversX integration." }]
|
|
|
|
|
}
|
|
|
|
|
]}
|
|
|
|
|
<div id="how-it-works">
|
|
|
|
|
<TeamCardTen
|
|
|
|
|
title="Four Steps to Success"
|
|
|
|
|
tag="Workflow"
|
|
|
|
|
membersAnimation="slide-up"
|
|
|
|
|
memberVariant="card"
|
|
|
|
|
members={[
|
|
|
|
|
{ id: "1", name: "Describe your Vision" },
|
|
|
|
|
{ id: "2", name: "Generate AI Logic" },
|
|
|
|
|
{ id: "3", name: "Refine & Debug" },
|
|
|
|
|
{ id: "4", name: "Ship Experience" }
|
|
|
|
|
]}
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="beta">
|
|
|
|
|
<ContactCenter
|
|
|
|
|
tag="Join the Beta"
|
|
|
|
|
title="Shape the Future of Roblox Development"
|
|
|
|
|
description="Secure your spot in the Bloxly Beta program and get exclusive access to our AI tools before the public launch."
|
|
|
|
|
background={{ variant: "rotated-rays-animated" }}
|
|
|
|
|
buttonText="Join Now"
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
/>
|
|
|
|
|
<ContactCTA
|
|
|
|
|
tag="Get Early Access"
|
|
|
|
|
tagIcon={Sparkles}
|
|
|
|
|
title="Join the Builder Revolution"
|
|
|
|
|
description="Secure your spot in the Bloxly beta program and start shipping better games faster."
|
|
|
|
|
buttons={[{ text: "Request Access" }]}
|
|
|
|
|
background={{ variant: "sparkles-gradient" }}
|
|
|
|
|
useInvertedBackground={false}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="footer">
|
|
|
|
|
<FooterBaseReveal
|
|
|
|
|
logoText="Bloxly"
|
|
|
|
|
columns={[{ title: "Product", items: [{ label: "Features", href: "#" }, { label: "Security", href: "#" }] }, { title: "Company", items: [{ label: "About", href: "#" }, { label: "Careers", href: "#" }] }]}
|
|
|
|
|
copyrightText="© 2024 Bloxly. All rights reserved."
|
|
|
|
|
<FooterSimple
|
|
|
|
|
columns={[
|
|
|
|
|
{ title: "Bloxly", items: [{ label: "Documentation" }, { label: "API Reference" }] },
|
|
|
|
|
{ title: "Community", items: [{ label: "Discord" }, { label: "Terms of Service" }] }
|
|
|
|
|
]}
|
|
|
|
|
bottomLeftText="© 2024 Bloxly. All rights reserved."
|
|
|
|
|
bottomRightText="Built for Roblox creators."
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</ReactLenis>
|
|
|
|
|
|
