From acf124d0f65b0e3db3513fff10656cbde1760f5d Mon Sep 17 00:00:00 2001 From: bender Date: Fri, 5 Jun 2026 12:45:38 +0000 Subject: [PATCH] Update src/app/page.tsx --- src/app/page.tsx | 335 ++++++++++------------------------------------- 1 file changed, 70 insertions(+), 265 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index 5fda585..eab468b 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -32,110 +32,67 @@ export default function LandingPage() {
@@ -173,25 +124,14 @@ export default function LandingPage() { textboxLayout="default" gridVariant="three-columns-all-equal-width" useInvertedBackground={false} + animationType="blur-reveal" features={[ { - title: "Reactive 3D Environments", - description: "Building immersive 3D web applications that respond dynamically to user input and real-time data.", - imageSrc: "http://img.b2bpic.net/free-photo/ui-ux-representations-with-smartphone_23-2150201873.jpg", - imageAlt: "reactive ui element 3d animation", - }, + title: "Reactive 3D Environments", description: "Building immersive 3D web applications that respond dynamically to user input and real-time data.", imageSrc: "http://img.b2bpic.net/free-photo/ui-ux-representations-with-smartphone_23-2150201873.jpg", imageAlt: "reactive ui element 3d animation"}, { - title: "Advanced Algorithm Implementation", - description: "Developing efficient and complex algorithms for data processing, real-time physics, and interactive simulations.", - imageSrc: "http://img.b2bpic.net/free-photo/futuristic-data-center-cityscape_23-2152020917.jpg", - imageAlt: "complex algorithm 3d visualization data", - }, + title: "Advanced Algorithm Implementation", description: "Developing efficient and complex algorithms for data processing, real-time physics, and interactive simulations.", imageSrc: "http://img.b2bpic.net/free-photo/futuristic-data-center-cityscape_23-2152020917.jpg", imageAlt: "complex algorithm 3d visualization data"}, { - title: "Cross-Platform & Responsive Design", - description: "Ensuring seamless and beautiful experiences across all devices and screen sizes, from mobile to desktop VR.", - imageSrc: "http://img.b2bpic.net/free-photo/minimal-style-device-screen_23-2151913301.jpg", - imageAlt: "cross platform compatibility 3d devices", - }, + title: "Cross-Platform & Responsive Design", description: "Ensuring seamless and beautiful experiences across all devices and screen sizes, from mobile to desktop VR.", imageSrc: "http://img.b2bpic.net/free-photo/minimal-style-device-screen_23-2151913301.jpg", imageAlt: "cross platform compatibility 3d devices"}, ]} title="Core Skills: Bridging creativity and code" description="My expertise spans the entire development lifecycle, from conceptualizing dynamic user interfaces to optimizing backend performance and deploying scalable solutions." @@ -203,67 +143,26 @@ export default function LandingPage() { textboxLayout="default" gridVariant="three-columns-all-equal-width" useInvertedBackground={true} + animationType="blur-reveal" products={[ { - id: "p1", - brand: "Interactive Portfolio", - name: "Reactive 3D Web App", - price: "Case Study", - rating: 5, - reviewCount: "12 reviews", - imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104476.jpg", - imageAlt: "3d interactive web application portfolio", - }, + id: "p1", brand: "Interactive Portfolio", name: "Reactive 3D Web App", price: "Case Study", rating: 5, + reviewCount: "12 reviews", imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104476.jpg", imageAlt: "3d interactive web application portfolio"}, { - id: "p2", - brand: "AI Solutions", - name: "Data Visualization Tool", - price: "View Demo", - rating: 5, - reviewCount: "8 reviews", - imageSrc: "http://img.b2bpic.net/free-photo/robots-analyzing-data-computer-screens_23-2151966705.jpg", - imageAlt: "ai powered data visualization 3d", - }, + id: "p2", brand: "AI Solutions", name: "Data Visualization Tool", price: "View Demo", rating: 5, + reviewCount: "8 reviews", imageSrc: "http://img.b2bpic.net/free-photo/robots-analyzing-data-computer-screens_23-2151966705.jpg", imageAlt: "ai powered data visualization 3d"}, { - id: "p3", - brand: "XR Experiences", - name: "Immersive VR/AR Web", - price: "Explore", - rating: 5, - reviewCount: "15 reviews", - imageSrc: "http://img.b2bpic.net/free-photo/woman-taking-picture-city_53876-102580.jpg", - imageAlt: "web vr ar experience development", - }, + id: "p3", brand: "XR Experiences", name: "Immersive VR/AR Web", price: "Explore", rating: 5, + reviewCount: "15 reviews", imageSrc: "http://img.b2bpic.net/free-photo/woman-taking-picture-city_53876-102580.jpg", imageAlt: "web vr ar experience development"}, { - id: "p4", - brand: "Gaming & Simulation", - name: "Web-Based 3D Game", - price: "Play Now", - rating: 5, - reviewCount: "10 reviews", - imageSrc: "http://img.b2bpic.net/free-photo/science-experiment-laboratory-formula-chemical-concept_53876-125544.jpg", - imageAlt: "web game development interactive simulation", - }, + id: "p4", brand: "Gaming & Simulation", name: "Web-Based 3D Game", price: "Play Now", rating: 5, + reviewCount: "10 reviews", imageSrc: "http://img.b2bpic.net/free-photo/science-experiment-laboratory-formula-chemical-concept_53876-125544.jpg", imageAlt: "web game development interactive simulation"}, { - id: "p5", - brand: "Creative Tools", - name: "Generative Art Platform", - price: "Learn More", - rating: 5, - reviewCount: "7 reviews", - imageSrc: "http://img.b2bpic.net/free-vector/geometric-shapes-landing-page-gradient_23-2148266746.jpg", - imageAlt: "creative coding environment ui 3d", - }, + id: "p5", brand: "Creative Tools", name: "Generative Art Platform", price: "Learn More", rating: 5, + reviewCount: "7 reviews", imageSrc: "http://img.b2bpic.net/free-vector/geometric-shapes-landing-page-gradient_23-2148266746.jpg", imageAlt: "creative coding environment ui 3d"}, { - id: "p6", - brand: "Performance Apps", - name: "High-Performance SSR", - price: "Read Tech Doc", - rating: 5, - reviewCount: "9 reviews", - imageSrc: "http://img.b2bpic.net/free-photo/office-supplies-red-table_171337-13059.jpg", - imageAlt: "server side rendering web app performance", - }, + id: "p6", brand: "Performance Apps", name: "High-Performance SSR", price: "Read Tech Doc", rating: 5, + reviewCount: "9 reviews", imageSrc: "http://img.b2bpic.net/free-photo/office-supplies-red-table_171337-13059.jpg", imageAlt: "server side rendering web app performance"}, ]} title="Featured Projects: Innovating at the intersection of tech and art" description="A selection of my most impactful projects, showcasing innovative uses of 3D, AI, and interactive web technologies." @@ -278,25 +177,13 @@ export default function LandingPage() { useInvertedBackground={false} metrics={[ { - id: "m1", - value: "200%+", - description: "Performance Boost in WebGL Apps", - }, + id: "m1", value: "200%+", description: "Performance Boost in WebGL Apps"}, { - id: "m2", - value: "30%", - description: "Reduction in Page Load Times", - }, + id: "m2", value: "30%", description: "Reduction in Page Load Times"}, { - id: "m3", - value: "95%", - description: "User Engagement Increase with 3D Interfaces", - }, + id: "m3", value: "95%", description: "User Engagement Increase with 3D Interfaces"}, { - id: "m4", - value: "100%", - description: "Cross-Browser Compatibility", - }, + id: "m4", value: "100%", description: "Cross-Browser Compatibility"}, ]} title="Quantifiable Impact: My contributions" description="Driving innovation and delivering tangible results through dedicated development and strategic implementation." @@ -309,65 +196,15 @@ export default function LandingPage() { useInvertedBackground={true} testimonials={[ { - id: "t1", - name: "Sarah Johnson", - date: "Jan 2024", - title: "Visionary Developer", - quote: "Mamun's ability to bring complex 3D concepts to life on the web is truly visionary. His interactive portfolio stood out immediately.", - tag: "Tech CEO", - avatarSrc: "http://img.b2bpic.net/free-photo/closeup-confident-adult-business-leader_1262-4819.jpg", - avatarAlt: "tech CEO avatar stylized digital", - imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-103271.jpg", - imageAlt: "abstract 3d background testimonial card", - }, + id: "t1", name: "Sarah Johnson", date: "Jan 2024", title: "Visionary Developer", quote: "Mamun's ability to bring complex 3D concepts to life on the web is truly visionary. His interactive portfolio stood out immediately.", tag: "Tech CEO", avatarSrc: "http://img.b2bpic.net/free-photo/closeup-confident-adult-business-leader_1262-4819.jpg", avatarAlt: "tech CEO avatar stylized digital", imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-103271.jpg", imageAlt: "abstract 3d background testimonial card"}, { - id: "t2", - name: "Michael Chen", - date: "Feb 2024", - title: "Exceptional Problem Solver", - quote: "His analytical approach to challenges and seamless integration of AI in our project were crucial to its success. A top-tier engineer.", - tag: "Product Manager", - avatarSrc: "http://img.b2bpic.net/free-photo/pixel-art-design-portrait-bitmap_23-2149232484.jpg", - avatarAlt: "female product manager avatar digital", - imageSrc: "http://img.b2bpic.net/free-photo/studio-background-concept-abstract-empty-light-gradient-purple-studio-room-background-product-plain-studio-background_1258-87879.jpg", - imageAlt: "abstract 3d background testimonial card", - }, + id: "t2", name: "Michael Chen", date: "Feb 2024", title: "Exceptional Problem Solver", quote: "His analytical approach to challenges and seamless integration of AI in our project were crucial to its success. A top-tier engineer.", tag: "Product Manager", avatarSrc: "http://img.b2bpic.net/free-photo/pixel-art-design-portrait-bitmap_23-2149232484.jpg", avatarAlt: "female product manager avatar digital", imageSrc: "http://img.b2bpic.net/free-photo/studio-background-concept-abstract-empty-light-gradient-purple-studio-room-background-product-plain-studio-background_1258-87879.jpg", imageAlt: "abstract 3d background testimonial card"}, { - id: "t3", - name: "Emily Rodriguez", - date: "Mar 2024", - title: "Creative Technologist", - quote: "Mamun consistently delivers not just functional code, but also aesthetically stunning and highly engaging user experiences.", - tag: "CTO", - avatarSrc: "http://img.b2bpic.net/free-photo/pisces-portrait-beautiful-woman_23-2149275130.jpg", - avatarAlt: "male CTO avatar stylized digital", - imageSrc: "http://img.b2bpic.net/free-photo/top-view-blank-card-with-green-buttons_23-2148527922.jpg", - imageAlt: "abstract 3d background testimonial card", - }, + id: "t3", name: "Emily Rodriguez", date: "Mar 2024", title: "Creative Technologist", quote: "Mamun consistently delivers not just functional code, but also aesthetically stunning and highly engaging user experiences.", tag: "CTO", avatarSrc: "http://img.b2bpic.net/free-photo/pisces-portrait-beautiful-woman_23-2149275130.jpg", avatarAlt: "male CTO avatar stylized digital", imageSrc: "http://img.b2bpic.net/free-photo/top-view-blank-card-with-green-buttons_23-2148527922.jpg", imageAlt: "abstract 3d background testimonial card"}, { - id: "t4", - name: "David Kim", - date: "Apr 2024", - title: "Responsive and Reliable", - quote: "Working with Mamun is a pleasure. He's incredibly responsive, understands project needs deeply, and consistently exceeds expectations.", - tag: "Marketing Director", - avatarSrc: "http://img.b2bpic.net/free-vector/illustration-people-avatar_53876-44061.jpg", - avatarAlt: "female marketing director avatar digital", - imageSrc: "http://img.b2bpic.net/free-photo/abstract-orange-background-layout-designstudioroom-web-template-business-report-with-smooth-circle-gradient-color_1258-92100.jpg", - imageAlt: "abstract 3d background testimonial card", - }, + id: "t4", name: "David Kim", date: "Apr 2024", title: "Responsive and Reliable", quote: "Working with Mamun is a pleasure. He's incredibly responsive, understands project needs deeply, and consistently exceeds expectations.", tag: "Marketing Director", avatarSrc: "http://img.b2bpic.net/free-vector/illustration-people-avatar_53876-44061.jpg", avatarAlt: "female marketing director avatar digital", imageSrc: "http://img.b2bpic.net/free-photo/abstract-orange-background-layout-designstudioroom-web-template-business-report-with-smooth-circle-gradient-color_1258-92100.jpg", imageAlt: "abstract 3d background testimonial card"}, { - id: "t5", - name: "Jessica Lee", - date: "May 2024", - title: "Master of WebGL", - quote: "His command over WebGL and Three.js allowed us to create a truly groundbreaking interactive platform. Highly recommended for complex 3D projects.", - tag: "Lead Developer", - avatarSrc: "http://img.b2bpic.net/free-photo/double-exposure-caucasian-man-virtual-reality-vr-headset-is-presumably-gamer-hacker-cracking-code-into-secure-network-server-with-lines-code_146671-18943.jpg", - avatarAlt: "male lead developer avatar digital", - imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-background-with-flowing-particle-design_1048-13007.jpg", - imageAlt: "abstract 3d background testimonial card", - }, + id: "t5", name: "Jessica Lee", date: "May 2024", title: "Master of WebGL", quote: "His command over WebGL and Three.js allowed us to create a truly groundbreaking interactive platform. Highly recommended for complex 3D projects.", tag: "Lead Developer", avatarSrc: "http://img.b2bpic.net/free-photo/double-exposure-caucasian-man-virtual-reality-vr-headset-is-presumably-gamer-hacker-cracking-code-into-secure-network-server-with-lines-code_146671-18943.jpg", avatarAlt: "male lead developer avatar digital", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-background-with-flowing-particle-design_1048-13007.jpg", imageAlt: "abstract 3d background testimonial card"}, ]} title="What people say about my work" description="Insights from clients and collaborators on the impact and quality of my development and design contributions." @@ -380,37 +217,22 @@ export default function LandingPage() { useInvertedBackground={false} faqs={[ { - id: "faq1", - title: "What technologies do you specialize in?", - content: "I specialize in modern web technologies, including React, Next.js, TypeScript, WebGL (Three.js, Babylon.js), AI/ML integration, and various cloud platforms.", - }, + id: "faq1", title: "What technologies do you specialize in?", content: "I specialize in modern web technologies, including React, Next.js, TypeScript, WebGL (Three.js, Babylon.js), AI/ML integration, and various cloud platforms."}, { - id: "faq2", - title: "Can you work with existing teams and projects?", - content: "Yes, I am experienced in collaborating with existing teams, integrating into ongoing projects, and adopting established workflows and coding standards.", - }, + id: "faq2", title: "Can you work with existing teams and projects?", content: "Yes, I am experienced in collaborating with existing teams, integrating into ongoing projects, and adopting established workflows and coding standards."}, { - id: "faq3", - title: "What kind of projects are you most interested in?", - content: "I am most passionate about projects that involve interactive 3D graphics, real-time data visualization, AI-driven features, and complex, performance-critical web applications.", - }, + id: "faq3", title: "What kind of projects are you most interested in?", content: "I am most passionate about projects that involve interactive 3D graphics, real-time data visualization, AI-driven features, and complex, performance-critical web applications."}, { - id: "faq4", - title: "What is your process for new projects?", - content: "My process typically involves discovery, planning, design & prototyping, development, testing, deployment, and ongoing support. I prioritize clear communication and iterative feedback.", - }, + id: "faq4", title: "What is your process for new projects?", content: "My process typically involves discovery, planning, design & prototyping, development, testing, deployment, and ongoing support. I prioritize clear communication and iterative feedback."}, { - id: "faq5", - title: "How do you ensure performance in 3D applications?", - content: "I focus on optimization techniques like efficient asset loading, geometry optimization, shader performance, smart LODs, and Web Workers to ensure smooth frame rates and responsive interactions.", - }, + id: "faq5", title: "How do you ensure performance in 3D applications?", content: "I focus on optimization techniques like efficient asset loading, geometry optimization, shader performance, smart LODs, and Web Workers to ensure smooth frame rates and responsive interactions."}, ]} imageSrc="http://img.b2bpic.net/free-photo/flat-lay-colorful-translucent-geometric-shapes_23-2148830204.jpg" imageAlt="problem solving concept 3d faq" - mediaAnimation="reveal-blur" + mediaAnimation="blur-reveal" title="Frequently Asked Questions" description="Find answers to common questions about my skills, projects, and collaboration process." - faqsAnimation="reveal-blur" + faqsAnimation="blur-reveal" /> @@ -418,8 +240,7 @@ export default function LandingPage() {