Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 91b11feb56 | |||
| 1af1184471 | |||
| 8a846af3f7 | |||
| 9ded5f8988 | |||
| 9671403376 | |||
| 5c73305239 | |||
| e771f2868c |
146
src/app/page.tsx
146
src/app/page.tsx
@@ -6,7 +6,7 @@ import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
|
||||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||||
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
@@ -32,62 +32,41 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "home"},
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Projects", id: "projects"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Projects", id: "projects" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="3D STUDIO"
|
||||
button={{ text: "Get Started" }}
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroOverlayTestimonial
|
||||
title="Crafting Immersive 3D Worlds"
|
||||
description="We specialize in high-end digital experiences, bringing creative visions to life with cutting-edge 3D animation and design."
|
||||
<HeroSplitTestimonial
|
||||
title="Digital Alter Ego"
|
||||
description="Meet your 3D-animated representation—a high-fidelity digital persona built to bridge the gap between human creativity and virtual performance."
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qbn5ys&_wi=2"
|
||||
imageAlt="3D animated character representing me"
|
||||
imagePosition="right"
|
||||
testimonials={[
|
||||
{
|
||||
name: "Alex Riv", handle: "@alex", testimonial: "Amazing 3D work, exceeded expectations.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qbn5ys&_wi=1", imageAlt: "futuristic 3D background"},
|
||||
name: "Alex Riv", handle: "@alex", testimonial: "The character animation is breathtakingly real.", rating: 5
|
||||
},
|
||||
{
|
||||
name: "Sam Kim", handle: "@sam", testimonial: "The animation fluidity is incredible.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kt5pfd&_wi=1", imageAlt: "futuristic 3D background"},
|
||||
{
|
||||
name: "Jana Lee", handle: "@jana", testimonial: "Top-tier creative partner for our brand.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=g1ypmf&_wi=1", imageAlt: "futuristic 3D background"},
|
||||
{
|
||||
name: "Mark Doe", handle: "@mark", testimonial: "Brought our concepts to life perfectly.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7f9f3d&_wi=1", imageAlt: "futuristic 3D background"},
|
||||
{
|
||||
name: "Zoe Fox", handle: "@zoe", testimonial: "Stunning visuals and professional speed.", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=94zbjw&_wi=1", imageAlt: "futuristic 3D background"},
|
||||
name: "Sam Kim", handle: "@sam", testimonial: "Finally, a digital persona that feels authentic.", rating: 5
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qbn5ys&_wi=2"
|
||||
imageAlt="futuristic 3D background"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=g1ypmf", alt: "professional client portrait"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7f9f3d", alt: "tech innovator portrait"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=94zbjw", alt: "creative lead portrait"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3je9qy", alt: "digital architect portrait"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ifxdjh", alt: "studio director portrait"},
|
||||
buttons={[
|
||||
{ text: "Learn More", href: "#about" },
|
||||
{ text: "Book Consultation", href: "#contact" }
|
||||
]}
|
||||
avatarText="Trusted by industry leaders"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Studio"
|
||||
title="Pushing Boundaries"
|
||||
description="Founded by creative technologists who live at the intersection of art and code, our studio is dedicated to crafting the future of digital expression."
|
||||
@@ -96,6 +75,7 @@ export default function LandingPage() {
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=kt5pfd&_wi=2"
|
||||
imageAlt="creative designer workspace"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -106,11 +86,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1", title: "3D Modeling", subtitle: "Precision modeling for any project.", category: "Service", value: "100%"},
|
||||
id: "f1", title: "3D Modeling", subtitle: "Precision modeling for any project.", category: "Service", value: "100%"
|
||||
},
|
||||
{
|
||||
id: "f2", title: "Motion Graphics", subtitle: "Fluid and reactive animations.", category: "Service", value: "100%"},
|
||||
id: "f2", title: "Motion Graphics", subtitle: "Fluid and reactive animations.", category: "Service", value: "100%"
|
||||
},
|
||||
{
|
||||
id: "f3", title: "Environment Design", subtitle: "Immersive and cinematic worlds.", category: "Service", value: "100%"},
|
||||
id: "f3", title: "Environment Design", subtitle: "Immersive and cinematic worlds.", category: "Service", value: "100%"
|
||||
},
|
||||
]}
|
||||
title="Creative Services"
|
||||
description="Our expertise spans across multiple disciplines in the 3D space."
|
||||
@@ -123,12 +106,9 @@ export default function LandingPage() {
|
||||
title="Studio Impact"
|
||||
tag="Performance"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "500+", description: "Projects Completed"},
|
||||
{
|
||||
id: "m2", value: "45", description: "Global Awards"},
|
||||
{
|
||||
id: "m3", value: "15+", description: "Years Combined"},
|
||||
{ id: "m1", value: "500+", description: "Projects Completed" },
|
||||
{ id: "m2", value: "45", description: "Global Awards" },
|
||||
{ id: "m3", value: "15+", description: "Years Combined" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -142,17 +122,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Neon Genesis", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qnu60r", imageAlt: "3D character design"},
|
||||
id: "p1", name: "Neon Genesis", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qnu60r", imageAlt: "3D character design"
|
||||
},
|
||||
{
|
||||
id: "p2", name: "Void Structure", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z9a5jp", imageAlt: "architectural 3D render"},
|
||||
id: "p2", name: "Void Structure", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=z9a5jp", imageAlt: "architectural 3D render"
|
||||
},
|
||||
{
|
||||
id: "p3", name: "Fluidity V2", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8wc7f0", imageAlt: "fluid 3D visualization"},
|
||||
{
|
||||
id: "p4", name: "Velocity Alpha", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=pq0pck", imageAlt: "concept car 3D abstract"},
|
||||
{
|
||||
id: "p5", name: "Ethereal Sculpt", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=x7pd20", imageAlt: "digital 3D sculpture"},
|
||||
{
|
||||
id: "p6", name: "Mech Engine", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tpxugs", imageAlt: "mechanical abstract 3D"},
|
||||
id: "p3", name: "Fluidity V2", price: "Art", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8wc7f0", imageAlt: "fluid 3D visualization"
|
||||
},
|
||||
]}
|
||||
title="Recent Projects"
|
||||
description="A curated collection of our most daring digital commissions."
|
||||
@@ -167,20 +144,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Alex Riv", role: "Creative Lead", company: "DesignLab", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=g1ypmf&_wi=2", imageAlt: "professional client portrait"},
|
||||
id: "t1", name: "Alex Riv", role: "Creative Lead", company: "DesignLab", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=g1ypmf&_wi=2", imageAlt: "professional client portrait"
|
||||
},
|
||||
{
|
||||
id: "t2", name: "Sam Kim", role: "CTO", company: "Innovate", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7f9f3d&_wi=2", imageAlt: "tech innovator portrait"},
|
||||
{
|
||||
id: "t3", name: "Jana Lee", role: "Director", company: "GrowthCo", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=94zbjw&_wi=2", imageAlt: "creative lead portrait"},
|
||||
{
|
||||
id: "t4", name: "Mark Doe", role: "PM", company: "Future", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3je9qy", imageAlt: "digital architect portrait"},
|
||||
{
|
||||
id: "t5", name: "Zoe Fox", role: "Founder", company: "Vision", rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ifxdjh", imageAlt: "studio director portrait"},
|
||||
id: "t2", name: "Sam Kim", role: "CTO", company: "Innovate", rating: 5, imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7f9f3d&_wi=2", imageAlt: "tech innovator portrait"
|
||||
},
|
||||
]}
|
||||
title="Client Feedback"
|
||||
description="Hear what our partners say about our collaborative process."
|
||||
@@ -192,12 +160,8 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1", title: "How do you start?", content: "Discovery, brainstorming, and sketching."},
|
||||
{
|
||||
id: "q2", title: "What tools are used?", content: "Industry-standard 3D suites like Blender, Cinema 4D."},
|
||||
{
|
||||
id: "q3", title: "Timeline?", content: "Varies by scope, usually 2-8 weeks."},
|
||||
{ id: "q1", title: "How do you start?", content: "Discovery, brainstorming, and sketching." },
|
||||
{ id: "q2", title: "What tools are used?", content: "Industry-standard 3D suites like Blender, Cinema 4D." },
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Get answers to your inquiries about our studio and process."
|
||||
@@ -208,15 +172,11 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient"}}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Let's Connect"
|
||||
title="Ready to Build Together?"
|
||||
description="Get in touch today to start your next 3D project with us."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us", href: "#"},
|
||||
]}
|
||||
buttons={[{ text: "Contact Us", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -224,19 +184,15 @@ export default function LandingPage() {
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About", href: "#about"},
|
||||
{
|
||||
label: "Projects", href: "#projects"},
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Projects", href: "#projects" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy", href: "#"},
|
||||
{
|
||||
label: "Terms", href: "#"},
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy", href: "#" },
|
||||
{ label: "Terms", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -246,4 +202,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #030128;
|
||||
--card: #241f48;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #ffffff;
|
||||
--primary-cta-text: #030128;
|
||||
--secondary-cta: #131136;
|
||||
--secondary-cta-text: #d5d4f6;
|
||||
--accent: #44358a;
|
||||
--background-accent: #b597fe;
|
||||
--background: #050012;
|
||||
--card: #040121;
|
||||
--foreground: #f0e6ff;
|
||||
--primary-cta: #c89bff;
|
||||
--primary-cta-text: #050012;
|
||||
--secondary-cta: #1d123b;
|
||||
--secondary-cta-text: #f0e6ff;
|
||||
--accent: #684f7b;
|
||||
--background-accent: #65417c;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user