OBS · 5 min de lecture
Comment ajouter un overlay dans OBS (Browser Source)
Tu as un overlay (ou tu veux en créer un) et il doit apparaître dans ton stream. Dans OBS, tout passe par une source d'un type précis : la Browser Source. Bien réglée, elle affiche n'importe quelle page web par-dessus ton jeu ou ta caméra, en temps réel. Voici comment la configurer proprement, en cinq minutes.
Gratuit pendant la bêta ouverte
Avant de commencer
- OBS Studio installé (ou tout logiciel qui accepte les Browser Sources)
- L'URL de ton overlay (Twools t'en génère une, mais la méthode vaut pour toute URL)
- Cinq minutes avant ton stream
Étape par étape
- 01
Comprendre ce qu'est une Browser Source
Une Browser Source est un mini navigateur web intégré à OBS : tu lui donnes une URL, il affiche la page dans ta scène. C'est le standard des overlays modernes, parce qu'une page web peut être animée, transparente et mise à jour en direct sans toucher à OBS.
- 02
Ajouter la source dans ta scène
Dans le panneau Sources, clique sur + puis choisis Navigateur (Browser). Nomme-la clairement, par exemple « Overlay », et valide. Une fenêtre de propriétés s'ouvre.
- 03
Coller l'URL et régler la taille
Colle l'URL de ton overlay dans le champ URL. Règle la largeur et la hauteur sur la résolution de ton canvas, en général 1920 et 1080. Ne coche rien d'autre pour l'instant, valide.
- 04
Vérifier le rendu
L'overlay apparaît dans ta scène, avec un fond transparent : seuls tes widgets sont visibles. S'il est décalé, clique droit sur la source, Transformation, puis Ajuster à l'écran. Place la source au-dessus de ta capture de jeu dans la liste (l'ordre des sources fait l'empilement).
- 05
Une URL pour tout l'overlay
Le piège classique : une Browser Source par widget, et dix sources à gérer. Avec Twools, tout ton overlay (timer, alertes, chat, objectifs) vit dans une seule URL : tu composes dans l'éditeur, tu colles une fois, et chaque changement se met à jour en direct dans OBS, sans jamais rouvrir les propriétés.
La démo en vidéo
Le workflow complet en conditions réelles : création de l'overlay, export dans ton logiciel de stream, pilotage en direct.
Astuces
- Si rien ne s'affiche, ouvre les propriétés de la source et clique sur « Actualiser le cache de la page actuelle ».
- Laisse la case « Arrêter la source quand elle n'est pas visible » décochée : tes timers et alertes continuent de tourner entre deux scènes.
- La taille de la source doit égaler la résolution du canvas OBS, sinon l'overlay sera flou ou rogné.
FAQ
Ça marche avec d'autres logiciels qu'OBS Studio ?
Oui. Tout logiciel de streaming qui accepte les Browser Sources fonctionne de la même façon : la méthode et l'URL sont identiques.
Est-ce que l'overlay ralentit le stream ?
Une Browser Source bien construite consomme très peu. Une seule source optimisée pèse d'ailleurs moins lourd qu'une dizaine de sources séparées.
Pourquoi mon overlay ne s'affiche pas ?
Dans l'ordre : vérifie l'URL (elle doit s'ouvrir dans un navigateur normal), actualise le cache depuis les propriétés de la source, et vérifie que la source est bien au-dessus des autres dans la liste.
Je dois refaire la source à chaque modification ?
Non. L'URL ne change pas : tu modifies ton overlay dans l'éditeur et le rendu se met à jour en direct dans OBS.