Streaming sur PC, retour d’expérience

Objectifs

Je cherchais un moyen de faire partager mes courses. Je n’ai pas trop de temps pour faire du montage vidéo, alors il est évident que la solution était d’enregistrer en direct ma course, soit pour la diffuser plus tard, soit pour la diffuser en direct.

J’ai donc cherché ce qui existait pour cela, après quelques essais, je me suis arrêté sur OBS qui permet de faire les deux au choix, mais la plupart du temps je diffuse en direct car l’enregistrement sur disque prends de la place et plus de ressources que d’envoyer directement sur le réseau vers les sites de streaming ;).

OBS (Open Broadcast Software)

OBS permet donc de faire de la diffusion TV, d’enchainer des scènes pré-configurées, de déclencher des actions en tant que réalisateur ou alors sans qu’on soit devant l’application, en la pilotant de l’extérieur.

Le principe est assez simple, mais c’est très complet.

  • Choix de son type de diffusion (Enregistrement sur la machine ou Diffusion en direct sur internet)
  • Organisation des scènes avec les éléments que l’on veut dedans
  • Système d’enchainement entre les scènes via des raccourcis clavier par exemple.
  • Système de plugin pour compléter l’outil
  • Communauté existante autour du streaming qui donne beaucoup d’outils ou information sur le net.

Configuration d’OBS pour le Streaming

Un des point important pour le streaming, c’est de trouver l’équilibre entre qualité et débit réseau. Au final les essais que j’ai fait (j’ai la Fibre ça aide) pour du 1080p 60fps c’est de mettre 12000 Kbps, sauf que Twitch refuse pour du streaming en direct, la limite est à 8000 Kbps. J’ai donc plafonné à cette valeur.

Pour le reste, voilà mes options.

Configuration des Scenes

Le principe se base sur le fait de diffuser une scène à la fois et donc tout ce qui se trouve dans la scène.

Dans une scène on peut ajouter beaucoup de choses, il faut imaginer pour tout ce qui est de la partie affichage, que ce sont des couches superposées, avec la première par dessus les autres qui sont affichées par dessous, c’est donc un jeu de transparence.

Chaque élément s’appelle une source qui peut être statique ou dynamique.

Les principales sources qu’on manipule sont :

Dans mon cas j’utilise ces sources de cette manière :

  • Image : pour afficher des logos, mettre des cadres autour d’autres sources
  • Source média : c’est principalement pour mettre des sons (musique d’ambiance pour faire patienter) ou des vidéo (pour les fonds animés)
  • Texte : cela permet de mettre facilement des informations sans avoir à faire des images pour ça et même de le animer (décompte par exemple)
  • Navigateur sert à afficher des pages web dynamiques, on s’en sert pour les overlay.
  • Périphérique de capture vidéo : Ma webcam qui s’affiche en incrustation en bas à droite)
  • Capture de jeu : Pour afficher l’image de mon jeu favoris qui est une image 2D de ce que je vois dans mon oeil gauche en VR.
  • Capture Audio : Pour ajouter le son de ce que j’entends dans mon casque VR ou d’un micro.
  • Groupe : qui permet d’associer plusieurs sources afin de les déplacer ou cacher facilement, ce n’est pas une source.
  • Scène : C’est la base de chaque écran qui va être diffusé, le bonus, on peut mettre des scènes dans des scènes, explications dans le paragraphe suivant.

Organisation de scènes

Le principe est simple, on parle de poupées russes, du coup on peut les imbriquées, et donc par le jeu de transparence faire un ensemble réutilisable et complexe.

Cette scène peut être insérée dans une autre scène, c’est du coup très pratique de pré-configurer des parties d’écran et de les utiliser ensuite dans une scène plus complète, voilà une autre scène, composé de la première.

Au final on va pouvoir insérer cette nouvelle scène sur ma scène d’ouverture actuelle complète. On ne se servira d’ailler lors du streaming que de la scène d’ouverture, les autres étant là pour aider à la construction de notre puzzle géant.

