GTA VI Landing Page es una recreación del efecto de scroll del sitio oficial de Rockstar Games. Me interesaba entender cómo se logra una entrada tan cinematográfica usando máscaras, escala y animaciones sincronizadas con el desplazamiento.

El mayor reto fue hacer que el logo funcionara como una ventana que revela el contenido, combinando GSAP, ScrollTrigger, CSS masks y clip-path. Fue un ejercicio muy útil para practicar animaciones más ambiciosas sin perder control sobre la secuencia.

## Stack & decisiones

Astro — Lo usé como base para estructurar la landing y concentrar la complejidad en las animaciones.
GSAP y ScrollTrigger — Me permitieron controlar el zoom, las transiciones y el ritmo de la experiencia según el avance del scroll.
CSS Masks y clip-path — Fueron la parte central del efecto: revelar contenido a través del logo y crear transiciones con sensación cinematográfica.

## Qué construí

Construí una máscara con el logo de GTA VI usando mask-image, mask-position y mask-size animados con GSAP.
Trabajé transiciones con clip-path para crear un revelado tipo cortina y reforzar la sensación de trailer interactivo.
Aprendí a combinar CSS avanzado con timelines para que una animación compleja fuera más fácil de ajustar.

Alansan.dev

GTA VI Landing Page 🚨

## Stack & decisiones

## Qué construí

## Sigue explorando