Axis Runner 3D

Una landing page interactiva para una zapatilla de running ficticia ("Axis Runner"). Este proyecto combina renderizado 3D en tiempo real, texturas dinámicas y animaciones vinculadas al scroll.

🔗 Demo en vivo

axis.runner.3d.lancvip.online

✨ Características

• Modelo 3D Interactivo: Renderizado en tiempo real de una zapatilla usando WebGL y Three.js.
• Animaciones GSAP ScrollTrigger: La zapatilla gira, escala y responde dinámicamente al scroll de la página de forma fluida. Nunca se interpone en la lectura del texto.
• Selector de Materiales: Cambia las texturas del modelo 3D al instante mediante botones para visualizar diferentes colorways (Midnight Blue, Desert Sand, Urban Asphalt).
• Smooth Scrolling: Experiencia de desplazamiento sedosa impulsada por Lenis.
• Estética Editorial: Diseño moderno con tipografías de alto impacto, composición minimalista y modo oscuro premium.

🛠️ Tecnologías

• Three.js - Motor 3D (WebGL)
• GSAP (ScrollTrigger) - Coreografía de animaciones
• Lenis - Scroll suave nativo
• Vite - Entorno de desarrollo
• Vanilla JS & CSS3 - Lógica e interfaz

🚀 Instalación y Ejecución Local

Si deseas correr este proyecto en tu máquina:

1. Clona este repositorio:

   git clone https://github.com/Axel-the/axis-runner-3d.git

2. Ingresa al directorio:

   cd axis-runner-3d

3. Instala las dependencias (Node.js requerido):

   npm install

4. Inicia el servidor de desarrollo:

   npm run dev

5. Abre en tu navegador el puerto que te indique la terminal (por lo general http://localhost:5173/).