SaviaTienda editorial
- Scroll animado
- Filtros de productos
Nuevo
Qué hace especial
- Hero con video
- Scroll animado
- Carrito
- Carrusel
- Formulario demo
- Vídeo del hero con deformación WebGL según el cursor
- Animaciones de scroll con GSAP en «Nuestra historia» (capítulos, carrusel arrastrable, pila de fotos)
- Menú a pantalla completa, galería y visor de producto
Qué incluye
- Prompt para recrear y personalizar el diseño con IA.
- Código y archivos del sitio: imágenes, fuentes y licencias.
- Demo interactiva e instrucciones.
- Uso en sitios propios y proyectos finales de clientes.
Secciones y pantallas de la demo (6)
- Portada con vídeo a pantalla completa que se deforma al mover el cursor, titular y acceso a la colección
- Colección y páginas de colección
- Fichas con galería, visor a pantalla completa, color, tallas (con agotadas), cantidad y barra de compra fija en móvil
- Bolsa de demostración guardada en el navegador, con cuenta atrás y barra de progreso simuladas
- Menú a pantalla completa, novedades y contacto con formularios de demostración
- «Nuestra historia» con capítulos, carrusel arrastrable y pila de fotos animados con el scroll
Qué puedes personalizar
- Fotos y vídeo con la misma proporción, regenerando sus variantes (ver REPRODUCCION.md)
- Productos del catálogo de demostración (js/flo-demo-catalog.js)
- Textos de las páginas
Cómo empezar
- Copia el prompt y descarga los archivos.
- Llévalos a tu herramienta de IA y pide los cambios: marca, textos e imágenes.
- Revisa el resultado y publícalo en tu dominio.
Descarga el proyecto y copia el prompt: tu herramienta de IA trabaja sobre piloto-12-rit-ropa-en-movimiento/ con REPRODUCCION.md, recreacion-spec.json y LICENCIAS-Y-AVISOS.md. Ejecuta node sitio/servidor-demo.mjs y revisa el sitio sin cambios antes de sustituir fotos, productos o textos.
El resultado depende de tu herramienta de IA y de los cambios que hagas. La demo muestra la dirección visual.
Detalles técnicos y requisitos
Requisitos
- Servidor estático con URLs limpias y las reescrituras de vercel.json (incluye sitio/servidor-demo.mjs).
- Todo es de demostración: sin pagos, pedidos, stock real, envíos ni formularios conectados; no se conecta a ninguna tienda.
- El vídeo del hero no es un bucle perfecto: la unión se suaviza con un fundido breve.
- Tipografías Cy Grotesk Key y Unnamed comerciales: para publicar tu sitio necesitas tu propia licencia o sustituirlas.
- No incluido: herramienta de IA (y sus créditos), dominio y hosting.
Tecnologías
- HTML, CSS y JavaScript
- GSAP
- WebGL
Implementadas en el paquete que descargas.
HTML, CSS y JavaScript estáticos (export de Webflow con capas propias) · GSAP 3.12.5 y jQuery 3.5.1 · WebGL en el hero
Herramientas de IA sugeridas
ClaudeCodexCursor
Compatibles con las instrucciones del diseño; no es una prueba registrada.
Compatibilidad probada: Sin prueba registrada todavía.
Paleta y tipografía
#2E201E#FFF1E8
- Cy Grotesk Key Bold/Demi/Medium (incluida; licencia comercial)
- Unnamed Light (incluida)
- Roboto Mono (SIL OFL 1.1, incluida)
Composición: Probado a 1440, 768 y 390 px
Licencia y versiones
Úsalo en sitios propios y en proyectos finales de clientes, incluido uso comercial. No revendas ni redistribuyas el prompt, los archivos ni el sitio como plantilla. Leer la licencia
Procedencia: Paquete v1.0.1 = entrega rit-2026-11-11-r7 (ZIP de la sesión Piloto 12, SHA-256 223c250e…): sitio completo con medios, tipografías y servidor. Avisos en LICENCIAS-Y-AVISOS.md.
- Versión
- v1.0.1 · Publicado 11 nov 2026
- Versiones
- v1.0.1 · 2026-11-11 — RIT 1.0.1 (r7): el vídeo del hero conserva la distorsión WebGL cuando se sirve desde otro dominio (crossorigin) y el menú vuelve a incluir «Nuestra historia». Diseño, medios e interacciones sin cambios. Versión anterior 1.0.0 conservada.
- v1.0.0 · 2026-11-11 — Primera versión en Arrmma: RIT r6 (rit-2026-11-11-r6), con tipografías no usadas retiradas y copy revisado. Diseño, medios e interacciones sin cambios.