Desarrollo web
Arena Sport — Centro de Deportes Acuáticos
Experiencia inmersiva con 3D y animaciones para explorar y reservar deportes acuáticos
- Cliente
- Arena Sport
- Ubicación
- Coveñas, Colombia
- Duración
- 3 meses
- Estado
- Completado
Galería del Proyecto
Stack Tecnológico
- Next.js 16
- React 19
- TypeScript
- Tailwind CSS 4
- Three.js
- React Three Fiber
- Drei
- GSAP
- Framer Motion
Descripción Detallada
Sitio web inmersivo para un centro de deportes acuáticos donde los usuarios exploran y reservan experiencias como kitesurf, wakeboard, windsurf, paddle SUP y jetski. Una experiencia de marca completa con animaciones fluidas, gráficos 3D y páginas de detalle dinámicas por actividad.
El Desafío
Crear una presencia digital que capturara la adrenalina y el ambiente del deporte acuático, mientras funcionaba como plataforma de conversión real: catálogo de actividades, páginas de detalle por experiencia, información de instructores, puntos de encuentro y precios — todo con una arquitectura escalable y mantenible.
Nuestra Solución
Desarrollado con Next.js 16 (App Router) y React 19 con TypeScript. Las páginas de detalle se generan dinámicamente por actividad mediante rutas [slug], alimentadas por un modelo de datos tipado (Activity) que centraliza todo el catálogo. Los elementos 3D interactivos se construyeron con Three.js, React Three Fiber y Drei. Las animaciones y micro-interacciones se implementaron con GSAP y Framer Motion. El sistema de diseño usa Tailwind CSS v4 con tipografías Fraunces + DM Sans optimizadas con next/font. Cada página de actividad incluye galería, instructor, punto de encuentro con mapa embebido de OpenStreetMap, precios y valoraciones.
Resultados Obtenidos
Landing page inmersiva con secciones animadas (hero, intro, experiencias, actividades, contacto), catálogo completo de 5 deportes acuáticos con páginas de detalle dinámicas, arquitectura data-driven escalable con modelo tipado, diseño responsive con enfoque en conversión y experiencia de usuario.
Explora Más Proyectos
Ver Todos los Proyectos¿Listo para empezar?
¿Buscas la mejor solución tecnológica?
Transformamos tus ideas en soluciones digitales innovadoras que impulsan el crecimiento de tu negocio.
¡Contáctanos por WhatsApp!