Monalisa hero animation tests

Pruebas localizadas para la animacion del mono con la sarten y la tortilla del hero principal. Incluye la version actual de monalisa.weltascorp.com y los prompts recuperados de Replicate cuando existen.

2026-06-29

Actual en monalisa.weltascorp.com: SVG + scroll

La version actual no es un video: usa el logo vectorizado en dos capas y Framer Motion ligado al scroll del hero.

Configuracion actual, sin prompt Replicate
Fuente: /root/tortillasmonalisa/frontend/src/pages/Home.jsx + home.css

No hay prompt de Replicate: esta animacion esta programada.

Capas:
- mono-base.svg: mono + sarten, intacto
- tortilla.svg: tortilla separada

Movimiento:
- rotateX: 0 -> 1080 grados (3 vueltas)
- y: 0% -> -150% -> 0%
- scale: 1 -> 1.06 -> 1
- controlado por scrollYProgress del heroRef

Pin:
- .ml-hero-track { height: 230vh }
- .ml-hero { position: sticky; top: 0; height: 100svh }

Nuevo v4: limpieza de artefactos + movimiento continuo

Correccion tras feedback: elimina el path suelto del mono, sustituye el recorte con pico por un simbolo limpio de tortilla y evita solapes de capas.

Metodo, sin prompt Replicate
No hay prompt de Replicate en esta v4.

Cambios frente a v3:
- se elimina la capa duplicada del mono que generaba solapes;
- se quita el path suelto incrustado en mono-base.svg;
- se reemplaza el recorte potrace de tortilla por un simbolo limpio en el mismo rojo;
- el giro se calcula frame a frame con JS para evitar saltos de keyframes;
- el flip nunca colapsa a una linea fina.

Pendiente:
- validar si la tortilla limpia se acepta como interpretacion fiel del logo;
- si se aprueba, ajustar escala/timing para integrarlo en el hero real.

Nuevo v3: SVG controlado + movimiento fisico

Prueba creada despues del feedback: tortilla exacta del logo, tres volteos, arco con mas aire y reaccion del mono/sarten sin redibujar la marca.

Metodo, sin prompt Replicate
No hay prompt de Replicate en esta v3: es una animacion vectorial determinista.

Decisiones:
- la tortilla es el SVG real del logo, no generada por IA;
- se mantiene el color y la silueta sin reinterpretacion realista;
- el volteo conserva 3 rotaciones;
- el arco tiene subida, apex breve y caida hacia la sarten;
- el mono tiene impulso, recoil y recepcion mediante transformaciones suaves;
- la sarten se refuerza con una capa recortada del mismo SVG para sugerir gesto sin redibujar el logo.

Pendiente si se aprueba:
- ajustar timing fino segun feedback;
- exportar a MP4/WebM o convertir el mismo movimiento a React/GSAP para el hero.

Replicate v2: pieza roja bloqueada

Nueva iteracion: evita llamar tortilla/food al objeto y lo fuerza como icono rojo del logo. Mejor color; revisar forma y suavidad.

Prompt Replicate
Modelo: kling-v1.6-standard
Fecha: 2026-07-01T17:24:14.696Z

Prompt:
Strict flat vector logo animation from the provided start image. The scene is a red brand mascot holding a frying pan on a warm cream background. Animate the mascot with subtle lively logo motion: a small natural body bounce, a slight arm movement, and a smooth pan toss, similar to a polished hand-drawn logo animation. IMPORTANT VISUAL RULE: the small flying object is NOT food for the AI to redesign. It is an immutable flat red brand icon cutout from the start image. Keep that flying red icon exactly the same solid red color and graphic design as the start image throughout the entire video: same silhouette, same white cutout holes, same flat red vector style, no orange, no yellow, no brown, no texture, no shadows, no realism, no new details. The flying red icon performs exactly three forward rotations while following one clean smooth arc up from the pan and back into the pan, matching the current SVG scroll animation timing. Preserve the original red mascot, pan, cream background, flat 2D vector look, and static camera. Clean loop-friendly result, no text, no watermark.

Input:
duration: 10
aspect_ratio: 16:9
cfg_scale: 0.2
start_image: https://file.weltas.es/ai-studio/monalisa-replicate-start-1280.png
negative_prompt: tortilla as food, omelette, food object, realistic food, orange, yellow, brown, golden, cooked texture, potato texture, egg texture, shaded object, textured object, photorealism, 3d render, color change, shape change, new silhouette, redesigned flying object, morphing, melting, warping, extra limbs, deformed mascot, changing logo, text, watermark, camera movement, zoom, background texture

Replicate v1: descartable por color

