Comment faire une transition de Scène gratuite et stylée sur OBS

Hello ami Streamer! Aujourd’hui on va venir parler d’un élément qui peut sembler anecdotique sur un stream mais qui peut donner un vrai plus pour celles et ceux qui le travaille. Comme tu l’as compris on va parler des transitions de scènes sur OBS Studio. Je t’ai déjà expliqué dans cet article pourquoi j’ai choisi ce logiciel de streaming, je ne reviens pas dessus. Aujourd’hui je me mets en mode tuto. Dans cet article je vais t’apprendre à faire des transitions de scènes comme ça.

Ce ne sont pas des transitions hyper chiadées comme tu peux en trouver sur des sites comme Own3d pro mais l’avantage c’est que tu fais tout de tes propres mains et je trouve que c’est hyper gratifiant. En plus ça te coute pas un centime.

Si mes tutos te plaisent et que tu as envie de donner un peu de force n’hésites pas à me follow sur Twitch ! Qui sait on pourrait se faire des tutos en direct 😉

Etape 1 : Les prérequis pour faire ce genre de transition

Pour arriver à ce rendu il va te falloir 2 plugins. Ne t’en fais pas ils sont 100% gratuits et très simples d’utilisation. Et comme je suis sympa je te mets les liens directs vers les fichiers à télécharger. Ouai je sais je suis un vrai petit ange du stream.

Premier plugin : Move transition. Ce plugin va te permettre de faire bouger tes sources en leur appliquant un filtre. Je te détaille plus loin comment faire ça ne t’en fais pas. Mais ce plugin OBS est obligatoire si tu veux donner un effet dynamique à ta transition de scène.

Deuxième plugin : Scene as transition. On remercie Andilippi pour ce plugin qui change la donne. Tu l’auras compris, le but est de faire d’une scène que tu auras construite, ta transition entre les différentes scène. C’est juste brillant !

Etape 2 : Créer ta future scène de transition

Tu vas donc commencer par créer une nouvelle scène vide que tu pourras baptiser « Transition » par exemple ou « Josiane » si ça te plait, on s’en fiche un peu. Le but c’est que tu la retrouve facilement. Cette nouvelle scène, c’est ton terrain de jeu pour créer ta magnifique transition. Tu vas pouvoir y associer des sources comme tu as l’habitude de le faire. Sache que tout ce que je vais t’expliquer fonctionne très bien avec des sources images ou vidéos.

Mais moi j’ai décidé d’utiliser des sources de type « Source de couleur« . Comme tu le sais, cela va te permettre de mettre des formes de couleur sur ton stream. Je sélectionne un beau rouge par exemple et y applique des modifications pour lui donner un angle et le faire remplir ma scène. Une fois que c’est fait, je vais l’emmener dans la position initiale. C’est à dire la position de laquelle j’attends que la transition démarre.

Cette position va être le « point de départ de ton mouvement » donc forcément fait en sorte qu’il soit en phase avec ce que tu attends. Si par exemple tu souhaites plutôt faire de bas en haut c’est tout à fait possible et il te faudra positionner ta source en bas (en dehors de ton écran de stream bien évidemment)

La deuxième étape va être de créer les autres sources de couleurs pour donner l’effet accordéon qu’on souhaite. Pour ce faire tu vas simplement copier la première source de couleur puis la coller au format (dupliquer). C’est essentiel de ne pas faire un ctrl+c ctrl+v sinon tu vas appliquer un collage de référence et tu ne pourras plus modifier tes sources sans impacter les autres.

Nous ce que l’on cherche à faire c’est créer 3 ou 4 sources de couleurs différentes au même format et positionnées au même endroit. Une fois créée tu peux les modifier pour changer leur couleurs comme bon te semble.

Etape 3 : Animer tes sources

C’est là où le plugin Move transition prend toute son importance. Si tu as skip la partie 1 de mon article, retournes y pour trouver le lien de ce plugin sans lequel tu ne pourras pas aller plus loin. une fois qu’il est installé, redémarre OBS si nécessaire.

Voilà maintenant tout est bon ! Tu vas pouvoir faire un clic droit sur ta scène « Transition » puis cliquer sur « Filtres« . Puis tu créé un nouveau filtres d’effet en cliquant sur le + et tu choisis le filtre « Move Source« 

Je te conseille de nommer le filtre en fonction de la couleur que tu comptes faire bouger et dans l’ordre dans lequel tu comptes le faire. Tu verras c’est important. Ensuite il va te falloir créer autant de filtre que tu n’as de sources de couleurs à faire bouger. Et petite cerise sur le gâteau il va te falloir les créer en 2 fois par couleur. Et oui chaque source va avoir une position de début, puis une position de fin et tu vas certainement vouloir réinitialiser la position du début. 🙂 (Si tu n’as rien compris, pas de souci, fais moi confiance ce sera très clair plus tard).

Si donc j’ai 4 couleurs Rouge début / Blanc / Gris / Rouge fin je vais avoir 8 filtres. Pour paramétrer chaque filtre il va falloir

Général :

• Sélectionner la source à laquelle il se rapporte (liste déroulante à sélectionner)
• Choisir un start Delay. Tu peux laisser à 0 nous on veut que la scène se lance illico
• La custom duration : C’est le temps que va prendre ta source à effectuer le mouvement demandé. Je te conseille 2000 ms (2 secondes) et puis tu ajustes en fonction du résultat.
• End Delay : Sur le premier mouvement tu t’en fiches ça ne nous sera utile que plus tard.
• Ease : On s’en fiche un peu vu que la scène démarre hors cam. Laisse en Ease in and out
• Easing Function : Pareil comme ça se passe hors cam on en a pas besoin tu peux laisser « Cubic » en valeur sans souci.

Transform :