Enchainements de scènes, ou transitions

On peut enchainer des scènes, c’est le but premier de ce type d’outils, mais le bonus c’est qu’on peut indiquer sous quelle forme, fondus par exemple, il y en a quelques uns dans l’outil, mais on peut aussi y ajouter une sorte de vidéo qui sert à faire un fondu dynamique, vous savez comme quand on vous montre un ralentis au foot, on a une animation entre le direct et le ralentis.

On les appelle les Stinger, ça fait vraiment pro et quand on n’a pas le temps, on peut en trouver sur le net, c’est là que j’enchaine sur le paragraphe suivant, parce que pour que cela soit plus pro, certains on fait le boulot pour vous, moyennant quelques Euros, vous gagnez un temps précieux et surtout en qualité.

Modèles tout prêts

Donc pour gagner du temps et avoir des scènes plus professionnelles, vous trouvez donc des Stream Package sur le net.

Il faut savoir que ceux qui sont animés utilisent plus de CPU pendant que vous streamez, il faut donc arriver à trouver un juste milieu, moi par exemple sur la partie Live où j’ai ma Webcam et le jeu d’affiché, je n’ai pas mis d’animation pour libérer un peu de CPU quand je roule 😉

Je vous liste quelque sites que j’ai consulté :

https://streamplaygraphics.com/downloads/category/twitch-stream-packages/

https://nerdordie.com/product-category/full-stream-package/

https://www.own3d.tv/shop/twitch-stream-overlays-templates/

Déclenchements de l’affichage de scènes

Vu que je n’utilise pas l’application directement, il y a une fonction dans OBS qui permet d’associer des raccourcis clavier à des éléments. Pour ma part, j’ai ajouté quelques touches pour afficher la scène de Live et de fin de session.

En creusant un peu plus je me suis demandé si on ne pouvait pas faire mieux que cela comme par exemple déclencher une scène de décompte (Countdown) et à la fin afficher ma scène de Live.

Et bien si c’est possible, via des plugins/addons, on va justement en parler.

Optimisations et addons

Gestion des sons

Chose intéressante qui arrive quand on commence à avoir des scènes et une logique de diffusion, c’est que par moment on veut le son du jeu, par moment non, pareil pour d’autres sons comme le micro.

Par défaut le son du PC est mis en tant que source de sortie de la vidéo, ce qui veut dire que tous les sons qui se produisent sont audible dans toutes les scènes, et si vous coupez ce canal, toute les scènes ne l’auront plus. On ne peut pas donc par ce moyen choisir quelle scène inclue ou non le son du PC.

Mais il y a une solution, tout d’abord, il faut désactiver toutes les sources audio par défaut, c’est dans les menus suivants :

Fichiers > Paramètres > Audio > Périphériques
Là vous désactivez toutes les source (par défaut la première « audio du bureau » est active, il faut donc la désactiver)

Maintenant vous allez pouvoir choisir dans quelle scène vous voulez que le son que vous recevez dans votre casque audio soit diffusé dans la vidéo que vous streamez.

Pour cela il faudra simplement ajouter une source Capture Audio Sortie (et choisir votre casque audio, moi c’est le casque VR).

Pour le micro, c’est Capture Audio Entrée 😉

Temporisation et compteurs

Une chose qui est souvent visible, c’est un décompte. Pour ma part, je voulais une scène pour faire patienter et ensuite quand je suis prêt à diffuser l’indiquer via un décompte (20 secondes).

Via une source de type Texte (GDI+) vous pouvez placer votre compteur avec une valeur par défaut (20 pour moi).

Ensuite vous pouvez via un scrpit additionnel associer un timer quand la source va s’afficher : https://obsproject.com/forum/resources/advanced-timer.637/

Vous trouvez la gestion des scripts dans le menu : Outils > Scripts > bouton + pour ajouter un script à votre Collection de scène active.

Enchainement automatique de scènes