Primer intento con instrucciones directas. Movimiento aceptable, pero la tortilla se vuelve naranja/realista en varios frames.

Prompt Replicate
Modelo: kling-v1.6-standard
Fecha: 2026-07-01T17:19:33.291Z

Prompt:
Use the provided start image as a strict flat vector logo reference. Create a smooth 2D motion-graphics logo animation for Tortillas Monalisa. The red cartoon monkey may have a lively subtle hand-drawn motion: small natural body bounce, arm and frying pan movement, like the movement quality of a polished logo flip animation. The frying pan gently tosses the tortilla upward and catches it again. The tortilla motion must match the current SVG scroll animation: exactly three clean forward flips in the air, following one smooth arc upward and back down to the pan, with believable timing and easing. CRITICAL: the tortilla is not realistic food. It must remain the exact same flat red vector shape from the start image, with the same silhouette, same internal cutout details, same solid red color, no color change, no golden/yellow/brown color, no texture, no shading, no 3D, no photorealism. Keep the monkey and pan as the same solid red flat vector logo, on the same warm cream background. Static camera, no zoom, no text, no watermark, clean loop-friendly animation.

Input:
duration: 10
aspect_ratio: 16:9
cfg_scale: 0.35
start_image: https://file.weltas.es/ai-studio/monalisa-replicate-start-1280.png
negative_prompt: realistic tortilla, food photography, golden tortilla, yellow omelette, brown omelette, potato texture, egg texture, shading on tortilla, 3d render, photorealism, changing tortilla design, changing tortilla shape, changing tortilla color, morphing tortilla, melting, warping, extra limbs, deformed monkey, changing logo, text, watermark, camera movement, zoom, background texture, gradient shift

Export manual final: mono flip

Version posterior exportada como MP4/WebM, 900x504, 10.4s.

Prompt Replicate
No localizado en /root/ai-studio/storage/index.json.

Este archivo parece un export manual posterior, no un asset generado por /api/generate de ai-studio. Por tanto no hay prompt de Replicate registrado junto al MP4/WebM.

Kling: green screen 10s

Intento con fondo chroma verde uniforme. Tag: hero-anim-10s-greenscreen.

Abrir video directo
Prompt Replicate
Modelo: kling-v1.6-standard
Fecha: 2026-06-29T20:30:04.594Z

Prompt:
Flat 2D vector logo animation. A red cartoon monkey holds a frying pan and gently flips a round potato omelette: the omelette tosses up slowly, spins a smooth full flip in the air and lands softly back on the pan, then flips once more. Calm, smooth, looping motion-graphics. The monkey stays perfectly still and on-model, only the pan and the flying omelette move. Solid flat chroma green screen background, completely uniform, no texture, no gradient, no shadow. Solid flat red subject, clean vector look, no realism, no 3D.

Input:
duration: 10
aspect_ratio: 16:9
cfg_scale: 0.5
start_image: https://file.weltas.es/ai-studio/monalisa_startgreen_1782764787.png
negative_prompt: background texture, gradient, shadow on background, changing background color, distortion, morphing, melting, warping, deformed monkey, extra limbs, realistic, photo, 3d render, blurry, text, watermark, camera movement, zoom

Kling: logo en crema 5s

Intento con fondo crema y movimiento de volteo. Tag: hero-animacion-logo.

Abrir video directo
Prompt Replicate
Modelo: kling-v1.6-standard
Fecha: 2026-06-29T20:08:02.122Z

Prompt:
Flat 2D red logo animation on a cream background. The cartoon monkey holds the frying pan and flips the round potato omelette: the omelette tosses up, spins one full flip in the air and lands back on the pan. Smooth looping motion-graphics style, clean vector look, the monkey stays still and on-model, only the pan and the flying omelette move. Solid flat red color, no realism, no 3D.

Input:
duration: 5
aspect_ratio: 16:9
cfg_scale: 0.5
start_image: https://file.weltas.es/ai-studio/monalisa_startframe_1782763396466265364.png
negative_prompt: distortion, morphing, melting, warping, extra limbs, deformed monkey, realistic, photo, 3d render, blurry, text, watermark

Extra: corte de tortilla

No es el mono del hero, pero aparece en la tanda Monalisa como prueba de video de producto.

Abrir video directo
Prompt Replicate
Modelo: kling-v1.6-standard
Fecha: 2026-06-29T18:08:33.444Z

Prompt:
Cinematic slow motion close up of a knife slicing through a warm Spanish tortilla de patata, creamy center revealed, gentle steam rising, warm appetizing light, shallow depth of field, premium food cinematography, no people

Input:
duration: 5
aspect_ratio: 16:9
cfg_scale: 0.5