• Transform : Voilà il te faut les coordonnées de la position d’atterrissage de ton mouvement de source. Pour ce faire tu vas devoir déplacer toi même ta source jusqu’à la position finale puis cliquer sur le bouton « Get transform » pour que les coordonnées soient mises à jour

• Le Curve te permet en plus de donner une trajectoire incurvée mais personnellement je préfère les trajectoires droites.

Visibility and Order :

On ne va pas vraiment s’en occuper car pour faire notre scène de transition nous n’en avons tout simplement pas besoin. En revanche ce qui vient après est hyper important.

Actions :

C’est ici que nous allons déterminer les déclencheurs du mouvement et les actions qui vont suivre.

• Start Trigger : On peut le laisser en valeur par défaut car notre start Trigger sera le lancement d’une nouvelle scène.
• Stop Trigger : Idem que précédemment
• Simultaneous Move : Hyper important c’est là que tu vas pouvoir lancer les mouvement en même temps qu’une autre source. Attention tu pourras gérer grâce au Start delay vu plus haut un décalage de source tout en faisant démarrer les sources par le même trigger. En gros pour ta première source de couleur tu mets rien mais pour la 2ème source de couleur tu mets la 1ère en Simultaneous Move. Les 2 partiront en même temps.
• Next Move : C’est pour ce champ qu’on a dupliqué les filtres en début. En gros ce champ permet de dire quelle est l’action que doit faire ta source une fois son déplacement terminé. Nous ce qu’on veut c’est qu’elle revienne à sa position initiale. C’est pour cela que tu dois ici faire en sorte de mettre le filtre 2 de la couleur.

Le bouton start te permet de vérifier le move de ta source. Normalement tu dois donc avoir des filtres comme ci dessous

• Une couleur A1 avec un Start Delay à 0, d’une duration de 2000 ms avec une position de transform que tu as choisie (point B). Et en Next Move le filtre couleur A2. Ce filtre sera le déplacement de ta source du point A au point B.
• Un filtre couleur A2 avec un Start delay à 0, d’une duration de 0ms avec une position de transform point A pour revenir à l’état initial d’avant move de ta source. Ce filtre te réinitialisera ta source pour lancer une prochaine transition.

Et maintenant ? Et bien tu dupliques ce schéma à l’ensemble de tes sources. Attention quand même à

• Ne pas oublier de mettre une valeur en Start Delay (300 ms pour la couleur 2, 600 ms pour la couleur 3, 900 ms pour la couleur 4 etc…). Cela permettra de faire en sorte que tes couleurs se suivent dans le déplacement et ne soient pas toutes superposées
• Ne pas oublier de faire le lien dans Simultaneous Move avec la couleur précédente uniquement. Si l’ordre de tes couleurs est Rouge, Blanc, Gris, Rouge 2 alors tu dois mettre le Blanc en même temps que le rouge (avec le delay de 300ms), le Gris en même temps que le blanc (avec le delay de 600ms) et le Rouge2 en même temps que le gris (avec le delay de 900ms)

Normalement, tu dois arriver à ce résultat. Si ce n’est pas le cas vérifie bien tes paramètres. Avec en tête la durée de l’animation, les Start Delay, et les liens entre les sources.

Voilà donc ta scène de transition toute prête ! Tu peux bien évidemment t’amuser à rajouter du texte, des images etc… Là je te laisse à ton pur génie créatif. 🙂

Etape 4 : Faire de ta scène une transition

Ici encore si tu n’as pas lu l’étape 1, tu ne pourras rien faire ici. Le plugin Scene as transition est obligatoire ici. Je pars donc du principe que tu l’as et que tu es prêt à l’utiliser.

Pour ce faire il te suffit de te rendre dans « Transition de scènes » sur OBS depuis l’interface principale. Ensuite tu cliques sur le + pour en créer une nouvelle et là hop magie ! Tu peux sélectionner une nouvelle transition : Scène. Si tu ne l’as pas et que tu as bien installé le plugin n’hésites pas à redémarrer OBS Studio.

Voici donc comment paramétrer ta nouvelle transition.

• Scène : Il te faut tout simplement ici aller chercher la scène que tu viens de créer.
• Duration : Comme tu t’en doutes c’est le temps que doit durer la transition. Si tu as choisis un déplacement en 2 secondes de tes sources je te conseille de mettre ici la même valeur. (2000ms)
• Type : En gros tu as 2 valeurs possibles. L’idée ici c’est de déterminer à quel moment de la transition tu passes de la scène A à la scène B. Je te conseille personnellement de jouer sur le pourcentage plutot que sur une durée mais tu fais bien comme tu veux 🙂
• Transition point : En fonction de ce que tu as choisi, c’est soit une barre de progression, soit une durée à renseigner. Personnellement je mets entre 50% et 60% et j’ajuste en fonction de mes tests (tu comprendras en lisant plus bas)
• Audio Settings : Non je ne l’ai pas utilisé, mais Oui c’est classe. Tu peux ajouter un son à ta transition. je trouve ça cool mais comme je continue souvent de parler même quand je change de scène en stream j’évite d’ajouter un son supplémentaire.
• Filter to Trigger : HYPER IMPORTANT, il faut que tu sélectionnes le filtre de la source qui va lancer le tout. Il te faut donc choisir la dernière couleur, celle qui est liée à toutes les autres (cf fin de l’étape 3).
• Et pour finir tu peux prévisualiser le tout grâce à une option. Si tu n’es pas satisfait du rendu n’hésites pas à jouer sur tes paramètres.

Et voilà tu n’as plus qu’à enregistrer et kiffer ta nouvelle super transition. J’espère vraiment que ce tuto t’aura aidé ! N’hésites pas si ça t’a plu à me le dire en commentaire 😉