Browser Source no OBS: o que é, para que serve e como não quebrar a cena

Browser Source é uma fonte do OBS que carrega uma página da internet dentro da sua cena. É por ela que entram alerta, meta, chat na tela, fila de pedidos e qualquer widget de interação.

Entender como ela funciona resolve a maior parte dos problemas de "meu widget não aparece".

Como adicionar

1. Na cena onde o widget deve aparecer, clica em Adicionar e escolhe Navegador.
2. Dá um nome que você reconheça depois, tipo "alerta" ou "desenhos".
3. Cola a URL que a ferramenta te deu.
4. Define largura e altura. Pra widget que ocupa a tela inteira, 1920 por 1080.
5. Confirma.

O fundo vem transparente por padrão, então só aparece o conteúdo do widget, sem retângulo branco atrás.

As opções que importam

Desligar a fonte quando não estiver visível. Marca. Assim o widget não fica consumindo recurso em cenas onde não aparece.

Atualizar quando a cena ficar ativa. Útil pra widget que precisa reconectar. Cuidado com alerta em fila, porque recarregar pode zerar o que estava esperando.

Controlar áudio pelo OBS. Se o widget tem som, marca essa opção. Sem ela, o som toca no seu computador e o público não escuta, ou o contrário.

CSS personalizado. O campo já vem com uma regra deixando o fundo transparente. Dá pra usar pra ajustar posição e tamanho de detalhes do widget, se a ferramenta permitir.

Tamanho certo x esticar

Erro comum: criar a fonte com 800 por 600 e depois arrastar o canto pra ocupar a tela toda. Isso estica a imagem e deixa tudo borrado.

O certo é definir a largura e a altura corretas nas propriedades da fonte. Se o widget é feito pra 1920 por 1080, cria com esses números e não redimensiona.

Se precisar de um widget menor na tela, muitas ferramentas oferecem um parâmetro de escala. É melhor usar isso do que esticar.

Ordem das camadas

A lista de fontes da cena funciona de cima pra baixo: o que está em cima aparece na frente.

Widget de interação quase sempre precisa estar acima da captura do jogo. Se você adicionou e não apareceu nada, essa é a primeira coisa a conferir.

Problemas comuns e o que fazer

Tela em branco. Costuma ser URL errada ou expirada. Copia de novo do painel da ferramenta. Se a URL tem chave secreta, ela pode ter sido regerada.

Aparece no navegador mas não no OBS. Clica com o botão direito na fonte e escolhe atualizar o cache. Se persistir, remove e cria de novo.

Sumiu depois de trocar de cena. A opção de desligar quando não visível está fazendo efeito e o widget demora pra reconectar. Deixa a fonte também na cena de intervalo ou desmarca a opção.

Consome muita CPU. Cada Browser Source é uma janela de navegador. Cinco ou seis pesados na mesma cena derrubam frame. Mantém só o necessário e marca a opção de desligar quando invisível.

Widget não recebe o que a galera manda. Confere se o serviço está conectado. Ferramentas de interação costumam mostrar no painel se o widget está online, e é a primeira coisa a olhar.

Aparece cortado. Largura e altura da fonte menores que o conteúdo. Ajusta nas propriedades, não arrastando.

Interagir com a página

O OBS permite abrir uma janela de interação com a fonte, clicando com o botão direito e escolhendo Interagir. Serve pra clicar em botão dentro do widget, fazer login numa página ou testar algo sem sair do programa.

É a forma mais rápida de saber se o problema é do widget ou do OBS: se funciona na janela de interação, o widget está vivo.

Segurança da URL

A URL do widget costuma conter uma chave que identifica o seu canal. Isso significa duas coisas:

• não mostra ela na live. Se você abrir as configurações do OBS na tela, a URL aparece.
• não compartilha com ninguém. Quem tem a URL pode ver ou até interferir no que aparece na sua transmissão.

Se aparecer na tela por acidente, gera uma URL nova no painel da ferramenta.

Onde isso é usado no dia a dia

Praticamente toda interação visual da sua live passa por aqui:

• alerta de follow, sub, bit e doação;
• meta com barra de progresso;
• chat na tela;
• fila de pedidos;
• desenho do chat aparecendo na transmissão.

E tem uma vantagem que vale lembrar: como quem monta a imagem é o seu OBS, tudo isso funciona igual na Twitch, na Kick e no YouTube, inclusive em multistream. Extensão que roda dentro do player, não.