Merge version_1 into main #1
316
src/app/page.tsx
316
src/app/page.tsx
@@ -33,33 +33,19 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#home",
|
||||
},
|
||||
name: "Home", id: "#home"},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
name: "About", id: "#about"},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
name: "Services", id: "#services"},
|
||||
{
|
||||
name: "Portfolio",
|
||||
id: "#portfolio",
|
||||
},
|
||||
name: "Portfolio", id: "#portfolio"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "#testimonials"},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "#faq",
|
||||
},
|
||||
name: "FAQ", id: "#faq"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
name: "Contact", id: "#contact"},
|
||||
]}
|
||||
logoSrc="http://img.b2bpic.net/free-vector/photography-emblems-set_1284-6539.jpg"
|
||||
logoAlt="ZenithX Logo"
|
||||
@@ -67,29 +53,22 @@ export default function LandingPage() {
|
||||
bottomLeftText="Creative Vision"
|
||||
bottomRightText="connect@zenithx.com"
|
||||
button={{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Get Started", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "downward-rays-animated",
|
||||
}}
|
||||
variant: "downward-rays-animated"}}
|
||||
title="Creating edits and animations that viewers remember"
|
||||
description="Young creator focused on cinematic editing, animations, and engaging content designed to leave an impact. Three years of experience delivering polished, energetic visuals that engage audiences and elevate storytelling."
|
||||
tagAnimation="opacity"
|
||||
buttons={[
|
||||
{
|
||||
text: "Watch Work",
|
||||
href: "#portfolio",
|
||||
},
|
||||
text: "Watch Work", href: "#portfolio"},
|
||||
{
|
||||
text: "Join Discord",
|
||||
href: "https://discord.com/zenithx",
|
||||
},
|
||||
text: "Join Discord", href: "https://discord.com/zenithx"},
|
||||
]}
|
||||
buttonAnimation="opacity"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/collage-about-movie-time-with-man-megaphone_23-2149946319.jpg"
|
||||
@@ -116,45 +95,21 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "cinematic-editing",
|
||||
title: "Cinematic Editing",
|
||||
tags: [
|
||||
"Film Grade",
|
||||
"Dynamic Cuts",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139399.jpg",
|
||||
imageAlt: "Abstract representation of cinematic film editing",
|
||||
},
|
||||
id: "cinematic-editing", title: "Cinematic Editing", tags: [
|
||||
"Film Grade", "Dynamic Cuts"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139399.jpg", imageAlt: "Abstract representation of cinematic film editing"},
|
||||
{
|
||||
id: "motion-animation",
|
||||
title: "Motion Graphics & Animation",
|
||||
tags: [
|
||||
"2D/3D",
|
||||
"Visual FX",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-with-colorful-powder_23-2149339802.jpg",
|
||||
imageAlt: "Vibrant 3D animated abstract shape",
|
||||
},
|
||||
id: "motion-animation", title: "Motion Graphics & Animation", tags: [
|
||||
"2D/3D", "Visual FX"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-with-colorful-powder_23-2149339802.jpg", imageAlt: "Vibrant 3D animated abstract shape"},
|
||||
{
|
||||
id: "sound-design",
|
||||
title: "Immersive Sound Design",
|
||||
tags: [
|
||||
"Audio Mix",
|
||||
"SFX",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-network-communications-background-with-flowing-waves_1048-14049.jpg",
|
||||
imageAlt: "Visual representation of sound waves and audio effects",
|
||||
},
|
||||
id: "sound-design", title: "Immersive Sound Design", tags: [
|
||||
"Audio Mix", "SFX"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-network-communications-background-with-flowing-waves_1048-14049.jpg", imageAlt: "Visual representation of sound waves and audio effects"},
|
||||
{
|
||||
id: "color-grading",
|
||||
title: "Professional Color Grading",
|
||||
tags: [
|
||||
"Film Look",
|
||||
"Atmospheric",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-woman-with-fluorescent-make-up_23-2148410080.jpg",
|
||||
imageAlt: "Before and after comparison of cinematic color grading",
|
||||
},
|
||||
id: "color-grading", title: "Professional Color Grading", tags: [
|
||||
"Film Look", "Atmospheric"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-woman-with-fluorescent-make-up_23-2148410080.jpg", imageAlt: "Before and after comparison of cinematic color grading"},
|
||||
]}
|
||||
title="Unleash Your Content's Potential"
|
||||
description="From dynamic motion graphics to precise sound design, my services cover every aspect of post-production to deliver truly unforgettable content."
|
||||
@@ -166,55 +121,20 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
animationType="opacity"
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Gaming Cinematic Trailer",
|
||||
price: "Project 01",
|
||||
variant: "Motion Graphics",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/focused-man-rgb-lights-lit-living-room-playing-videogames_482257-116287.jpg",
|
||||
imageAlt: "Dynamic gaming cinematic trailer thumbnail",
|
||||
},
|
||||
id: "p1", name: "Gaming Cinematic Trailer", price: "Project 01", variant: "Motion Graphics", imageSrc: "http://img.b2bpic.net/free-photo/focused-man-rgb-lights-lit-living-room-playing-videogames_482257-116287.jpg", imageAlt: "Dynamic gaming cinematic trailer thumbnail"},
|
||||
{
|
||||
id: "p2",
|
||||
name: "YouTube Intro Animation",
|
||||
price: "Project 02",
|
||||
variant: "Brand Identity",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lights-drawing-long-exposure-technique_53876-13996.jpg",
|
||||
imageAlt: "Sleek YouTube intro animation thumbnail",
|
||||
},
|
||||
id: "p2", name: "YouTube Intro Animation", price: "Project 02", variant: "Brand Identity", imageSrc: "http://img.b2bpic.net/free-photo/lights-drawing-long-exposure-technique_53876-13996.jpg", imageAlt: "Sleek YouTube intro animation thumbnail"},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Social Media Promo",
|
||||
price: "Project 03",
|
||||
variant: "Short-Form Content",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-outside-with-quote-who-sleeps_23-2148283861.jpg",
|
||||
imageAlt: "Social media promotional video thumbnail",
|
||||
},
|
||||
id: "p3", name: "Social Media Promo", price: "Project 03", variant: "Short-Form Content", imageSrc: "http://img.b2bpic.net/free-photo/man-outside-with-quote-who-sleeps_23-2148283861.jpg", imageAlt: "Social media promotional video thumbnail"},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Corporate Brand Video",
|
||||
price: "Project 04",
|
||||
variant: "Visual Storytelling",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-smartphones-inside-geometric-neon-frame_187299-46537.jpg",
|
||||
imageAlt: "Corporate brand video segment thumbnail",
|
||||
},
|
||||
id: "p4", name: "Corporate Brand Video", price: "Project 04", variant: "Visual Storytelling", imageSrc: "http://img.b2bpic.net/free-photo/two-smartphones-inside-geometric-neon-frame_187299-46537.jpg", imageAlt: "Corporate brand video segment thumbnail"},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Music Video Edit",
|
||||
price: "Project 05",
|
||||
variant: "Artistic Vision",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-red-background-vertical-lines-strips_1258-108652.jpg",
|
||||
imageAlt: "Music video-style edit thumbnail",
|
||||
},
|
||||
id: "p5", name: "Music Video Edit", price: "Project 05", variant: "Artistic Vision", imageSrc: "http://img.b2bpic.net/free-photo/abstract-red-background-vertical-lines-strips_1258-108652.jpg", imageAlt: "Music video-style edit thumbnail"},
|
||||
{
|
||||
id: "p6",
|
||||
name: "VFX Breakdown Reel",
|
||||
price: "Project 06",
|
||||
variant: "Special Effects",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-painting-horrible-creatures-with-genetic-mutations-ruined-laboratory_456031-97.jpg",
|
||||
imageAlt: "Complex visual effects (VFX) breakdown thumbnail",
|
||||
},
|
||||
id: "p6", name: "VFX Breakdown Reel", price: "Project 06", variant: "Special Effects", imageSrc: "http://img.b2bpic.net/free-photo/digital-painting-horrible-creatures-with-genetic-mutations-ruined-laboratory_456031-97.jpg", imageAlt: "Complex visual effects (VFX) breakdown thumbnail"},
|
||||
]}
|
||||
title="Our Latest Creative Works"
|
||||
description="Explore a selection of high-impact cinematic edits and animations crafted for a diverse range of clients and platforms."
|
||||
@@ -229,32 +149,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "3+",
|
||||
title: "Years Experience",
|
||||
description: "Crafting compelling visuals since 2021.",
|
||||
icon: Award,
|
||||
id: "m1", value: "3+", title: "Years Experience", description: "Crafting compelling visuals since 2021.", icon: Award,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100+",
|
||||
title: "Projects Delivered",
|
||||
description: "A growing portfolio of successful collaborations.",
|
||||
icon: Package,
|
||||
id: "m2", value: "100+", title: "Projects Delivered", description: "A growing portfolio of successful collaborations.", icon: Package,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "95%",
|
||||
title: "Client Satisfaction",
|
||||
description: "Prioritizing client vision and delivering excellence.",
|
||||
icon: Smile,
|
||||
id: "m3", value: "95%", title: "Client Satisfaction", description: "Prioritizing client vision and delivering excellence.", icon: Smile,
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
value: "Global",
|
||||
title: "Audience Reach",
|
||||
description: "Content enjoyed by viewers worldwide.",
|
||||
icon: Globe,
|
||||
id: "m4", value: "Global", title: "Audience Reach", description: "Content enjoyed by viewers worldwide.", icon: Globe,
|
||||
},
|
||||
]}
|
||||
title="Our Impact at a Glance"
|
||||
@@ -270,50 +174,20 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex 'Apex' Gaming",
|
||||
role: "Twitch Streamer",
|
||||
company: "Apex Gaming",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-posing-with-universe-projection-texture_23-2149581276.jpg",
|
||||
imageAlt: "Alex 'Apex' Gaming",
|
||||
},
|
||||
id: "t1", name: "Alex 'Apex' Gaming", role: "Twitch Streamer", company: "Apex Gaming", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-posing-with-universe-projection-texture_23-2149581276.jpg", imageAlt: "Alex 'Apex' Gaming"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Sarah J.",
|
||||
role: "Marketing Director",
|
||||
company: "Digital Horizon Agency",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/red-arrow-with-copy-space_23-2148488443.jpg",
|
||||
imageAlt: "Sarah J.",
|
||||
},
|
||||
id: "t2", name: "Sarah J.", role: "Marketing Director", company: "Digital Horizon Agency", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/red-arrow-with-copy-space_23-2148488443.jpg", imageAlt: "Sarah J."},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mark R.",
|
||||
role: "YouTube Content Creator",
|
||||
company: "CinePro Studio",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-85269.jpg",
|
||||
imageAlt: "Mark R.",
|
||||
},
|
||||
id: "t3", name: "Mark R.", role: "YouTube Content Creator", company: "CinePro Studio", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-85269.jpg", imageAlt: "Mark R."},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Emily C.",
|
||||
role: "CEO",
|
||||
company: "Innovate Media",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-entrepreneur-showing-empty-speech-bubble-using-blank-isolated-copyapce-advertisement-camera-office-worker-suit-using-red-icon-billboard-ad-green-screen-backdrop_482257-63299.jpg",
|
||||
imageAlt: "Emily C.",
|
||||
},
|
||||
id: "t4", name: "Emily C.", role: "CEO", company: "Innovate Media", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-entrepreneur-showing-empty-speech-bubble-using-blank-isolated-copyapce-advertisement-camera-office-worker-suit-using-red-icon-billboard-ad-green-screen-backdrop_482257-63299.jpg", imageAlt: "Emily C."},
|
||||
{
|
||||
id: "t5",
|
||||
name: "David L.",
|
||||
role: "Animation Director",
|
||||
company: "Vivid Pixels",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mixed-red-crystalline-water-waves_23-2148358186.jpg",
|
||||
imageAlt: "David L.",
|
||||
},
|
||||
id: "t5", name: "David L.", role: "Animation Director", company: "Vivid Pixels", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mixed-red-crystalline-water-waves_23-2148358186.jpg", imageAlt: "David L."},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Hear directly from content creators, brands, and agencies who have experienced the ZenithX difference."
|
||||
@@ -326,31 +200,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "What types of content do you specialize in?",
|
||||
content: "I specialize in cinematic video editing, motion graphics, 2D/3D animation, sound design, and professional color grading for YouTube, social media, promotional content, and gaming cinematics.",
|
||||
},
|
||||
id: "f1", title: "What types of content do you specialize in?", content: "I specialize in cinematic video editing, motion graphics, 2D/3D animation, sound design, and professional color grading for YouTube, social media, promotional content, and gaming cinematics."},
|
||||
{
|
||||
id: "f2",
|
||||
title: "How do you ensure fast turnaround times?",
|
||||
content: "My workflow is optimized for efficiency, utilizing industry-standard software and organized project management. Clear communication and regular updates also contribute to timely delivery.",
|
||||
},
|
||||
"f3",
|
||||
id: "f2", title: "How do you ensure fast turnaround times?", content: "My workflow is optimized for efficiency, utilizing industry-standard software and organized project management. Clear communication and regular updates also contribute to timely delivery."},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can I request custom animations or visual effects?",
|
||||
content: "Absolutely! I thrive on creative challenges and can develop custom animations and visual effects tailored to your unique vision and brand requirements.",
|
||||
},
|
||||
id: "f3", title: "Can I request custom animations or visual effects?", content: "Absolutely! I thrive on creative challenges and can develop custom animations and visual effects tailored to your unique vision and brand requirements."},
|
||||
{
|
||||
id: "f4",
|
||||
title: "What is your typical collaboration process like?",
|
||||
content: "Collaboration begins with a detailed brief to understand your needs. We then move to concept development, editing/animation, review cycles, and final delivery, maintaining open communication throughout.",
|
||||
},
|
||||
id: "f4", title: "What is your typical collaboration process like?", content: "Collaboration begins with a detailed brief to understand your needs. We then move to concept development, editing/animation, review cycles, and final delivery, maintaining open communication throughout."},
|
||||
{
|
||||
id: "f5",
|
||||
title: "How can I get a quote for my project?",
|
||||
content: "You can request a quote by filling out the contact form below or by joining my Discord server to discuss your project specifics. Please provide as much detail as possible for an accurate estimate.",
|
||||
},
|
||||
id: "f5", title: "How can I get a quote for my project?", content: "You can request a quote by filling out the contact form below or by joining my Discord server to discuss your project specifics. Please provide as much detail as possible for an accurate estimate."},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Find quick answers to the most frequently asked questions about cinematic editing, animation services, and project collaboration."
|
||||
@@ -365,28 +223,17 @@ export default function LandingPage() {
|
||||
description="Ready to elevate your content? Reach out to discuss your project, collaborate on new ideas, or just say hello. I'm excited to bring your vision to life."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
name: "name", type: "text", placeholder: "Your Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
name: "email", type: "email", placeholder: "Your Email", required: true,
|
||||
},
|
||||
{
|
||||
name: "subject",
|
||||
type: "text",
|
||||
placeholder: "Project Subject",
|
||||
required: false,
|
||||
name: "subject", type: "text", placeholder: "Project Subject", required: false,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Tell me about your project...",
|
||||
rows: 5,
|
||||
name: "message", placeholder: "Tell me about your project...", rows: 5,
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/business-network-background-connecting-dots-technology-design_53876-160202.jpg"
|
||||
@@ -401,66 +248,39 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Cinematic Editing",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Cinematic Editing", href: "#services"},
|
||||
{
|
||||
label: "Motion Graphics",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Motion Graphics", href: "#services"},
|
||||
{
|
||||
label: "Sound Design",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Sound Design", href: "#services"},
|
||||
{
|
||||
label: "Color Grading",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Color Grading", href: "#services"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Quick Links",
|
||||
items: [
|
||||
title: "Quick Links", items: [
|
||||
{
|
||||
label: "Portfolio",
|
||||
href: "#portfolio",
|
||||
},
|
||||
label: "Portfolio", href: "#portfolio"},
|
||||
{
|
||||
label: "Testimonials",
|
||||
href: "#testimonials",
|
||||
},
|
||||
label: "Testimonials", href: "#testimonials"},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
label: "FAQ", href: "#faq"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
title: "Connect", items: [
|
||||
{
|
||||
label: "Discord",
|
||||
href: "https://discord.com/zenithx",
|
||||
},
|
||||
label: "Discord", href: "https://discord.com/zenithx"},
|
||||
{
|
||||
label: "Twitter",
|
||||
href: "https://twitter.com/zenithx",
|
||||
},
|
||||
label: "Twitter", href: "https://twitter.com/zenithx"},
|
||||
{
|
||||
label: "YouTube",
|
||||
href: "https://youtube.com/zenithx",
|
||||
},
|
||||
label: "YouTube", href: "https://youtube.com/zenithx"},
|
||||
{
|
||||
label: "Email",
|
||||
href: "mailto:connect@zenithx.com",
|
||||
},
|
||||
label: "Email", href: "mailto:connect@zenithx.com"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user