GTA VI Landing Page
#Animation
#GSAP
#ScrollTrigger
#UI
#Masks
Recreación del efecto scroll icónico del sitio oficial de Rockstar Games
GTA VI Landing Page es una recreación del sitio oficial de GTA VI de Rockstar Games, replicando el icónico efecto de scroll animado. El proyecto utiliza GSAP (GreenSock Animation Platform) y ScrollTrigger para crear animaciones fluidas y sincronizadas con el scroll del usuario.
El desafío principal fue implementar el efecto de máscara con el logo de GTA VI que actúa como una ventana revelando el contenido, junto con animaciones secuenciales de zoom, transiciones de tamaño y efectos de clip-path con Css.
Implementaciones
- Efecto de máscara CSS con logo de GTA VI que revela el contenido usando mask-image, mask-position y mask-size animados con GSAP.
- Efectos de clip-path tipo cortina: transición elíptica del footer desde 'ellipse(60% 0% at 50% 190%)' hasta 'ellipse(60% 100% at 50% -100%)' para efecto de revelado y desvanecimiento.