David Segura
EN
Volver a la galería

Xtelar — Landing DeepTech con i18n

Sitio de marketing bilingüe para una subsidiaria DeepTech que cubre radar, satélites y drones.

Next.js 15React 19TypeScriptTailwindFramer Motioni18nLandingDeepTechSEO

Contexto

Xtelar es el brazo DeepTech del grupo Xori — enfocado en sistemas de radar, identificación satelital y drones, con sectores que abarcan defensa, gobierno y empresa. El landing tenía que comunicar profundidad técnica sin perder accesibilidad, y shippear en español e inglés desde el día uno.

Lo que construí

  • Sitio en Next.js 15 + React 19 + TypeScript, App Router, espejando el approach arquitectónico que asentamos para el landing de Xori Space.
  • Capa custom de i18n vía un LanguageContext + hook t(key) — sin librería — manteniendo el bundle liviano y el switch instantáneo.
  • Hero cinematográfico: slideshow manejado con AnimatePresence sobre tres assets (scanner radar, satélite, drone) con timing de crossfade calibrado para que la imagen respire sin distraer de la copia ni los CTAs.
  • Composición seccionada: Hero, About, Systems, Business Units, Philosophy, Sectors, Roadmap, CTA Final, Footer — mismo patrón de aislamiento que en Xori, optimizado para iterar copia rápido.
  • Conversión vía WhatsApp: los CTAs principales enrutan a un número de WhatsApp en vez de un form de contacto, alineado al motion de ventas B2B en LATAM.

Lo destacable

  • Paridad two-language: cada sección lee su copia del mismo mapa de traducciones, así el switch de idioma nunca se desincroniza.
  • Budget de performance respetado: imágenes en AVIF + WebP, priority solo en el logo visible inmediatamente, listo para export estático.
  • Arquitectura reutilizable: el patrón de secciones armado para Xori Space se transfirió 1:1, recortando dramáticamente el setup time de Xtelar.

Stack

Next.js 15 · React 19 · TypeScript · Tailwind CSS · Framer Motion · Phosphor Icons · i18n custom (Context + hook)