Saltar al contenido
Gataca Sites

GATACA / PÁGINA

Mercurio Gooey Navigation

Navegación líquida con una microinteracción precisa

Mercurio Gooey Navigation convierte un menú horizontal compacto en una sección de navegación con personalidad propia. Dos manchas superpuestas se desplazan bajo cada opción y el filtro SVG gooey las fusiona visualmente para crear una estela líquida suave.

Al pasar el cursor o entrar con teclado, el indicador acompaña al elemento enfocado. Al hacer clic, el nuevo elemento pasa a ser el activo y la mancha principal ejecuta un pequeño rebote elástico. Cuando el usuario abandona el menú, el indicador vuelve automáticamente a la opción seleccionada.

El recurso está construido con HTML, CSS, SVG y JavaScript nativos, usa Manrope 600/700 y contempla navegación por teclado, prefers-reduced-motion y ajustes específicos para móvil.

GATACA / PÁGINA

NEON PALMS 96 Cyberpunk Hero

Una noche digital que empieza antes de mostrar el titular

NEON PALMS 96 mezcla una paleta azul marino, verde manzana y rosa fucsia con palmeras vectoriales, horizonte de rejilla, sol fragmentado y referencias gráficas de los noventa. La composición presenta un estudio creativo dedicado a estrategia, identidad y experiencias digitales.

Una introducción breve carga la señal visual y después revela progresivamente la cabecera, las tres líneas del H1, el texto, los botones y el panel lateral. El fondo mantiene movimiento mediante la rejilla, el sol, las palmeras y el disco central, con ritmos distintos para crear profundidad sin vídeo ni recursos externos.

En móvil el contenido se apila y conserva el contraste. Si el usuario solicita reducir el movimiento, la introducción se omite y todo el contenido aparece de inmediato. El recurso incluye demo HTML/CSS/JavaScript, previsualización y Prompt Maestro.

GATACA / PÁGINA

NOCTIS Astronomy Landing

Una landing ilustrada para mirar más allá de lo visible

NOCTIS Astronomy Landing recrea una dirección artística nocturna basada en ilustración vectorial: cielo violeta, colinas en silueta, luna, árbol, farola, personajes, planetas e iconografía temática construidos directamente con SVG y CSS.

La landing cambia por completo los textos del diseño de referencia y desarrolla un concepto editorial en español alrededor de la observación astronómica. El recorrido incluye hero, marcas ficticias, archivo de contenidos, dos bloques narrativos con ilustraciones y footer visual.

La tipografía combina una familia condensada de alto contraste para titulares con una sans serif limpia para lectura. La paleta se apoya en violeta profundo, azul eléctrico, cian y luz marfil. En móvil la navegación se transforma en menú hamburguesa a pantalla completa y todos los vectores se reencuadran para conservar legibilidad.