bender/6d34520d-9336-45ae-ac76-69b626afc6b5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-06-03 00:10:32 +00:00
parent 87c4ebb992
commit 4bee482370
1 changed files with 67 additions and 238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

305
src/app/page.tsx
View File

@@ -32,131 +32,81 @@ export default function LandingPage() {
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Inicio",
id: "#hero",
},
name: "Inicio", id: "#hero"},
{
name: "Problemas",
id: "#problems",
},
name: "Problemas", id: "#problems"},
{
name: "Proceso",
id: "#process",
},
name: "Proceso", id: "#process"},
{
name: "Portafolio",
id: "#portfolio",
},
name: "Portafolio", id: "#portfolio"},
{
name: "Beneficios",
id: "#benefits",
},
name: "Beneficios", id: "#benefits"},
{
name: "Testimonios",
id: "#testimonials",
},
name: "Testimonios", id: "#testimonials"},
{
name: "Contacto",
id: "#contact",
},
name: "Contacto", id: "#contact"},
]}
logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=r9v90b"
brandName="Pedro Monf"
button={{
text: "Solicitar Auditoría",
}}
text: "Solicitar Auditoría"}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "animated-grid",
}}
variant: "animated-grid"}}
imagePosition="right"
title="Tu negocio merece una web mejor."
description="Analizo tu página actual y te enseño una propuesta de mejora antes de que pagues nada."
kpis={[
{
value: "15+",
label: "Proyectos",
},
value: "15+", label: "Proyectos"},
{
value: "95%",
label: "Clientes Satisfechos",
},
value: "95%", label: "Clientes Satisfechos"},
{
value: "3+",
label: "Años Experiencia",
},
value: "3+", label: "Años Experiencia"},
]}
enableKpiAnimation={true}
tag="Desarrollador Web Freelance"
buttons={[
{
text: "Solicitar auditoría gratuita",
href: "#contact",
},
text: "Solicitar auditoría gratuita", href: "#contact"},
{
text: "Ver ejemplos",
href: "#portfolio",
},
text: "Ver ejemplos", href: "#portfolio"},
]}
imageSrc="http://img.b2bpic.net/free-photo/elegant-cozy-office-lifestyle_23-2149636247.jpg"
imageAlt="Modern web development environment on a desktop screen"
imageSrc="http://img.b2bpic.net/free-photo/modern-touchscreen-smartphone-hand-showing-some-app_23-2149636254.jpg"
imageAlt="Modern touchscreen smartphone in hand showing an app, representing a phone animation"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/colleagues-working-office_23-2149307795.jpg",
alt: "Colleagues working at office",
},
src: "http://img.b2bpic.net/free-photo/colleagues-working-office_23-2149307795.jpg", alt: "Colleagues working at office"},
{
src: "http://img.b2bpic.net/free-photo/elegant-cozy-office-with-laptop-desk_23-2149636248.jpg",
alt: "Elegant and cozy office with laptop on desk",
},
src: "http://img.b2bpic.net/free-photo/elegant-cozy-office-with-laptop-desk_23-2149636248.jpg", alt: "Elegant and cozy office with laptop on desk"},
{
src: "http://img.b2bpic.net/free-photo/creative-photographer-retouching-photos-night-retouching-using-digitizer_482257-32845.jpg",
alt: "Creative photographer retouching photos at night. Retouching using digitizer.",
},
src: "http://img.b2bpic.net/free-photo/creative-photographer-retouching-photos-night-retouching-using-digitizer_482257-32845.jpg", alt: "Creative photographer retouching photos at night. Retouching using digitizer."},
{
src: "http://img.b2bpic.net/free-photo/ai-llm-chatbot-software-interface-pc-home-office-showing-virtual-assistant_482257-113943.jpg",
alt: "AI LLM chatbot software interface on PC in home office showing virtual assistant",
},
src: "http://img.b2bpic.net/free-photo/ai-llm-chatbot-software-interface-pc-home-office-showing-virtual-assistant_482257-113943.jpg", alt: "AI LLM chatbot software interface on PC in home office showing virtual assistant"},
{
src: "http://img.b2bpic.net/free-photo/woman-resting-her-head-office-desk_482257-119523.jpg",
alt: "Woman resting in her head at office desk",
},
src: "http://img.b2bpic.net/free-photo/woman-resting-her-head-office-desk_482257-119523.jpg", alt: "Woman resting in her head at office desk"},
]}
avatarText="Más de 100 proyectos exitosos"
marqueeItems={[
{
type: "text",
text: "Crecimiento Garantizado",
type: "text", text: "Crecimiento Garantizado"},
{
type: "text-icon", text: "Diseño Responsivo", icon: Laptop,
},
{
type: "text-icon",
text: "Diseño Responsivo",
icon: Laptop,
type: "image", src: "http://img.b2bpic.net/free-photo/business-people-working-computer-with-green-screen-startup-office-colleagues-doing-teamwork-discussing-about-isolated-chroma-key-with-mockup-template-background-display_482257-37146.jpg", alt: "Business people working on computer with green screen in startup office."},
{
type: "text-icon", text: "SEO Optimizado", icon: Search,
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/business-people-working-computer-with-green-screen-startup-office-colleagues-doing-teamwork-discussing-about-isolated-chroma-key-with-mockup-template-background-display_482257-37146.jpg",
alt: "Business people working on computer with green screen in startup office.",
},
type: "image", src: "http://img.b2bpic.net/free-photo/business-man-talking-workmates-about-project-planning-strategy-office-person-presenting-analysis-colleagues-company-development-financial-growth-presentation-ideas_482257-40433.jpg", alt: "Business man talking to workmates about project planning and strategy in office."},
{
type: "text-icon",
text: "SEO Optimizado",
icon: Search,
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/business-man-talking-workmates-about-project-planning-strategy-office-person-presenting-analysis-colleagues-company-development-financial-growth-presentation-ideas_482257-40433.jpg",
alt: "Business man talking to workmates about project planning and strategy in office.",
},
{
type: "text",
text: "Resultados Medibles",
},
type: "text", text: "Resultados Medibles"},
]}
/>
</div>
@@ -167,23 +117,11 @@ export default function LandingPage() {
useInvertedBackground={true}
features={[
{
title: "Webs lentas",
description: "Los visitantes se van si tu web tarda en cargar. Una web rápida es crucial para la experiencia de usuario y el SEO.",
imageSrc: "http://img.b2bpic.net/free-photo/keep-calm-reduce-speed-relax-slow-down-concept_53876-120329.jpg",
imageAlt: "Slow loading website icon",
},
title: "Webs lentas", description: "Los visitantes se van si tu web tarda en cargar. Una web rápida es crucial para la experiencia de usuario y el SEO.", imageSrc: "http://img.b2bpic.net/free-photo/keep-calm-reduce-speed-relax-slow-down-concept_53876-120329.jpg", imageAlt: "Slow loading website icon"},
{
title: "Diseño anticuado",
description: "Una imagen antigua puede generar desconfianza y hacer que tu negocio parezca menos profesional. La primera impresión cuenta.",
imageSrc: "http://img.b2bpic.net/free-photo/young-man-works-laptop-man-with-laptop_169016-61120.jpg",
imageAlt: "Outdated vs modern website design",
},
title: "Diseño anticuado", description: "Una imagen antigua puede generar desconfianza y hacer que tu negocio parezca menos profesional. La primera impresión cuenta.", imageSrc: "http://img.b2bpic.net/free-photo/young-man-works-laptop-man-with-laptop_169016-61120.jpg", imageAlt: "Outdated vs modern website design"},
{
title: "Mala experiencia móvil",
description: "La mayoría de tus clientes te buscan desde el móvil. Si tu web no está adaptada, los estás perdiendo.",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-holding-smartphone-standing-front-wall-shrugging_23-2147841160.jpg",
imageAlt: "Person frustrated with mobile website",
},
title: "Mala experiencia móvil", description: "La mayoría de tus clientes te buscan desde el móvil. Si tu web no está adaptada, los estás perdiendo.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-holding-smartphone-standing-front-wall-shrugging_23-2147841160.jpg", imageAlt: "Person frustrated with mobile website"},
]}
title="Problemas que tu web actual podría estar causando."
description="Si tu sitio web no está actualizado, podría estar costándote clientes. Aquí hay algunos de los problemas más comunes que resuelvo:"
@@ -198,21 +136,13 @@ export default function LandingPage() {
description="Trabajo de cerca contigo en cada paso, asegurándome de que el resultado final sea exactamente lo que tu negocio necesita para crecer."
metrics={[
{
value: "1",
title: "Analizo tu web actual",
},
value: "1", title: "Analizo tu web actual"},
{
value: "2",
title: "Te presento una propuesta visual",
},
value: "2", title: "Te presento una propuesta visual"},
{
value: "3",
title: "Si te gusta, la construyo",
},
value: "3", title: "Si te gusta, la construyo"},
{
value: "4",
title: "La publicamos y optimizamos",
},
value: "4", title: "La publicamos y optimizamos"},
]}
imageSrc="http://img.b2bpic.net/free-photo/sales-consultant-using-e-commerce-statistics-computer-monitor-develop-financial-growth-business-development-manager-working-with-data-analysis-diagrams-research-tripod-shot_482257-40942.jpg"
imageAlt="Developer analyzing website data"
@@ -230,47 +160,17 @@ export default function LandingPage() {
carouselMode="buttons"
products={[
{
id: "clinic-redesign",
name: "Clínica Dental Sonrisa",
price: "Antes / Después",
imageSrc: "http://img.b2bpic.net/free-photo/doctors-nurses-review-radiography-scans-with-green-screen-desk_482257-123281.jpg",
imageAlt: "Redesigned modern clinic website",
},
id: "clinic-redesign", name: "Clínica Dental Sonrisa", price: "Antes / Después", imageSrc: "http://img.b2bpic.net/free-photo/doctors-nurses-review-radiography-scans-with-green-screen-desk_482257-123281.jpg", imageAlt: "Redesigned modern clinic website"},
{
id: "restaurant-redesign",
name: "Restaurante El Sabor",
price: "Antes / Después",
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-dried-fruit-marmalade-cardboard-tray_23-2148425597.jpg",
imageAlt: "Redesigned elegant restaurant website",
},
id: "restaurant-redesign", name: "Restaurante El Sabor", price: "Antes / Después", imageSrc: "http://img.b2bpic.net/free-photo/arrangement-dried-fruit-marmalade-cardboard-tray_23-2148425597.jpg", imageAlt: "Redesigned elegant restaurant website"},
{
id: "gym-redesign",
name: "Gimnasio Fuerza Viva",
price: "Antes / Después",
imageSrc: "http://img.b2bpic.net/free-photo/females-working-hard-fitness-class_23-2148387765.jpg",
imageAlt: "Redesigned dynamic gym website",
},
id: "gym-redesign", name: "Gimnasio Fuerza Viva", price: "Antes / Después", imageSrc: "http://img.b2bpic.net/free-photo/females-working-hard-fitness-class_23-2148387765.jpg", imageAlt: "Redesigned dynamic gym website"},
{
id: "salon-redesign",
name: "Peluquería Estilo",
price: "Antes / Después",
imageSrc: "http://img.b2bpic.net/free-photo/dentistry-team-analyzing-teeth-x-ray-green-screen-monitor-dentist-office-specialist-man-nurse-working-with-isolated-mockup-template-radiography-teethcare_482257-38493.jpg",
imageAlt: "Outdated hair salon website",
},
id: "salon-redesign", name: "Peluquería Estilo", price: "Antes / Después", imageSrc: "http://img.b2bpic.net/free-photo/dentistry-team-analyzing-teeth-x-ray-green-screen-monitor-dentist-office-specialist-man-nurse-working-with-isolated-mockup-template-radiography-teethcare_482257-38493.jpg", imageAlt: "Outdated hair salon website"},
{
id: "workshop-redesign",
name: "Taller AutoExpert",
price: "Antes / Después",
imageSrc: "http://img.b2bpic.net/free-photo/domestic-life-illustrated_23-2151876249.jpg",
imageAlt: "Old car workshop website",
},
id: "workshop-redesign", name: "Taller AutoExpert", price: "Antes / Después", imageSrc: "http://img.b2bpic.net/free-photo/domestic-life-illustrated_23-2151876249.jpg", imageAlt: "Old car workshop website"},
{
id: "academy-redesign",
name: "Academia Idiomas Global",
price: "Antes / Después",
imageSrc: "http://img.b2bpic.net/free-photo/fitness-health-physical-strength-training-workout-concept_53876-133837.jpg",
imageAlt: "Amateurish language academy website",
},
id: "academy-redesign", name: "Academia Idiomas Global", price: "Antes / Después", imageSrc: "http://img.b2bpic.net/free-photo/fitness-health-physical-strength-training-workout-concept_53876-133837.jpg", imageAlt: "Amateurish language academy website"},
]}
title="Casos de éxito y transformaciones."
description="Mira cómo he ayudado a otros negocios locales a modernizar su presencia online y atraer más clientes."
@@ -284,25 +184,13 @@ export default function LandingPage() {
tag="Resultados Concretos"
metrics={[
{
id: "confianza",
value: "+Confianza",
description: "Una web moderna proyecta profesionalidad y genera mayor credibilidad entre tus clientes potenciales.",
},
id: "confianza", value: "+Confianza", description: "Una web moderna proyecta profesionalidad y genera mayor credibilidad entre tus clientes potenciales."},
{
id: "imagen",
value: "Mejor Imagen",
description: "Tu marca brillará con un diseño actual y atractivo, diferenciándote de la competencia y captando más miradas.",
},
id: "imagen", value: "Mejor Imagen", description: "Tu marca brillará con un diseño actual y atractivo, diferenciándote de la competencia y captando más miradas."},
{
id: "contactos",
value: "+Contactos",
description: "Diseño optimizado para convertir visitantes en clientes, con llamadas a la acción claras y formularios accesibles.",
},
id: "contactos", value: "+Contactos", description: "Diseño optimizado para convertir visitantes en clientes, con llamadas a la acción claras y formularios accesibles."},
{
id: "movil",
value: "Mobile First",
description: "Experiencia impecable en cualquier dispositivo, garantizando que nadie se quede fuera por un diseño no adaptado.",
},
id: "movil", value: "Mobile First", description: "Experiencia impecable en cualquier dispositivo, garantizando que nadie se quede fuera por un diseño no adaptado."},
]}
metricsAnimation="slide-up"
/>
@@ -315,68 +203,26 @@ export default function LandingPage() {
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Marta Gómez",
handle: "@ClinicaDental",
testimonial: "Pedro transformó por completo la web de nuestra clínica. Ahora es rápida, moderna y recibimos muchas más consultas online. ¡Un trabajo excepcional!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pleased-successful-female-administrator-office_273609-4124.jpg",
imageAlt: "Marta Gómez, dueña de clínica dental",
},
id: "1", name: "Marta Gómez", handle: "@ClinicaDental", testimonial: "Pedro transformó por completo la web de nuestra clínica. Ahora es rápida, moderna y recibimos muchas más consultas online. ¡Un trabajo excepcional!", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pleased-successful-female-administrator-office_273609-4124.jpg", imageAlt: "Marta Gómez, dueña de clínica dental"},
{
id: "2",
name: "Javier Ruiz",
handle: "@RestauranteSabor",
testimonial: "Nuestro restaurante necesitaba una web a la altura. Pedro no solo la hizo bonita, sino funcional. Las reservas online se han disparado. Muy recomendable.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/brunette-girl-giving-thumb-up_23-2147650951.jpg",
imageAlt: "Javier Ruiz, dueño de restaurante",
},
id: "2", name: "Javier Ruiz", handle: "@RestauranteSabor", testimonial: "Nuestro restaurante necesitaba una web a la altura. Pedro no solo la hizo bonita, sino funcional. Las reservas online se han disparado. Muy recomendable.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/brunette-girl-giving-thumb-up_23-2147650951.jpg", imageAlt: "Javier Ruiz, dueño de restaurante"},
{
id: "3",
name: "Elena Torres",
handle: "@GimnasioFuerza",
testimonial: "Estaba cansada de mi web antigua. Pedro entendió lo que quería y creó una web para el gimnasio que es genial, fácil de usar y se ve increíble en el móvil.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-training-gym-side-view_23-2150007167.jpg",
imageAlt: "Elena Torres, dueña de gimnasio",
},
id: "3", name: "Elena Torres", handle: "@GimnasioFuerza", testimonial: "Estaba cansada de mi web antigua. Pedro entendió lo que quería y creó una web para el gimnasio que es genial, fácil de usar y se ve increíble en el móvil.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-training-gym-side-view_23-2150007167.jpg", imageAlt: "Elena Torres, dueña de gimnasio"},
{
id: "4",
name: "Carlos Blanco",
handle: "@TallerAutoExpert",
testimonial: "Profesionalidad de principio a fin. La nueva web de nuestro taller nos ha traído muchos clientes que antes no encontrábamos. Inversión 100% amortizada.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-professional-carpenter-standing-workshop-arms-folded_1098-19122.jpg",
imageAlt: "Carlos Blanco, dueño de taller",
},
id: "4", name: "Carlos Blanco", handle: "@TallerAutoExpert", testimonial: "Profesionalidad de principio a fin. La nueva web de nuestro taller nos ha traído muchos clientes que antes no encontrábamos. Inversión 100% amortizada.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-professional-carpenter-standing-workshop-arms-folded_1098-19122.jpg", imageAlt: "Carlos Blanco, dueño de taller"},
{
id: "5",
name: "Laura Díaz",
handle: "@AcademiaGlobal",
testimonial: "La web que Pedro diseñó para nuestra academia es justo lo que necesitábamos. Clara, funcional y con un diseño premium. Ha superado nuestras expectativas.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cute-lady-holding-idea-board-looking-camera_114579-92435.jpg",
imageAlt: "Laura Díaz, directora de academia",
},
id: "5", name: "Laura Díaz", handle: "@AcademiaGlobal", testimonial: "La web que Pedro diseñó para nuestra academia es justo lo que necesitábamos. Clara, funcional y con un diseño premium. Ha superado nuestras expectativas.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cute-lady-holding-idea-board-looking-camera_114579-92435.jpg", imageAlt: "Laura Díaz, directora de academia"},
{
id: "6",
name: "Fernando Soler",
handle: "@FloristeriaPrimavera",
testimonial: "Nuestra floristería ha visto un aumento en pedidos online gracias a la nueva web de Pedro. El diseño es precioso y muy fácil de gestionar.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/people-technology-leisure-concept_273609-6599.jpg",
imageAlt: "People, technology and leisure concept.",
},
id: "6", name: "Fernando Soler", handle: "@FloristeriaPrimavera", testimonial: "Nuestra floristería ha visto un aumento en pedidos online gracias a la nueva web de Pedro. El diseño es precioso y muy fácil de gestionar.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/people-technology-leisure-concept_273609-6599.jpg", imageAlt: "People, technology and leisure concept."},
{
id: "7",
name: "Sofía Ramos",
handle: "@ConsultoriaExito",
testimonial: "Desde la consultoría, necesitábamos una presencia online impecable. Pedro superó todas las expectativas, entregando una web muy profesional y efectiva.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-pretty-girl-with-clean-skin-perfect-smile-having-fun-coffee-shop_273609-9039.jpg",
imageAlt: "Indoor shot of pretty girl with clean skin and perfect smile having fun at coffee shop",
},
id: "7", name: "Sofía Ramos", handle: "@ConsultoriaExito", testimonial: "Desde la consultoría, necesitábamos una presencia online impecable. Pedro superó todas las expectativas, entregando una web muy profesional y efectiva.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-pretty-girl-with-clean-skin-perfect-smile-having-fun-coffee-shop_273609-9039.jpg", imageAlt: "Indoor shot of pretty girl with clean skin and perfect smile having fun at coffee shop"},
]}
showRating={true}
title="¿Qué dicen mis clientes?"
@@ -391,28 +237,17 @@ export default function LandingPage() {
description="Es el momento de descubrirlo. Solicita tu auditoría web gratuita hoy mismo y recibe una propuesta de mejora personalizada."
inputs={[
{
name: "name",
type: "text",
placeholder: "Tu Nombre",
required: true,
name: "name", type: "text", placeholder: "Tu Nombre", required: true,
},
{
name: "email",
type: "email",
placeholder: "Tu Email Profesional",
required: true,
name: "email", type: "email", placeholder: "Tu Email Profesional", required: true,
},
{
name: "businessType",
type: "text",
placeholder: "Tipo de Negocio (Ej. Clínica dental)",
required: true,
name: "businessType", type: "text", placeholder: "Tipo de Negocio (Ej. Clínica dental)", required: true,
},
]}
textarea={{
name: "message",
placeholder: "¿Algo más que quieras contarme sobre tu web?",
rows: 4,
name: "message", placeholder: "¿Algo más que quieras contarme sobre tu web?", rows: 4,
}}
imageSrc="http://img.b2bpic.net/free-photo/computer-monitors-office-desk-showing-data-analytics-dashboards_482257-126705.jpg"
imageAlt="Modern office desk with laptop displaying analytics"
@@ -430,19 +265,13 @@ export default function LandingPage() {
socialLinks={[
{
icon: Linkedin,
href: "https://linkedin.com/in/pedromonf",
ariaLabel: "LinkedIn",
},
href: "https://linkedin.com/in/pedromonf", ariaLabel: "LinkedIn"},
{
icon: Twitter,
href: "https://twitter.com/pedromonfdev",
ariaLabel: "Twitter",
},
href: "https://twitter.com/pedromonfdev", ariaLabel: "Twitter"},
{
icon: Github,
href: "https://github.com/pedromonf",
ariaLabel: "GitHub",
},
href: "https://github.com/pedromonf", ariaLabel: "GitHub"},
]}
/>
</div>