NODALOperaciones industriales conectadas
- Hero con video
- Scroll animado
Qué hace especial
- Hero con video
- Scroll animado
- Preguntas frecuentes
- Vídeo vertical del hero en bucle con póster y fotos distintas para escritorio y móvil
- Menú flotante de tres tarjetas con apertura escalonada (GSAP)
- Titulares con aparición por letras y desenfoque
- Galería de experiencias en anillo con arrastre e inercia
- Recorrido con trazo punteado al scroll (ScrollTrigger + MotionPath)
- Fotos con inclinación al mover el cursor
- Cierre tipográfico con letras que suben
- prefers-reduced-motion respetado
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 (9)
- Barra con logotipo Ceruna, «Find a cuddler» y menú visual de tres tarjetas
- Hero con vídeo vertical, titular en dos líneas y tarjetas de principios
- Galería de experiencias en anillo con arrastre
- «The experience»: titular editorial, fotografía recortada y panel translúcido con tres ideas
- Qué esperar, cómo funciona y enfoque, con animaciones al scroll
- Límites y seguridad sobre fondo oscuro
- Preguntas frecuentes en acordeón
- Cierre tipográfico «ceruna» completo y centrado, medido al ancho
- Páginas Sessions, Safety, Science, Pricing y Practitioners
Qué puedes personalizar
- Nombre, logotipo, títulos y descripciones (src/config/brand.ts y seo.json)
- Textos de sesiones, seguridad, ciencia y profesionales
- Experiencias y sus fotos
- Precios (se muestran al confirmarlos)
- Vídeo, póster y fotos del hero
- Tokens de color y tipografías
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 paquete y copia el prompt: tu herramienta de IA trabaja sobre sitio/ (monorepo; el sitio está en apps/marketing). `npm ci`, compila @spoon/api-client y @spoon/domain y ejecuta `VITE_SITE_MODE=public CERUNA_MARKETING_ONLY=1 node scripts/build-vercel.mjs` para obtener el mismo sitio que la demo. Cambia marca y textos desde src/config sin tocar el diseño. Es una demo de marketing: no incluye cuentas, reservas ni pagos operativos. Incluye REPRODUCCION.md con medidas y animaciones de la versión publicada.
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
- Node.js 24 y npm 11 para instalar con el lockfile incluido (monorepo con workspaces).
- Google Chrome solo para el build público con prerender (CHROME_PATH fuera de macOS); el desarrollo con Vite no lo necesita.
- Demo de marketing: cuentas, reservas, mensajes y pagos requieren backend e integración adicional. No es un servicio médico operativo.
- Las tipografías se cargan desde Google Fonts y Fontshare.
- No incluido: herramienta de IA (y sus créditos), dominio y hosting.
Tecnologías
- React
- Vite
- TypeScript
- Tailwind CSS
- GSAP
- Motion
Implementadas en el paquete que descargas.
React 19 · Vite 8 · TypeScript · Tailwind CSS 4 · GSAP 3 (ScrollTrigger, MotionPath) · framer-motion · Monorepo npm (workspaces, Node 24) · Prerender de páginas con Chrome headless
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
#f7f1e9#28192b#fdfaf5#a54a28#f2b966#256346
- General Sans (titulares)
- Figtree (texto, interfaz y logotipo)
Composición: Escritorio 1440 · tableta 768 · móvil 390, sin scroll horizontal; hero vertical 1080 × 1512
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.1.0: el monorepo que sirve la demo aprobada (sitio de marketing React/Vite, paquetes internos y lockfile), fotos WebP, vídeo del hero, favicon e identidad Ceruna; Figtree (OFL) y General Sans (ITF FFL) desde sus servicios. Avisos en LICENCIAS-Y-AVISOS.md.
- Versión
- v1.1.0 · Publicado 4 nov 2026
- Versiones
- v1.1.0 · 2026-11-05 — Versión 1.1.0: «The experience» rediseñada (composición editorial con fotografía y tres ideas), fondo continuo con «Safety & trust» sin juntas y wordmark del footer completo y centrado medido al ancho. Añade REPRODUCCION.md. Resto del sitio sin cambios.
- v1.0.0 · 2026-11-05 — Primera versión: monorepo del sitio aprobado con lockfile, fotos, vídeo del hero, identidad Ceruna, prompt, README y licencias.