Como configurar um jogo interativo no OBS
O jogo interativo entra no OBS como uma fonte de navegador, não como captura de janela. Entender essa diferença resolve a maior parte dos problemas de overlay que não aparece, não atualiza ou fica com fundo preto.
As duas camadas de uma live interativa
Uma cena de live interativa tem duas camadas, e elas entram de jeitos diferentes:
- O jogo — pode ser uma fonte de navegador (jogos que rodam na web) ou captura de janela (Roblox e jogos instalados).
- O overlay — sempre fonte de navegador, com fundo transparente, por cima do jogo. É onde ficam as instruções, o ranking e a tabela de presentes.
Regra: se a plataforma te deu uma URL, é fonte de navegador. Se te deu um programa para abrir, é captura de janela.
Passo a passo no OBS
1. Crie a cena
Em Cenas, clique em + e nomeie algo como "Live interativa".
2. Adicione o jogo
Se for jogo de navegador: Fontes → + → Navegador, cole a URL do jogo, largura 1080, altura 1920 para vertical.
Se for Roblox ou jogo instalado: Fontes → + → Captura de Janela, selecione a janela do jogo. O jogo precisa estar em modo janela, nunca em tela cheia exclusiva.
3. Adicione o overlay por cima
Fontes → + → Navegador, cole a URL do overlay. Deixe-o acima do jogo na lista de fontes — a ordem na lista é a ordem de empilhamento na tela.
4. Marque as opções certas na fonte de navegador
- "Desligar a fonte quando não estiver visível" — deixe desmarcado. Marcado, o overlay perde a conexão com a live toda vez que você troca de cena.
- "Atualizar navegador quando a cena ficar ativa" — marcado ajuda a reconectar após trocas de cena.
- CSS personalizado — deixe o padrão, que já aplica fundo transparente.
5. Enquadre para vertical
Em Configurações → Vídeo, resolução de saída 720×1280. Depois use Editar → Transformar → Ajustar à tela em cada fonte e reposicione: jogo no centro, overlay ocupando a faixa de baixo.
6. Teste
Comente na própria live pelo celular. Se o nome aparecer no jogo, a conexão está certa.
Problemas de overlay e como resolver
| Sintoma | Causa | Solução |
|---|---|---|
| Overlay não aparece | Fonte abaixo do jogo na lista | Arraste para cima da fonte do jogo |
| Overlay com fundo preto | CSS de transparência removido | Restaurar o CSS padrão da fonte |
| Overlay congela | "Desligar quando não visível" marcado | Desmarcar a opção |
| Overlay não atualiza | Cache da fonte | Clicar com o botão direito → Atualizar |
| Overlay cortado | Largura/altura da fonte diferente da cena | Definir 1080×1920 na fonte |
| Presente não reflete no overlay | Conexão com a live caiu | Reconectar a conta e recarregar a fonte |
Ajustes que melhoram o resultado
- Overlay no terço inferior. É onde o olho vai depois de ler o que acontece no centro, e não briga com a interface do TikTok no topo.
- Fonte grande. Teste olhando o preview a um braço de distância; se você não lê, o público no celular também não.
- Contraste alto. Texto branco com sombra escura funciona em qualquer fundo de jogo.
- Cena de espera pronta. Trocar de cena é melhor que encerrar a live quando algo dá errado.
- Ícone do presente, não só o nome. O público reconhece o desenho mais rápido que o texto.
Quer os jogos rodando na sua live hoje?
7 jogos interativos que reagem a presentes, comentários e curtidas por R$19,90/mês. Acesso liberado por e-mail assim que o pagamento confirma.
Ver os planosPerguntas frequentes
O overlay entra como captura de janela ou fonte de navegador?
Sempre como fonte de navegador, usando a URL que a plataforma fornece. Captura de janela é para o jogo, quando ele é um programa instalado.
Por que o overlay fica com fundo preto?
Porque o CSS de transparência da fonte de navegador foi alterado ou removido. Restaure o CSS padrão que o OBS coloca na criação da fonte.
Por que o overlay congela quando troco de cena?
Pela opção 'Desligar a fonte quando não estiver visível'. Desmarque-a para o overlay manter a conexão com a live.
Qual resolução usar na fonte de navegador para live vertical?
1080x1920 na fonte, com a resolução de saída da cena em 720x1280. Assim o overlay renderiza nítido e é reduzido na saída.
Continue lendo
- Como fazer live no TikTok pelo PC (OBS e Live Studio)Como transmitir no TikTok pelo computador com TikTok Live Studio ou OBS: instalação, chave de transmissão, cen…
- Como fazer live interativa no TikTokPasso a passo para montar uma live interativa no TikTok: conectar o jogo, configurar os gatilhos de presente e…
- Como fazer live interativa no RobloxPasso a passo para deixar o Roblox reagindo aos comentários e presentes da sua live do TikTok: conexão, mapa, …
- Jogos interativos para live do TikTok: o guia completoO que são jogos interativos para live do TikTok, como eles reagem a presentes, comentários e curtidas, quais e…