Tutoriel : utiliser /video/merge pour créer des diaporamas vidéo
Un tutoriel sur /video/merge
Récemment, j’ai présenté le Robot /video/merge à travers
un exemple de cas d’usage dans lequel la vidéo et le son sont fusionnés,
à l’aide du paramètre audio_delay. J’ai maintenant décidé de proposer un tutoriel plus
approfondi, en associant ce même Robot à d’autres Robots puissants
disponibles chez Transloadit.
Cette fois, nous allons aborder un autre cas d’usage unique : créer un diaporama vidéo composé de plusieurs images et le fusionner avec un enregistrement audio. Je vais passer en revue chaque étape du début à la fin, avant de présenter le résultat final.
Préparer nos fichiers
Comme d’habitude, avant de créer notre Assembly, nous devons préparer les fichiers nécessaires. À titre d’exemple concret, je vais transformer des sections d’un document PDF en un diaporama cohérent. Plus précisément, l’une des antisèches sur l’apprentissage automatique proposées par l’université Stanford. Je souhaite combiner les pages du PDF pour créer une vidéo, puis la commenter en voix off. Un petit contenu pédagogique pour moi, en vue d’un prochain devoir 😉
Ensuite, nous stockerons le résultat dans Dropbox afin de pouvoir y accéder à tout moment.
Un aperçu des Robots
Passons aux choses sérieuses en jetant un rapide coup d’œil à tous les Robots qui nous seront utiles dans cette Assembly :
L’importation du fichier audio enregistré sera assurée par le Robot /upload/handle, tandis que le fichier PDF sera importé par le Robot /http/import. Nous utilisons ensuite le Robot /document/thumbs pour générer des images à partir de notre fichier PDF, après quoi le Robot /video/merge rassemblera toutes les images dans un seul fichier vidéo principal. Enfin, l’un de mes grands favoris, que j’utilise très souvent, le Robot /dropbox/store, me permettra de stocker le résultat final !
Partie 1 - Importer nos fichiers
Voici les deux premiers Steps du Template que j’ai créé, l’un pour le téléversement et l’autre pour l’importation via 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"
}
}
}
Tout d’abord, il nous faut mon fichier audio enregistré. Je vais utiliser le Robot /upload/handle, un Robot simple qui me permettra de téléverser plus facilement, par programmation, un fichier local depuis ma machine. Je vous recommande de lire notre récent article Re-loadit pour découvrir ce Robot plus en détail !
Une fois le fichier audio obtenu, nous pouvons utiliser le Robot /http/import pour accéder directement au lien vers le dépôt GitHub que j’ai mentionné plus haut. Le Robot récupérera le fichier PDF à partir du lien et nous permettra d’en faire ce que nous voulons dans tous les Steps suivants de l’Assembly.
Partie 2 - Générer des images à partir du PDF
Notre troisième Step dans l’Assembly, après l’importation de nos fichiers, utilise le Robot /document/thumbs. Ce Step se présente comme suit dans mes Assembly Instructions :
{
"thumbnail": {
"use": [
"document"
],
"robot": "/document/thumbs",
"result": true,
"resize_strategy": "fit"
}
}
Le Robot va maintenant produire plusieurs images, une pour chaque page. J’ai défini le
paramètre result sur true afin de pouvoir me rendre sur la page des
Assemblies et vérifier si le Robot a découpé les images comme je le souhaite.
Le paramètre resize_strategy est défini sur 'fit' pour cet exemple, ce
qui signifie que nos images conserveront leurs proportions et seront redimensionnées en fonction du
plus grand côté de l’image.
Partie 3 - Tout fusionner
Le quatrième Step est celui où le Robot /video/merge commence à jouer un rôle important. Nous prenons les Steps de miniatures et d’enregistrement du Template et les transmettons au Robot pour qu’il les fusionne.
{
"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"
}
}
Deux Steps sont utilisés pour la fusion : mon fichier audio, appelé
:original dans la partie 1, et l’ensemble d’images créé à partir de mon fichier PDF,
appelé thumbnail dans la partie 2. Le PDF que j’utilise compte quatre pages au total,
et il serait judicieux d’afficher chaque image à l’écran pendant au moins dix secondes, car elles
contiennent beaucoup d’informations.
C’est pourquoi j’ai défini le paramètre duration sur 40 secondes et le paramètre
framerate sur 1/10, ce qui signifie qu’une nouvelle image s’affichera toutes les dix
secondes. WebM est un format pratique que je recommande pour sa taille plus réduite que celle du
MP4 ; nous allons donc le définir ici via le paramètre preset. Cela devrait
fusionner correctement notre audio et nos images en une seule belle vidéo.
Partie 4 - Le résultat final
Enfin, le cinquième et dernier Step de mon Assembly consiste à exporter les
résultats vers Dropbox. Le Step exported utilise le Step merged,
ce qui lui permet de savoir quel fichier nous voulons exporter. Mes
informations d’identification de Template me donnent accès à mon Dropbox via mon
Assembly, puis le paramètre path indique le nom de ma vidéo finale et
l’emplacement où je souhaite la stocker. Ici, ${file.id} nous fournit un identifiant
unique de 32 caractères, ce qui élimine tout risque de conflit lors de l’exportation de mes
résultats.
{
"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}"
}
}
}
Le fichier vidéo produit par ce Template est visible ci-dessous.
Revenons sur tout ce que fait cette Assembly. Je téléverse un fichier audio et je récupère un PDF. Le fichier PDF est découpé en images distinctes, une par page. Les images et l’audio sont combinés en une seule vidéo WebM avec une durée et une fréquence d’images définies. Des scénarios plutôt complexes, réalisés en quelques lignes seulement !
Consultez vous-même la documentation du Robot /video/merge et laissez libre cours à votre créativité en le combinant avec la vaste gamme d’autres fonctionnalités disponibles ici chez Transloadit.