Merge version_2_1781616229221 into main #1

Merged
bender merged 1 commits from version_2_1781616229221 into main 2026-06-16 13:26:33 +00:00
9 changed files with 382 additions and 205 deletions

View File

@@ -1,216 +1,35 @@
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
// AUTO-GENERATED shell by per-section-migrate.
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
// files directly. Non-block content (wrappers, non-inlinable sections) is
// preserved inline; extracted section blocks become <XSection/> refs.
export default function HomePage() {
import React from 'react';
import HeroSection from './HomePage/sections/Hero';
import AboutSection from './HomePage/sections/About';
import ServicesSection from './HomePage/sections/Services';
import PortfolioSection from './HomePage/sections/Portfolio';
import MetricsSection from './HomePage/sections/Metrics';
import TestimonialsSection from './HomePage/sections/Testimonials';
import FaqSection from './HomePage/sections/Faq';
import ContactSection from './HomePage/sections/Contact';export default function HomePage(): React.JSX.Element {
return (
<>
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroCenteredLogos
avatarsSrc={[
"http://img.b2bpic.net/free-photo/closeup-happy-middle-aged-business-leader_1262-4823.jpg",
"http://img.b2bpic.net/free-photo/close-up-successful-entrepreneur_1098-3855.jpg",
"http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-with-ear-bandage-art-studio_23-2149705903.jpg",
"http://img.b2bpic.net/free-photo/successful-businessman-imagines-great-career_1163-5478.jpg",
]}
avatarText="Trusted by 50+ Creative Brands"
title="Breathing Life into Digital Concepts"
description="We craft stunning 3D animations and visual experiences that turn your marketing message into an unforgettable motion masterpiece."
primaryButton={{
text: "See Portfolio",
href: "#portfolio",
}}
secondaryButton={{
text: "Get a Quote",
href: "#contact",
}}
names={[
"Studio A",
"Studio B",
"Studio C",
"Studio D",
"Studio E",
]}
imageSrc="http://img.b2bpic.net/free-photo/abstract-dark-background-with-purple-lines-generative-ai_169016-30668.jpg"
/>
</SectionErrorBoundary>
</div>
<>
<HeroSection />
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutTestimonial
tag="Our Philosophy"
quote="Motion isn't just about movement; it's about storytelling that captivates and converts in the digital space."
author="Pami3D Founders"
role="Motion Direction Team"
imageSrc="http://img.b2bpic.net/free-photo/modern-comfortable-workplace-home-there-are-computer-laptop-table_613910-13270.jpg"
/>
</SectionErrorBoundary>
</div>
<AboutSection />
<div id="services" data-section="services">
<SectionErrorBoundary name="services">
<FeaturesMediaCards
tag="Core Services"
title="3D Motion Specializations"
description="Precision animation delivered with artistic flair."
items={[
{
title: "Product Animation",
description: "High-fidelity rendering of your products.",
imageSrc: "http://img.b2bpic.net/free-photo/design-plan_53876-176743.jpg",
},
{
title: "Motion Graphics",
description: "Dynamic typography and branding assets.",
imageSrc: "https://storage.googleapis.com/webild/default/no-image.jpg?id=sv56m7",
},
{
title: "Visual Storytelling",
description: "Compelling narratives for every scene.",
imageSrc: "http://img.b2bpic.net/free-vector/gradient-blurred-y2k-elements-collection_52683-150985.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
<ServicesSection />
<div id="portfolio" data-section="portfolio">
<SectionErrorBoundary name="portfolio">
<FeaturesImageBento
tag="Showcase"
title="Our Best Work"
description="A curated bento display of our latest 3D renders and motion graphics projects."
items={[
{
title: "Tech UI Animation",
description: "UX focused motion.",
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-modern-abstract-sphere-art_23-2150937489.jpg",
},
{
title: "Character Rig",
description: "Articulated character design.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendered-design-elements-composition_23-2148996778.jpg",
},
{
title: "Atmospheric Render",
description: "Lighting and environment.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-view-blooming-flower_23-2150472239.jpg",
},
{
title: "Dynamic Product View",
description: "360-degree render.",
imageSrc: "http://img.b2bpic.net/free-photo/still-life-small-decorative-objects_23-2149865474.jpg",
},
{
title: "Abstract Motion",
description: "Conceptual art.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-character-emerging-from-smartphone_23-2151336616.jpg",
},
{
title: "Brand Assets",
description: "Logo animation.",
imageSrc: "http://img.b2bpic.net/free-photo/abstract-art-made-from-3d-geometric-shapes_23-2150829291.jpg",
},
{
title: "Cinematic Trailer",
description: "Full production.",
imageSrc: "http://img.b2bpic.net/free-photo/scene-with-minimal-podium-with-stairs_23-2149269986.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
<PortfolioSection />
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsSimpleCards
tag="Impact"
title="Measuring Success"
description="Our work drives tangible growth for clients."
metrics={[
{
value: "120+",
description: "Projects Completed",
},
{
value: "45+",
description: "Global Clients",
},
{
value: "98%",
description: "Retention Rate",
},
]}
/>
</SectionErrorBoundary>
</div>
<MetricsSection />
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialTrustCard
quote="Pami3D revolutionized how we present our products to the global market. Absolutely professional."
rating={5}
author="Sarah Miller, VP Marketing"
avatars={[
{
name: "Sarah",
imageSrc: "http://img.b2bpic.net/free-photo/handsome-confident-man_1098-18449.jpg",
},
{
name: "Mike",
imageSrc: "http://img.b2bpic.net/free-photo/confident-handsome-middle-aged-entrepreneur_1262-4871.jpg",
},
{
name: "Jen",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-working-business-with-computer_482257-20185.jpg",
},
{
name: "Dave",
imageSrc: "http://img.b2bpic.net/free-photo/smart-pensive-redhead-hipster-with-full-beard-glasses-dressed-casual-clothes-poses-with-hand-chin-studio-isolated-dark-background_613910-20091.jpg",
},
{
name: "Alex",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-confident-business-leader_1262-4808.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
<TestimonialsSection />
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqTwoColumn
tag="Info"
title="Frequently Asked"
description="Everything you need to know about working with us."
items={[
{
question: "What is the turnaround time?",
answer: "Projects range from 2 to 6 weeks depending on complexity.",
},
{
question: "Do you offer revision rounds?",
answer: "Yes, we include two rounds of feedback as standard.",
},
{
question: "Can you work with our existing brand guidelines?",
answer: "Absolutely, we pride ourselves on seamless brand integration.",
},
{
question: "What formats do you deliver?",
answer: "We provide master files in 4K, MP4, and project source files.",
},
]}
/>
</SectionErrorBoundary>
</div>
<FaqSection />
<ContactSection />
</>
);
}

View File

@@ -0,0 +1,22 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "about" section.
import React from 'react';
import AboutTestimonial from '@/components/sections/about/AboutTestimonial';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function AboutSection(): React.JSX.Element {
return (
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutTestimonial
tag="Our Philosophy"
quote="Motion isn't just about movement; it's about storytelling that captivates and converts in the digital space."
author="Pami3D Founders"
role="Motion Direction Team"
imageSrc="http://img.b2bpic.net/free-photo/modern-comfortable-workplace-home-there-are-computer-laptop-table_613910-13270.jpg"
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,89 @@
import { useState } from 'react';
import { motion } from 'motion/react';
import Button from '@/components/ui/Button';
import Input from '@/components/ui/Input';
import Textarea from '@/components/ui/Textarea';
import Label from '@/components/ui/Label';
import TextAnimation from '@/components/ui/TextAnimation';
import ScrollReveal from '@/components/ui/ScrollReveal';
import ImageOrVideo from '@/components/ui/ImageOrVideo';
import Tag from '@/components/ui/Tag';
export default function ContactSection() {
return (
<section className="relative w-full py-24 bg-background" id="contact" data-webild-section="contact">
<div className="w-content-width mx-auto px-6">
<div className="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
<ScrollReveal variant="slide-up">
<div className="space-y-6">
<Tag text="Contact Us" />
<TextAnimation
text="Let's Create Something Amazing"
variant="slide-up"
tag="h2"
className="text-4xl md:text-5xl font-bold text-foreground"
gradientText={false}
/>
<p className="text-lg text-muted-foreground">
Ready to bring your vision to life? Fill out the form below and our team will get back to you within 24 hours to discuss your 3D animation project.
</p>
<form className="space-y-4 mt-8" onSubmit={(e) => e.preventDefault()}>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="space-y-2">
<Label htmlFor="name" className="text-foreground">Your Name</Label>
<Input
id="name"
placeholder="John Doe"
required
className="bg-card border-border text-foreground"
/>
</div>
<div className="space-y-2">
<Label htmlFor="email" className="text-foreground">Your Email</Label>
<Input
id="email"
type="email"
placeholder="john@example.com"
required
className="bg-card border-border text-foreground"
/>
</div>
</div>
<div className="space-y-2">
<Label htmlFor="company" className="text-foreground">Company Name</Label>
<Input
id="company"
placeholder="Your Company"
className="bg-card border-border text-foreground"
/>
</div>
<div className="space-y-2">
<Label htmlFor="message" className="text-foreground">Message</Label>
<Textarea
id="message"
placeholder="Tell us about your project..."
rows={4}
required
className="bg-card border-border text-foreground"
/>
</div>
<Button text="Send Message" variant="primary" className="w-full mt-4" />
</form>
</div>
</ScrollReveal>
<ScrollReveal variant="fade-blur" delay={0.2}>
<div className="relative h-[600px] rounded-theme overflow-hidden">
<ImageOrVideo
imageSrc="http://img.b2bpic.net/free-photo/abstract-dark-background-with-purple-lines-generative-ai_169016-30668.jpg"
className="w-full h-full object-cover"
/>
<div className="absolute inset-0 bg-gradient-to-t from-background/80 to-transparent pointer-events-none" />
</div>
</ScrollReveal>
</div>
</div>
</section>
);
}

View File

@@ -0,0 +1,38 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "faq" section.
import React from 'react';
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function FaqSection(): React.JSX.Element {
return (
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqTwoColumn
tag="Info"
title="Frequently Asked"
description="Everything you need to know about working with us."
items={[
{
question: "What is the turnaround time?",
answer: "Projects range from 2 to 6 weeks depending on complexity.",
},
{
question: "Do you offer revision rounds?",
answer: "Yes, we include two rounds of feedback as standard.",
},
{
question: "Can you work with our existing brand guidelines?",
answer: "Absolutely, we pride ourselves on seamless brand integration.",
},
{
question: "What formats do you deliver?",
answer: "We provide master files in 4K, MP4, and project source files.",
},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,39 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "hero" section.
import React from 'react';
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function HeroSection(): React.JSX.Element {
return (
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroCenteredLogos
avatarsSrc={[
"http://img.b2bpic.net/free-photo/closeup-happy-middle-aged-business-leader_1262-4823.jpg",
"http://img.b2bpic.net/free-photo/close-up-successful-entrepreneur_1098-3855.jpg",
"http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-with-ear-bandage-art-studio_23-2149705903.jpg",
"http://img.b2bpic.net/free-photo/successful-businessman-imagines-great-career_1163-5478.jpg",
]}
avatarText="Trusted by 50+ Creative Brands"
title="Breathing Life into Digital Concepts"
description="We craft stunning 3D animations and visual experiences that turn your marketing message into an unforgettable motion masterpiece."
primaryButton={{"text":"Start Your Project","href":"#contact"}}
secondaryButton={{
text: "Get a Quote",
href: "#contact",
}}
names={[
"Studio A",
"Studio B",
"Studio C",
"Studio D",
"Studio E",
]}
imageSrc="http://img.b2bpic.net/free-photo/abstract-dark-background-with-purple-lines-generative-ai_169016-30668.jpg"
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,34 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "metrics" section.
import React from 'react';
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function MetricsSection(): React.JSX.Element {
return (
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsSimpleCards
tag="Impact"
title="Measuring Success"
description="Our work drives tangible growth for clients."
metrics={[
{
value: "120+",
description: "Projects Completed",
},
{
value: "45+",
description: "Global Clients",
},
{
value: "98%",
description: "Retention Rate",
},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,57 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "portfolio" section.
import React from 'react';
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function PortfolioSection(): React.JSX.Element {
return (
<div id="portfolio" data-section="portfolio">
<SectionErrorBoundary name="portfolio">
<FeaturesImageBento
tag="Showcase"
title="Our Best Work"
description="A curated bento display of our latest 3D renders and motion graphics projects."
items={[
{
title: "Tech UI Animation",
description: "UX focused motion.",
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-modern-abstract-sphere-art_23-2150937489.jpg",
},
{
title: "Character Rig",
description: "Articulated character design.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendered-design-elements-composition_23-2148996778.jpg",
},
{
title: "Atmospheric Render",
description: "Lighting and environment.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-view-blooming-flower_23-2150472239.jpg",
},
{
title: "Dynamic Product View",
description: "360-degree render.",
imageSrc: "http://img.b2bpic.net/free-photo/still-life-small-decorative-objects_23-2149865474.jpg",
},
{
title: "Abstract Motion",
description: "Conceptual art.",
imageSrc: "http://img.b2bpic.net/free-photo/3d-character-emerging-from-smartphone_23-2151336616.jpg",
},
{
title: "Brand Assets",
description: "Logo animation.",
imageSrc: "http://img.b2bpic.net/free-photo/abstract-art-made-from-3d-geometric-shapes_23-2150829291.jpg",
},
{
title: "Cinematic Trailer",
description: "Full production.",
imageSrc: "http://img.b2bpic.net/free-photo/scene-with-minimal-podium-with-stairs_23-2149269986.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,37 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "services" section.
import React from 'react';
import FeaturesMediaCards from '@/components/sections/features/FeaturesMediaCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ServicesSection(): React.JSX.Element {
return (
<div id="services" data-section="services">
<SectionErrorBoundary name="services">
<FeaturesMediaCards
tag="Core Services"
title="3D Motion Specializations"
description="Precision animation delivered with artistic flair."
items={[
{
title: "Product Animation",
description: "High-fidelity rendering of your products.",
imageSrc: "http://img.b2bpic.net/free-photo/design-plan_53876-176743.jpg",
},
{
title: "Motion Graphics",
description: "Dynamic typography and branding assets.",
imageSrc: "https://storage.googleapis.com/webild/default/no-image.jpg?id=sv56m7",
},
{
title: "Visual Storytelling",
description: "Compelling narratives for every scene.",
imageSrc: "http://img.b2bpic.net/free-vector/gradient-blurred-y2k-elements-collection_52683-150985.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,42 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "testimonials" section.
import React from 'react';
import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function TestimonialsSection(): React.JSX.Element {
return (
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialTrustCard
quote="Pami3D revolutionized how we present our products to the global market. Absolutely professional."
rating={5}
author="Sarah Miller, VP Marketing"
avatars={[
{
name: "Sarah",
imageSrc: "http://img.b2bpic.net/free-photo/handsome-confident-man_1098-18449.jpg",
},
{
name: "Mike",
imageSrc: "http://img.b2bpic.net/free-photo/confident-handsome-middle-aged-entrepreneur_1262-4871.jpg",
},
{
name: "Jen",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-working-business-with-computer_482257-20185.jpg",
},
{
name: "Dave",
imageSrc: "http://img.b2bpic.net/free-photo/smart-pensive-redhead-hipster-with-full-beard-glasses-dressed-casual-clothes-poses-with-hand-chin-studio-isolated-dark-background_613910-20091.jpg",
},
{
name: "Alex",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-confident-business-leader_1262-4808.jpg",
},
]}
/>
</SectionErrorBoundary>
</div>
);
}