Descripción del proyecto
Sitio público de Architex, una agencia de marketing digital. Incluye home con hero, catálogo de servicios, portafolio, testimonios y formulario de contacto, además de páginas de detalle por servicio con secciones de overview, características, proceso, FAQ y CTA. Implementa internacionalización española e inglesa con next-intl, contenido cargado desde módulos de datos JSON, animaciones con Motion, contacto directo vía WhatsApp y métricas en Vercel Analytics / Speed Insights. SEO reforzado con metadatos por idioma, datos estructurados (JSON-LD) y preload de imagen del hero.
Características principales
App Router de Next.js 16 con rutas localizadas `[locale]` y mensajes en JSON para español e inglés gestionados con next-intl
Home con hero, grilla de servicios, portafolio con modal de galería, testimonios con modal y formulario de contacto integrado con WhatsApp
Páginas de detalle por servicio (`/services/[serviceId]`) con hero, overview, features, proceso, stats, FAQ y CTA
API Routes internas para exponer el catálogo de servicios y portafolio desde data modules tipados
Animaciones de entrada y micro-interacciones con Motion y proveedor centralizado para reducir el bundle de cliente
SEO con metadatos por locale, datos estructurados (StructuredData) y preload prioritario de la imagen del hero
UI con Tailwind CSS 4 e iconos de Lucide; menú móvil, navegación sticky y switch de idioma accesibles
Telemetría con Vercel Analytics y Speed Insights cargados de forma diferida para no penalizar el LCP
Desafíos y soluciones
Internacionalización con contenido rico
Coordinar diccionarios de next-intl con módulos de datos JSON (servicios, detalles, portafolio, testimonios) para que cada locale comparta estructura sin duplicar layout ni romper el SEO de URLs por idioma.
Rendimiento en una landing visual
Una agencia necesita un sitio vistoso sin sacrificar Core Web Vitals: se difieren scripts de analítica, se hace preload del hero, se segmentan animaciones de Motion y se evita JS innecesario en componentes server.
Páginas de detalle escalables por servicio
Cada servicio tiene secciones reutilizables (overview, features, proceso, FAQ, CTA) alimentadas desde data modules, para añadir nuevas líneas de servicio sin tocar la UI.
Capturas de pantalla
Tecnologías utilizadas
Otros proyectos
Leberp — ecosistema ERP
ERP cloud B2B (ventas, almacén, logística, tesorería, compras, analítica y POS): SPA en React, cliente de mostrador en Electron y backend .NET en Azure.
Sitio web — extensiones de pestañas
Web estática y marketing local para un negocio de belleza: servicios, precios, contacto, mapa y contenido bilingüe (inglés / español).