Cómo hacer que un PNG se mueva: keyframes, PNGtubers, IA o un rig
Por el equipo de Charmotion · Actualizado el
Para hacer que un PNG se mueva, elige según el resultado. Para deslizamientos, rebotes y giros, crea keyframes de posición, escala y rotación en un editor de video como CapCut, DaVinci Resolve o Premiere. Para un avatar de stream que se mueva cuando hablas, usa una app de PNGtuber. La conversión de imagen a video con IA inventa movimiento nuevo, pero vuelve a dibujar la imagen. Para un personaje que parpadee y salude, riggéalo.
Puntos clave
- Los keyframes mueven el PNG completo (deslizar, rebotar, girar), pero no pueden hacer que un brazo salude.
- Las apps de PNGtuber como veadotube reaccionan a tu micrófono; eso es algo distinto de una animación en loop.
- La conversión de imagen a video con IA genera fotogramas nuevos, así que tu personaje puede cambiar de un fotograma a otro.
- Las herramientas basadas en rigs mueven partes de tu imagen exacta y hacen loops limpios, algo ideal para mascotas de marca y logos.
- Exporta MP4 para redes sociales, GIF para chat y correo electrónico, y WebM o MOV con canal alfa cuando tenga que flotar sobre otra cosa.
¿Ya tienes un personaje o logo? Mira tu personaje en pantallas reales de una app: pantallas de splash, onboarding, carga y estado vacío. Es gratis, funciona en tu navegador y no sube nada.
¿Qué método debo usar para hacer que mi PNG se mueva?
| Método | Qué se mueve | Conserva tu arte | Ideal para |
|---|---|---|---|
| Keyframes en un editor (CapCut, DaVinci Resolve, Premiere, After Effects) | La imagen completa: posición, escala, rotación, opacidad | Yes | Revelaciones de logo, stickers que entran deslizándose en un video, rebotes simples |
| App de PNGtuber | Cambia o sacude la imagen mientras hablas | Yes | Streaming y llamadas |
| IA de imagen a video | Todo lo que invente el modelo | No, los fotogramas se generan | Clips puntuales para redes, tomas conceptuales |
| Animación de personaje con rig | Partes de la imagen: los ojos parpadean, los brazos saludan, el cuerpo se aplasta | Yes | Mascotas de marca, personajes de apps, GIF en loop y video con fondo transparente |
La prueba más rápida: si puedes describir el movimiento como «la imagen se mueve», usa keyframes. Si es «el personaje se mueve», necesitas un rig o un generador.
¿Cómo hago que un PNG se mueva con keyframes?
Todos los editores de video funcionan igual. Defines el valor de una propiedad en un momento, mueves el cabezal de reproducción, cambias el valor y el editor completa los fotogramas intermedios. La ayuda de Premiere Pro de Adobe lo describe así: mueve el cabezal «al punto en el tiempo donde quieres agregar un keyframe» y luego ajusta el valor de la propiedad «para crear automáticamente un keyframe en el momento actual». CapCut coloca un botón de keyframe con forma de rombo junto a Posición, Escala, Rotación y Opacidad.
- Importa el PNG y colócalo en una pista por encima de tu fondo o video.
- Selecciónalo y agrega un keyframe de Posición (y de Escala o Rotación) al inicio.
- Mueve el cabezal un segundo más adelante y cambia el valor; aparecerá un segundo keyframe.
- Suaviza el movimiento (ease in/out o una curva de velocidad) para que no arranque ni se detenga de forma mecánica.
- Para un loop, haz que el último keyframe coincida con el primero.
El problema está en la exportación. Un MP4 en H.264 no admite transparencia, así que si el PNG en movimiento tiene que flotar sobre otra cosa más adelante, exporta en ProRes 4444 o como secuencia de PNG, o en WebM con canal alfa si tu editor lo permite. Tienes toda la información en MP4 transparente y HEVC con alfa.
¿Cómo hago que un PNG se mueva cuando hablo?
Para eso existen las apps de PNGtuber. veadotube, por ejemplo, se describe como «una colección de herramientas para títeres virtuales»: eliges tu micrófono y el avatar puede «sacudirse o saltar cuando habla», con espacios adicionales para distintas expresiones que cambias con atajos de teclado, mouse, gamepad o MIDI. Su versión mini es gratis en itch.io para Windows, Linux y macOS.
La configuración habitual son dos PNG (boca cerrada y boca abierta) o unas pocas expresiones, con la salida de la app agregada a OBS como fuente. Esto reacciona en vivo a tu voz, algo que un loop prerrenderizado no puede hacer.
Si en cambio quieres una mascota para tu stream que esté en reposo (idle) en una esquina y reproduzca reacciones con cada follow o suscripción, consulta overlays de mascota en OBS.
¿Puede la IA hacer que mi PNG se mueva?
Sí. Los modelos de imagen a video toman tu PNG como primer fotograma y un prompt de texto para el movimiento. Runway recomienda describir el movimiento que quieres, y sus clips son cortos. El resultado puede ser impresionante para una publicación puntual.
Hay tres límites importantes para personajes y logos:
- Los fotogramas se generan, no se mueven. Las caras, el texto, el grosor de línea y los colores pueden cambiar.
- Los loops casi nunca cierran. El último fotograma no suele coincidir con el primero, así que un GIF en loop da un salto.
- Los fondos casi siempre se rellenan. La mayoría de los resultados de imagen a video son un MP4 opaco, aunque tu PNG fuera transparente.
Si la imagen es un recurso de marca que debe mantenerse exacto, revisa el resultado fotograma por fotograma antes de publicarlo.
¿Cómo convierto el PNG de un personaje en un GIF en loop o en un video con fondo transparente?
Riggéalo. Un rig divide la imagen en partes (cabeza, ojos, brazos, cuerpo), las une a huesos o a una malla y anima esas partes con keyframes. El movimiento puede hacer un loop perfecto porque la primera y la última pose son idénticas, y cada fotograma sigue siendo tu arte. Puedes hacerlo a mano en el editor de Rive o en After Effects.
Charmotion lo automatiza para un PNG, JPEG o WebP de al menos 512 px: el arte plano recibe un rig vectorial, y el arte 3D o con degradados se anima a partir de sus propios píxeles, fiel a su diseño. Normalmente obtienes 17 animaciones en minutos. Cada set incluye el .riv interactivo y el código, y exporta MP4 a 1080×1080, un video 9:16 y vistas previas GIF de 480 px sobre fondo sólido, además de WebM y MOV transparentes, bajo demanda en aproximadamente un minuto (planes de pago, desde $20/mes). Charmotion no crea GIF con transparencia; si necesitas uno, convierte el WebM transparente con los comandos de PNG a GIF animado transparente.
Preguntas frecuentes
¿Cómo hago que un PNG se mueva en CapCut?
Agrega el PNG como overlay encima de tu video, selecciónalo y haz clic en el rombo de keyframe junto a Posición, Escala o Rotación. Mueve el cabezal, cambia el valor y CapCut agregará un segundo keyframe y animará el tramo entre ambos. Usa la curva de velocidad para suavizar el movimiento.
¿Cómo hago que un PNG se mueva en OBS?
OBS muestra fuentes; no anima una imagen fija por sí solo. Usa una app de PNGtuber y captura su salida, o agrega un archivo animado, como un WebM con fondo transparente en una Fuente multimedia (Media Source), con la opción Loop activada.
¿Una herramienta de video con IA mantendrá mi PNG exactamente igual?
No de forma fiable. Los modelos de imagen a video generan cada fotograma, así que detalles como las caras, el texto y los colores pueden cambiar durante el clip. Para recursos de marca, usa keyframes o un rig, que mueven tus píxeles originales en lugar de volver a dibujarlos.
Fuentes
- Add keyframes in Premiere Pro, Adobe
- How to add keyframes in CapCut PC, CapCut
- veadotube, olmewe and BELLA!
- Getting Started with Generative Video, Runway
- Media Sources, OBS Knowledge Base