Tutorial: usar /video/merge para crear presentaciones de video

Tyler McAllister

Redactor técnico · Trondheim, Noruega · Mostrar bio

Un tutorial de /video/merge

Hace poco presenté el Robot /video/merge mediante un caso de uso de ejemplo en el que se fusionan video y sonido, con la ayuda del parámetro audio_delay. Ahora he decidido presentar un tutorial más detallado, combinando el mismo Robot con algunos de los otros potentes Robots disponibles en Transloadit.

Esta vez cubriremos otro caso de uso único: crear una presentación de video compuesta por varias imágenes y fusionarla con una grabación de audio. Recorreré cada paso de principio a fin, antes de presentar el resultado final.

Preparación de nuestros archivos

Como de costumbre, antes de crear nuestra Assembly, necesitamos preparar los archivos necesarios. Como ejemplo práctico, convertiré secciones de un documento PDF en una presentación coherente. En concreto, una de las hojas de referencia sobre aprendizaje automático⁠ que ofrece la Universidad de Stanford. Quiero combinar las páginas del PDF para crear un video y luego narrar sobre ese video. Algo un poco educativo para mí, de cara a un trabajo que tengo próximamente 😉

Después de eso, almacenaremos el resultado en Dropbox, para poder acceder a él en cualquier momento.

Un vistazo a los Robots

Vamos al grano y echemos un vistazo rápido a todos los Robots que nos serán útiles en esta Assembly:

• /upload/handle
• /http/import
• /document/thumbs
• /video/merge
• /dropbox/store

De la importación del archivo de audio grabado se encargará el Robot /upload/handle, mientras que el archivo PDF lo importará el Robot /http/import. Luego usamos el Robot /document/thumbs para generar imágenes a partir de nuestro archivo PDF, tras lo cual el Robot /video/merge unirá todas las imágenes en un archivo de video principal. Por último, el Robot /dropbox/store, uno de mis favoritos de siempre, ¡me permitirá almacenar el resultado final!

Parte 1 - Importar nuestros archivos

Aquí tienes un vistazo a los dos primeros Steps del Template que creé. Uno para subir y otro para importar por HTTP:

{
"steps": {
  ":original": {
    "robot": "/upload/handle"
  },
  "document": {
    "robot": "/http/import",
    "url": "https://github.com/afshinea/stanford-cs-229-machine-learning/raw/master/en/cheatsheet-supervised-learning.pdf"
  }
}
}

Primero, necesitamos mi archivo de audio grabado. Voy a usar el Robot /upload/handle, un Robot sencillo que me facilitará subir mediante código un archivo local desde mi máquina. ¡Te recomiendo leer nuestra reciente publicación de Re-loadit EN (English) para conocer más a fondo este Robot!

Una vez que tenemos el archivo de audio, podemos usar el Robot /http/import para acceder directamente al enlace del repositorio de GitHub que mencioné antes. El Robot obtendrá el archivo PDF desde el enlace y nos permitirá hacer con él lo que queramos en cualquier Step posterior de la Assembly.

Parte 2 - Generar imágenes a partir del PDF

Nuestro tercer Step en la Assembly, después de importar los archivos, consiste en usar el Robot /document/thumbs. Este Step se ve así en mis Assembly Instructions:

{
"thumbnail": {
  "use": [
    "document"
  ],
  "robot": "/document/thumbs",
  "result": true,
  "resize_strategy": "fit"
}
}

Ahora el Robot generará varias imágenes para cada página. Configuré el parámetro result en true, para poder ir a la página de Assemblies y comprobar si el Robot ha dividido las imágenes como quiero. El resize_strategy está configurado como 'fit' en este ejemplo, lo que significa que nuestras imágenes conservarán su relación de aspecto y se redimensionarán según el lado más largo de la imagen.

Parte 3 - Fusionar todo

En el cuarto Step, el Robot /video/merge empieza a desempeñar un papel importante. Tomamos los Steps de miniaturas y de grabación del Template y se los pasamos al Robot para que los use en la fusión.

{
"merged": {
  "use": {
    "steps": [
      {
        "name": ":original",
        "as": "audio"
      },
      {
        "name": "thumbnail",
        "as": "image"
      }
    ],
    "bundle_steps": true
  },
  "robot": "/video/merge",
  "result": true,
  "duration": 40,
  "ffmpeg_stack": "v7",
  "framerate": "1/10",
  "preset": "webm-1080p",
  "resize_strategy": "fit"
}
}

Se usan dos Steps para el proceso de fusión. Mi archivo de audio, conocido como :original de la Parte 1, y el conjunto de imágenes creadas a partir de mi archivo PDF, thumbnail de la Parte 2. El PDF que estoy usando tiene cuatro páginas en total y sería buena idea mostrar cada imagen en pantalla durante al menos diez segundos: tienen bastante contenido.

Por eso, establecí el parámetro duration en 40 segundos y el framerate en 1/10, lo que significa que aparecerá una nueva imagen cada diez segundos. WebM es un formato práctico que recomiendo por su menor tamaño en comparación con MP4, así que lo configuraremos aquí mediante el parámetro preset. Esto debería fusionar correctamente nuestro audio e imágenes en un único video.

Parte 4 - El resultado final

Por último, el quinto y último Step de mi Assembly consiste en exportar los resultados a Dropbox. El Step exported usa el Step merged, de modo que sabe qué archivo queremos usar para la exportación. Mis credenciales de Template me dan acceso a mi Dropbox a través de mi Assembly, tras lo cual el parámetro path especifica el nombre de mi video resultante y dónde quiero almacenarlo. Aquí, ${file.id} nos da un ID único de 32 caracteres, así que no hay posibilidad de conflictos cuando exporto mis resultados.

{
"steps": {
  ":original": {
    "robot": "/upload/handle"
  },
  "document": {
    "robot": "/http/import",
    "url": "https://github.com/afshinea/stanford-cs-229-machine-learning/raw/master/en/cheatsheet-supervised-learning.pdf"
  },
  "thumbnail": {
    "use": [
      "document"
    ],
    "robot": "/document/thumbs",
    "result": true,
    "resize_strategy": "fit"
  },
  "merged": {
    "use": {
      "steps": [
        {
          "name": ":original",
          "as": "audio"
        },
        {
          "name": "thumbnail",
          "as": "image"
        }
      ],
      "bundle_steps": true
    },
    "robot": "/video/merge",
    "result": true,
    "duration": 40,
    "ffmpeg_stack": "v7",
    "framerate": "1/10",
    "preset": "webm-1080p",
    "resize_strategy": "fit"
  },
  "exported": {
    "use": [
      "merged"
    ],
    "robot": "/dropbox/store",
    "credentials": "my_videos",
    "path": "Videos/${file.id}.${file.ext}"
  }
}
}

El archivo de video producido por este Template se puede ver a continuación.

Repasemos todo lo que hace esta Assembly. Subo un archivo de audio y obtengo un PDF. El archivo PDF se divide en imágenes separadas para cada página. Las imágenes y el audio se mezclan en un único video WebM con una duración y una tasa de fotogramas definidas. ¡Escenarios bastante complejos, todos ejecutados en unas pocas líneas!

Echa un vistazo tú mismo a la documentación del Robot /video/merge y sé creativo combinándolo con la amplia variedad de otras funcionalidades disponibles aquí en Transloadit.