GR Cup Frontend
Sorteo Publico - Experiencia Cinematica
Frontend publico para el sorteo del GR Cup 2026. Combina una landing con animaciones de scroll frame-by-frame (313 frames desplegados progresivamente), un compositor de video Remotion + HyperFrames y un sistema completo de compra de tickets con Stripe. Construido con React 18, Vite, TypeScript, Tailwind CSS, Three.js, html5-qrcode y jsPDF. Accesible, responsive y preparado para soportar miles de usuarios concurrentes.
Tecnologías utilizadas
Front-end
Tailwind CSS
Responsive DesignDevOps
VPSHerramientas
JotaiFuncionalidades principales
Landing cinematica del sorteo
Hero del sorteo benefico de un cinturon SBD con composicion cinematica scroll-driven (313 frames de un trofeo desplegados con Remotion + HyperFrames). Look de trailer para captar participantes.
Como participar en 3 pasos
Timeline visual del flujo: elige tus boletos (0,50 € cada uno), rellena tus datos y sigue la cuenta en Instagram para ser elegible.
Compra de tickets con Stripe
Selector de cantidad con precio total en vivo, formulario de datos y pago seguro con Stripe Checkout, mas confirmacion de seguir en Instagram.
Inscripcion al sorteo
Pantalla de inscripcion con el estado del evento (proximamente) y enlace directo a Instagram para mantenerse informado.
Horarios de la competicion
Tabla de horarios por dia, categoria y peso (masculino/femenino) con franjas horarias claras.
Como llegar - localizacion
Pabellon Municipal de Almusafes con galeria de fotos del recinto e indicaciones para llegar.
Bases legales del concurso
Politica del concurso, terminos de servicio, privacidad y consentimiento de datos en paginas dedicadas.
Diseno responsive
Experiencia mobile-first: navbar con menu, hero del sorteo y checkout adaptados a cualquier pantalla.
Campeonato AEP2 regional
Seccion del home que presenta el campeonato de powerlifting AEP2 regional de Valencia, Murcia y Baleares (1-2 mayo 2026) con sus patrocinadores.
Premios por movimiento
Premio para los mejores en cada movimiento (sentadilla, press de banca y peso muerto) con fotografias de competicion.
Organizacion y equipamiento
Jueces y cargadores certificados AEP, plataforma y rack de competicion con acceso para el publico, y estructura para que cada entrenador siga de cerca a sus atletas.
Categorias de peso
Categorias de peso masculinas y femeninas de la competicion, con acceso a las marcas minimas para clasificar.
Galería de imágenes