Compare commits
9 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| cd917f5f36 | |||
| 161e1e1bdf | |||
| e732ccecc4 | |||
| dcdea7b2c7 | |||
| fc63e50b7d | |||
| 681eb18979 | |||
| 2c1ed0951e | |||
| 88a3916859 | |||
| ff086192da |
263
src/app/page.tsx
263
src/app/page.tsx
@@ -5,12 +5,13 @@ import ReactLenis from "lenis/react";
|
|||||||
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
||||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||||
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
|
|
||||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||||
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
|
import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
|
||||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||||
|
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
|
||||||
import TextAbout from '@/components/sections/about/TextAbout';
|
import TextAbout from '@/components/sections/about/TextAbout';
|
||||||
|
import { LayoutGrid, FileText, BarChart3, Settings, User } from "lucide-react";
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
return (
|
return (
|
||||||
@@ -18,155 +19,135 @@ export default function LandingPage() {
|
|||||||
defaultButtonVariant="icon-arrow"
|
defaultButtonVariant="icon-arrow"
|
||||||
defaultTextAnimation="reveal-blur"
|
defaultTextAnimation="reveal-blur"
|
||||||
borderRadius="soft"
|
borderRadius="soft"
|
||||||
contentWidth="small"
|
contentWidth="medium"
|
||||||
sizing="largeSmallSizeMediumTitles"
|
sizing="largeSizeMediumTitles"
|
||||||
background="grid"
|
background="noise"
|
||||||
cardStyle="solid"
|
cardStyle="glass-depth"
|
||||||
primaryButtonStyle="double-inset"
|
primaryButtonStyle="primary-glow"
|
||||||
secondaryButtonStyle="radial-glow"
|
secondaryButtonStyle="layered"
|
||||||
headingFontWeight="normal"
|
headingFontWeight="extrabold"
|
||||||
>
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarStyleApple
|
<NavbarStyleApple
|
||||||
navItems={[
|
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: "Contact", id: "contact" },
|
{ name: "Contact", id: "contact" },
|
||||||
]}
|
]}
|
||||||
brandName="MATÍAS LANFRANCONI"
|
brandName="MATÍAS LANFRANCONI"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="home" data-section="home">
|
<div id="home" data-section="home">
|
||||||
<HeroBillboardTestimonial
|
<HeroBillboardDashboard
|
||||||
useInvertedBackground={false}
|
title="Premium Digital Craftsmanship"
|
||||||
background={{ variant: "gradient-bars" }}
|
description="Minimalist high-impact web design for modern brands."
|
||||||
title="Sitios web que convierten visitas en clientes"
|
background={{ variant: "plain" }}
|
||||||
description="Diseño y desarrollo páginas web en WordPress pensadas para emprendedores que buscan resultados reales."
|
buttons={[{ text: "View Work" }, { text: "Hire Me" }]}
|
||||||
testimonials={[
|
dashboard={{
|
||||||
{ name: "Client A", handle: "@client", testimonial: "Increíble trabajo, resultados inmediatos.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-empty-notepad-desk_23-2148854585.jpg" },
|
title: "Project Metrics", stats: [
|
||||||
{ name: "Client B", handle: "@b_startup", testimonial: "Profesionalismo puro y entrega a tiempo.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/minimalist-workspace-with-tablet-coffee-plants_23-2152003805.jpg" },
|
{ title: "Conversion", description: "Per visit", values: [85, 92, 98] },
|
||||||
{ name: "Client C", handle: "@digital_agency", testimonial: "Una mejora radical en nuestra tasa de conversión.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/desk-arrangement-with-laptop-high-angle_23-2149073071.jpg" },
|
{ title: "Efficiency", description: "Per process", values: [70, 75, 80] },
|
||||||
{ name: "Client D", handle: "@indie_dev", testimonial: "Entiende perfectamente el nicho de videojuegos.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/top-view-desk-with-coffee-plant-laptop_23-2148110227.jpg" },
|
{ title: "Performance", description: "Per load", values: [90, 95, 99] }
|
||||||
{ name: "Client E", handle: "@fashion_store", testimonial: "Estética impecable, justo lo que buscábamos.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/stylish-beauty-women-elegent-enjoy-concept_53876-121075.jpg" },
|
],
|
||||||
]}
|
logoIcon: LayoutGrid,
|
||||||
buttons={[{ text: "Solicitá una cotización", href: "#contact" }, { text: "Agendá una reunión", href: "#contact" }]}
|
sidebarItems: [{ icon: LayoutGrid, active: true }, { icon: FileText, active: false }, { icon: BarChart3, active: false }, { icon: Settings, active: false }],
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/cozy-aesthetic-workspace-with-laptop-plants-warm-light_23-2152033088.jpg"
|
listItems: [{ icon: User, title: "New Lead", status: "Active" }, { icon: FileText, title: "Project Alpha", status: "Pending" }],
|
||||||
imageAlt="Matías Lanfranconi Web Design"
|
buttons: [{ text: "Export" }, { text: "Refresh" }],
|
||||||
avatars={[
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-working-with-computer_23-2149930993.jpg"
|
||||||
{ src: "http://img.b2bpic.net/free-photo/cozy-aesthetic-workspace-with-laptop-plants-warm-light_23-2152033088.jpg", alt: "User 1" },
|
}}
|
||||||
{ src: "http://img.b2bpic.net/free-photo/person-using-ar-technology-perform-their-occupation_23-2151137417.jpg", alt: "User 2" },
|
/>
|
||||||
{ src: "http://img.b2bpic.net/free-photo/side-view-man-working-with-computer_23-2149930993.jpg", alt: "User 3" },
|
</div>
|
||||||
{ src: "http://img.b2bpic.net/free-photo/close-up-hand-holding-card_23-2149241415.jpg", alt: "User 4" },
|
|
||||||
{ src: "http://img.b2bpic.net/free-photo/businessman-doing-research-analysis-computer-screen-plan-financial-statistics-with-charts-graphs-data-male-employee-working-with-diagram-report-find-sales-profit-e-commerce_482257-40940.jpg", alt: "User 5" },
|
|
||||||
]}
|
|
||||||
marqueeItems={[
|
|
||||||
{ type: "text", text: "WordPress Expert" },
|
|
||||||
{ type: "text", text: "Conversion Driven" },
|
|
||||||
{ type: "text", text: "High Performance" },
|
|
||||||
{ type: "text", text: "Mobile Responsive" },
|
|
||||||
{ type: "text", text: "SEO Optimized" },
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
<div id="about" data-section="about">
|
||||||
<TextAbout
|
<TextAbout
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
tag="About Me"
|
tag="About Me"
|
||||||
title="Soy Matías Lanfranconi — Diseñador y desarrollador web especializado en WordPress."
|
title="Soy Matías Lanfranconi — Diseñador y desarrollador web especializado en WordPress."
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="services" data-section="services">
|
<div id="services" data-section="services">
|
||||||
<FeatureCardTwentyNine
|
<FeatureCardTwentyOne
|
||||||
animationType="slide-up"
|
title="Core Services"
|
||||||
textboxLayout="split"
|
description="Specialized digital expertise to accelerate your business growth."
|
||||||
gridVariant="four-items-2x2-equal-grid"
|
accordionItems={[
|
||||||
useInvertedBackground={false}
|
{ id: "s1", title: "Web Design", content: "Premium minimalist aesthetic, custom built for your brand identity." },
|
||||||
features={[
|
{ id: "s2", title: "E-Commerce", content: "High-performance shop architecture optimized for conversion." },
|
||||||
{ title: "Diseño y desarrollo web", description: "Sitios profesionales, escalables y fáciles de administrar.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-working-with-computer_23-2149930993.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/female-web-designer-office-with-laptop_23-2149749908.jpg", buttonText: "Saber más" },
|
{ id: "s3", title: "Performance", content: "Lightning-fast load speeds for optimal user experience." },
|
||||||
{ title: "Tiendas online", description: "Venta directa con WooCommerce, integraciones de pago.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-holding-card_23-2149241415.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/young-woman-professional-beauty-make-up-artist-vlogger-blogger-recording-makeup-tutorial-share-website-social-media_231208-14025.jpg", buttonText: "Saber más" },
|
{ id: "s4", title: "Security", content: "Robust backend protection and scalable infrastructure security." }
|
||||||
{ title: "Mantenimiento y seguridad", description: "Actualizaciones, backups y monitoreo constante.", imageSrc: "http://img.b2bpic.net/free-photo/businessman-doing-research-analysis-computer-screen-plan-financial-statistics-with-charts-graphs-data-male-employee-working-with-diagram-report-find-sales-profit-e-commerce_482257-40940.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/digital-tablet-with-internet-browser-search-bar-screen_169016-40040.jpg", buttonText: "Saber más" },
|
]}
|
||||||
{ title: "Desarrollo para agencias", description: "Trabajo tercerizado con total confidencialidad.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-studio_23-2151320710.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/elegant-cozy-office-lifestyle_23-2149636247.jpg", buttonText: "Saber más" },
|
imageSrc="http://img.b2bpic.net/free-photo/gaming-gear-desk-concept_23-2148734472.jpg?_wi=1"
|
||||||
]}
|
useInvertedBackground={false}
|
||||||
title="Qué puedo hacer por tu negocio"
|
mediaAnimation="blur-reveal"
|
||||||
description="Soluciones estratégicas, rápidas y escalables."
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="game-dev" data-section="game-dev">
|
<div id="game-dev" data-section="game-dev">
|
||||||
<ProductCardOne
|
<ProductCardOne
|
||||||
animationType="slide-up"
|
title="Professional Gaming & Pixel Art"
|
||||||
textboxLayout="split"
|
description="Custom digital assets and interactive experiences with a dark, professional aesthetic."
|
||||||
gridVariant="one-large-left-three-stacked-right"
|
gridVariant="asymmetric-60-wide-40-narrow"
|
||||||
useInvertedBackground={false}
|
animationType="blur-reveal"
|
||||||
products={[
|
textboxLayout="split"
|
||||||
{ id: "p1", name: "Landing pages para lanzamientos", price: "Expertise", imageSrc: "http://img.b2bpic.net/free-photo/person-using-ar-technology-perform-their-occupation_23-2151137417.jpg" },
|
useInvertedBackground={false}
|
||||||
{ id: "p2", name: "Integración Steam/Discord", price: "Tech", imageSrc: "http://img.b2bpic.net/free-photo/businessman-using-tablet-close-up_23-2148308536.jpg" },
|
products={[
|
||||||
{ id: "p3", name: "Galerías de arte y Trailers", price: "Visuals", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-minimal-technology-landing-page_23-2149123973.jpg" },
|
{ id: "p1", name: "Cyber Pixel Quest", price: "Custom Quote", imageSrc: "http://img.b2bpic.net/free-photo/gaming-gear-desk-concept_23-2148734472.jpg?_wi=2" },
|
||||||
{ id: "p4", name: "Formularios para prensa", price: "PR", imageSrc: "http://img.b2bpic.net/free-photo/factory-employee-works-mockup-tablet-executives-discussing-strategies_482257-126500.jpg" },
|
{ id: "p2", name: "Retro Asset Pack", price: "Custom Quote", imageSrc: "http://img.b2bpic.net/free-photo/gaming-gear-desk-concept_23-2148734472.jpg?_wi=3" },
|
||||||
{ id: "p5", name: "Diseño adaptable", price: "Mobile", imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-vr-headset-smart-technology-double-color-exposure-effect_53876-104907.jpg" },
|
{ id: "p3", name: "Interactive Logic", price: "Custom Quote", imageSrc: "http://img.b2bpic.net/free-photo/gaming-gear-desk-concept_23-2148734472.jpg?_wi=4" }
|
||||||
{ id: "p6", name: "Devlogs interactivos", price: "Content", imageSrc: "http://img.b2bpic.net/free-photo/couple-gamers-playing-multiplayer-game-powerful-computer-home-with-professional-headphones_482257-488.jpg" },
|
]}
|
||||||
]}
|
/>
|
||||||
title="Webs diseñadas para estudios y desarrolladores de videojuegos"
|
</div>
|
||||||
description="Convertí tu juego en una marca que despierte interés y expectativa."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="why-me" data-section="why-me">
|
<div id="why-me" data-section="why-me">
|
||||||
<FaqSplitText
|
<FaqSplitText
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
faqs={[
|
sideTitle="Más que una web."
|
||||||
{ id: "f1", title: "Experiencia en conversión y UX", content: "Optimizamos cada elemento para mejorar el rendimiento de ventas." },
|
sideDescription="Entiendo la tecnología como un vehículo de ventas, no solo una cara bonita."
|
||||||
{ id: "f2", title: "Sitios rápidos y seguros", content: "Velocidad de carga y protección constante ante amenazas." },
|
faqs={[
|
||||||
{ id: "f3", title: "Diseño adaptable", content: "Perfecto en cualquier dispositivo, móvil o escritorio." },
|
{ id: "f1", title: "Conversión y UX", content: "Cada píxel está diseñado para guiar al usuario hacia la acción." },
|
||||||
{ id: "f4", title: "Comunicación clara", content: "Soporte personalizado durante todo el proceso." },
|
{ id: "f2", title: "Sitios de Alta Velocidad", content: "Infraestructura técnica optimizada para carga inmediata." },
|
||||||
]}
|
{ id: "f3", title: "Diseño Adaptativo", content: "Experiencia consistente en todos los tamaños de pantalla." },
|
||||||
sideTitle="Tu web necesita más que un diseño bonito."
|
]}
|
||||||
sideDescription="Cuando diseñás un sitio web, no solo necesitás que se vea bien — necesitás que funcione. Enfoco cada proyecto con mentalidad de marketing."
|
faqsAnimation="blur-reveal"
|
||||||
faqsAnimation="slide-up"
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="portfolio" data-section="portfolio">
|
<div id="portfolio" data-section="portfolio">
|
||||||
<BlogCardOne
|
<BlogCardOne
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
title="Mis últimos trabajos"
|
title="Mis últimos trabajos"
|
||||||
description="Explora algunos de mis proyectos más recientes."
|
description="Explora una selección de proyectos destacados."
|
||||||
blogs={[
|
blogs={[
|
||||||
{
|
{ id: "b1", category: "Web Design", title: "Indie Studio Launch", excerpt: "Landing page para Steam.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345406.jpg?_wi=1", authorName: "Matías L.", authorAvatar: "", date: "2024" },
|
||||||
id: "b1", category: "Web Design", title: "Landing Page para Indie Studio", excerpt: "Sitio optimizado para campaña Steam.", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-floor-from-home-with-device_23-2149208592.jpg", authorName: "Matías L.", authorAvatar: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345406.jpg", date: "2024"},
|
{ id: "b2", category: "E-Commerce", title: "Shopify Redesign", excerpt: "Aumento de conversión del 30%.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-graphic-design-office_23-2151345406.jpg?_wi=2", authorName: "Matías L.", authorAvatar: "", date: "2024" }
|
||||||
{
|
]}
|
||||||
id: "b2", category: "E-Commerce", title: "Boutique Online", excerpt: "Diseño elegante para venta de lujo.", imageSrc: "http://img.b2bpic.net/free-photo/people-look-clothing-kiosk-service_482257-89749.jpg", authorName: "Matías L.", authorAvatar: "http://img.b2bpic.net/free-photo/full-shot-woman-with-shopping-bags-smartphone_23-2148734472.jpg", date: "2024"},
|
/>
|
||||||
{
|
</div>
|
||||||
id: "b3", category: "Corporate", title: "SaaS Platform", excerpt: "Dashboard eficiente y moderno.", imageSrc: "http://img.b2bpic.net/free-photo/computers-data-center-running-server-rigs-diagnostic-tests_482257-118495.jpg", authorName: "Matías L.", authorAvatar: "http://img.b2bpic.net/free-photo/financial-software-ui-pc-screen-apartment-office-desk_482257-122945.jpg", date: "2024"},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
<div id="contact" data-section="contact">
|
||||||
<ContactCenter
|
<ContactCenter
|
||||||
useInvertedBackground={false}
|
tag="Contacto"
|
||||||
background={{ variant: "plain" }}
|
title="¿Listo para elevar tu presencia digital?"
|
||||||
tag="Contacto"
|
description="Empecemos tu proyecto. Respuesta garantizada en 24h."
|
||||||
title="¿Querés un sitio que venda?"
|
background={{ variant: "plain" }}
|
||||||
description="Contame sobre tu proyecto y te asesoro sin compromiso. Respondo dentro de las 24 horas."
|
useInvertedBackground={false}
|
||||||
/>
|
buttonText="Enviar"
|
||||||
</div>
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterLogoReveal
|
<FooterLogoReveal
|
||||||
logoText="MATÍAS LANFRANCONI"
|
logoText="MATÍAS LANFRANCONI"
|
||||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||||
rightLink={{ text: "© 2024 All Rights Reserved", href: "#" }}
|
rightLink={{ text: "© 2024 All Rights Reserved", href: "#" }}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user