Transparencia alfa en video de Chrome
Chrome 31 ahora es compatible con la transparencia alfa de video en WebM.
En otras palabras, Chrome tiene en cuenta el canal alfa cuando se reproduce "pantalla verde". videos codificados en WebM (VP8 y VP9) con un canal alfa. Esto significa que puedes reproducir videos con fondos transparentes: sobre páginas web, imágenes o incluso sobre otros videos.
Hay una demostración en simpl.info/videoalpha; Algo surrealista y un poco áspero (literalmente), pero entiendes la idea.
Cómo crear videos alfa
El método que describimos usa las herramientas de código abierto Mergeer y ffmpeg:
- Filme a su sujeto frente a un fondo de un solo color, por ejemplo, una luz una cortina verde.
- Procesar el video para crear un conjunto de imágenes fijas PNG con transparencia de datos no estructurados.
- Codifica en formato de video (en este caso, WebM).
Existen además de herramientas propias para hacer el mismo trabajo, como Adobe After Effects, que puedes encontrar sea más simple.
1. Crear un video con pantalla verde
Primero, debes grabar al sujeto de manera que todo lo que aparezca en el se puede “quitar” el fondo (se hacen transparentes) mediante el procesamiento posterior.
La forma más fácil de hacerlo es filmar frente a un fondo de un solo color, como una pantalla o una cortina. El verde o el azul son los colores más usados, principalmente por su diferencia con los tonos de piel.
Existen varias guías en línea para filmar videos de pantalla verde (también conocidas como croma) y muchos lugares donde comprar productos verdes y fondos de pantalla azul. De manera alternativa, puedes pintar un fondo con pintura de clave de croma.
El corto de VFX del Gran Gatsby muestra cuánto se puede lograr con la pantalla verde.
Estas son algunas sugerencias para grabar:
- Asegúrate de que el sujeto no tenga prendas ni objetos del mismo color como fondo; de lo contrario, aparecerán como "agujeros" en el video final. Incluso los logotipos pequeños o las joyas pueden ser problemáticos.
- Usa una iluminación consistente y uniforme, y evita las sombras: el objetivo es tener la el menor rango de colores posible en el fondo que posteriormente deben ser transparentes.
- Usar varias luces difusas ayuda a evitar las sombras y el color de fondo variaciones.
- Evita los fondos brillantes: las superficies mates difuminan mejor la luz.
2. Crear video alfa sin procesar a partir del video de pantalla verde
En los siguientes pasos, se describe una manera de crear un video alfa sin procesar a partir de videos de pantalla verde:
- Cuando hayas filmado un video con pantalla verde, puedes usar una herramienta de código abierto, como Smoother, para convertirlo a un array de archivos PNG con datos alfa. Usa la combinación de colores de Combinador para eliminar la pantalla verde y hacerla transparente. (Ten en cuenta que PNG no es obligatorio: cualquier formato que conserve los datos del canal alfa está bien).
Convierte el array de archivos PNG en un video YUVA sin procesar usando una herramienta de código abierto. como ffmpeg:
ffmpeg -i image%04d.png -pix_fmt yuva420p video.rawDe forma alternativa, codifica los archivos directamente en WebM con un comando ffmpeg así:
ffmpeg -i image%04d.png output.webm
Si quieres agregar audio, puedes usar ffmpeg para combinarlo con un comando como esto:
ffmpeg -i image%04d.png -i audio.wav output.webm
3. Codifica video alfa a WebM
Los videos alfa sin procesar se pueden codificar para WebM de dos maneras.
Con ffmpeg, se agregó compatibilidad con ffmpeg para codificar videos alfa de WebM.
Usa ffmpeg con un video de entrada que incluya datos alfa y establece el formato de salida en WebM y la codificación se realizará automáticamente en el formato correcto según la especificación. (Nota: En este momento, deberás asegurarte de obtener la versión más reciente de ffmpeg del árbol de Git para esto funcione).
Comando de muestra:
ffmpeg -i myAlphaVideo.webm output.webmCon webm-tools:
git clone https://chromium.googlesource.com/webm/libvpxwebm-tools es un conjunto de herramientas sencillas de código abierto relacionadas con WebM, mantenido por los autores del proyecto WebM, que incluye una herramienta para crear videos WebM con transparencia alfa.
Ejecuta el objeto binario con
--helppara ver la lista de opciones compatibles con alpha_encoder.
4. Reproducción en Chrome
Para reproducir el archivo WebM codificado en Chrome, simplemente establece el archivo como la fuente de un video.
¿Cómo lo hizo?
Hablamos con el ingeniero de Google Vignesh Venkatasubramanian sobre su trabajo en el en un proyecto final. Resumió los principales desafíos involucrados:
- El flujo de bits de VP8 no era compatible con el canal alfa. Así que tuvimos que incorporar alfa sin interrumpir el flujo de bits de VP8 y sin interrumpir el flujo existente jugadores.
- El procesador de Chrome no pudo procesar los videos con la versión alfa.
- Chrome tiene varias rutas de procesamiento para varios dispositivos de hardware o GPU. Cada se tuvo que cambiar la ruta de acceso para admitir la renderización de videos alfa.
Podemos pensar en muchos casos de uso interesantes para la transparencia alfa de video: juegos, videos interactivos, narración colaborativa (agrega tu propio video a una videos/imágenes de fondo), videos con personajes o tramas alternativos, aplicaciones web que usan componentes de video superpuesto.
¡Feliz producción de películas! Cuéntanos si creas algo asombroso con la versión alfa para mantener la transparencia de la organización.