Parmi les outils indispensables dans mon cas il y a Advanced Scene Switcher, cela permet de configurer des changement de scènes en fonction d’événements. Par exemple, quand ma scène Countdown est terminées, au bout de 20 seconde cela ouvre la scène de Live automatiquement, pas besoin d’appuyer sur quoi que ce soit.

C’est un plugin OBS, qui se trouve là : https://obsproject.com/forum/resources/advanced-scene-switcher.395/

Voilà, quand tout est assemblé, cela donne une diffusion de ce type, j’ai lancé le streaming manuellement depuis le PC et ensuite juste appuyé sur 2 touches, une pour passer sur le décompte qui lui va activer ma scène Live où on voit le jeu et la webcam. Et ensuite à la fin pour passer sur la scène de fin de Stream j’ai un deuxième raccourci pour l’activer, et au bout de 30 secondes cela active automatiquement la scène Offline.

J’ai ensuite stoppé le streaming depuis le PC après avoir enlevé mon caque VR (mais ça vous ne le voyez pas).

Diffusion sur plusieurs canaux de stream

La question arrive assez vite sur la table, comme je fais si je veux streamer en direct à la fois sur Youtube et Twitch (ou autre).

Et bien comme souvent, il y a déjà la solution en cherchant un peu, moi j’ai retenu la solution restream qui permet dans sa version gratuite d’avoir la faculté d’envoyer son flux vers plusieurs canaux de diffusions en même temps !!

En gros, vous streamez vers restream, et restream envoi vers tous les canaux actifs (channel) que vous aurez ajouté à votre compte.

Donc avant de diffuser, vous vous connectez à restream.io et vous pouvez changer le titre de la diffusion sur tous vos canaux déclarés, et même sélectionner pour certains canaux la programmation que vous avez déjà définit pour qu’il l’utilise à la prochaine diffusion.

Stream Deck et Touch Portal

Étant dans un cockpit et avec un casque VR sur la tête, c’est compliqué d’accéder au clavier facilement pour effectuer des actions précises, en particulier activer mes raccourcis clavier, c’est source d’erreur.

Ayant investi dans des volants avec beaucoup de boutons, j’ai moins besoin de mon clavier et de mon mini clavier additionnel qui m’aide à piloter.

J’ai donc regardé ce qu’il se faisait pour aider à Streamer via des boutons avec des sortes de macro prédéfinies pour combiner quelques actions plutôt qu’un clavier qui est assez petit niveau touches.

Il y a les boitiers Stream Deck, c’est réellement intéressant car on peut tout paramétrer, il y a même une application sur téléphone pour faire pareil.

Le souci c’est le prix, c’est assez cher, 150€ environ. J’ai donc regardé la concurrence, et il existe une application qui fait un peu la même chose que l’application téléphone de Stream Deck, c’est Touch Portal.

Il y a une version gratuite limité en nombre de boutons et de pages, mais cela permet de tester. Cela fonctionne sur Android ou iOS, j’avais une tablette 10 pouces que j’utilisais assez peu souvent (en voyage principalement) j’ai donc testé.

Après quelques essais, j’ai acheté l’application sur Android qui coute environ 15€ pour faire sauter la limitation du nombre de boutons/pages.

Me voilà maintenant avec tout ce qu’il me faut pour steamer sans trop de difficulté, tout est paramétrable, donc on peut faire ce qu’on veut.

J’en ai donc profité pour ajouter des sons pour m’indiquer que certains décomptes étaient sur la fin, ou certaines scènes activées, ça aide quand on n’a pas de visuel sur son écran de PC.

Au final voilà ce que cela donne quand on teste le tout intégré via Touch Portal :

Les outils additionnels pour mes simulations favorites

Je roule en VR, et dans mon casque il y a assez peu d’information utiles pour celui qui regarde en direct, les principales informations de classement ne sont pas visibles facilement en VR, c’est donc difficile de suivre la course de l’extérieur.

Une des solutions est de rajouter des Overlay dans le Stream, des informations sur la course comme à la TV quand on a le classement en permanence à l’écran.

Voilà donc les outils que j’utilise ou expérimente pour mes jeux du moment.

iRacing

Overlay temps & casque via irApp

Pour le classement c’est via ce lien http://ir-apps.kutu.ru/stream-overlay/#!/

Voici ma customisation dans OBS via la source Navigateur :

URL : http://ir-apps.kutu.ru/stream-overlay/overlay.html#?carTemps=false&carWeatherSOF=true&standingsMaxRows=9&standingsWindow=5&carFuel=false&carWind=false&relativesCompact=false&standingsMulticlass=true

CSS

body { 
}

.standings {
    top: 5px;
    left: 5px;
}
 .relatives {
    top: 210px;
    left:5px;
    background: rgba(0, 0, 0, 0.30);
}
.car {
    top: 435px;
left: 5px;
}

Pour l’overlay casque, le lien est là : http://ir-apps.kutu.ru/helmet-overlay/#!/

Il y a même un addon là https://github.com/MorisatoK/ir-tvstyleoverlay que je n’ai pas testé.

RacelabApp

Un petit nouveau a fait aussi son apparition, mais je n’ai pas encore eu le temps de le tester : https://www.facebook.com/racelabpage/

rFactor2

Là c’est très récent, c’est l’overlay du jeu qui est directement exploité, l’URL à mettre toujours dans une source Navigateur d’OBS : http://localhost:5397/overlays/overlays.html

Tous les détails pour le configurer sont là : https://docs.studio-397.com/users-guide/broadcast-overlays

Le résultat brut en action en haut à droite sur cette vidéo :

SimHub

Cet outils permet de faire beaucoup de choses, en particulier de faire des Overlay de type web, qui lisent les informations depuis le jeu (via des plugins) et génèrent des « pages web » utilisées en superposition du Stream : https://www.simhubdash.com/

La suite ?

Plus on avance dans le Streaming et plus on a d’idées en fonction de ses envies et de ce que font les autres.

Parmi les pistes à étudier, le fait d’ajouter des alertes pendant le streaming, comme un nouvel abonné à ma chaine par exemple, il y a StreamlabsOBS qui permet de faire ça, mais je n’ai pas encore testé cet outils.

Une vidéo d’introduction pour bien laisser son identité en début de stream par exemple sans avoir à faire de montage après coup, j’ai commencé à travailler le sujet, ça finira par apparaitre dans mes futurs Streams ;).

Certains font dans l’interactif, micro et chat en direct, moi j’ai deux soucis avec ça, en VR difficile de voir un chat et difficile de répondre tout en restant concentré quand on roule. De plus le vocal, j’ai vocation à l’utiliser pour passer des commandes à mon Crew Chief pour m’aider quand je roule, ce n’est pas encore le cas, mais je réserve à cela, c’est donc encore un sujet à expérimenter 😉 . Vous n’êtes pas prêt de m’entendre causer avec vous pendant que je roule et streame en VR.

Voilà pour les quelques informations que je voulais partager, maintenant si vous voulez me suivre, c’est simple :

Youtube : https://www.youtube.com/djustou/

Twitch : https://www.twitch.tv/djustou

Si vous avez des questions, les commentaires sont ouverts, ou via Discord 😉

2 réflexions sur « Streaming sur PC, retour d’expérience »

  1. Merci Daniel pour toutes ces informations bien documentées.
    Tout cela est vraiment très intéressant.

    De mon coté je ne stream pas ma connexion ne le permettant pas, mais c’est un projet dans les tuyaux quand la fibre sera là.

    Je suis FoXy_85 et adhérant du groupe RFRO.

    J'aime

Votre commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l’aide de votre compte WordPress.com. Déconnexion /  Changer )

Photo Google

Vous commentez à l’aide de votre compte Google. Déconnexion /  Changer )

Image Twitter

Vous commentez à l’aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l’aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur la façon dont les données de vos commentaires sont traitées.