Pular para o conteúdo

Adicione um overlay do KickBot ao OBS

Todo overlay do KickBot é um link da web. Para mostrar o overlay na sua live da Kick, copie o link no painel do KickBot e adicione ao seu software de streaming como browser source (fonte de navegador). Funciona do mesmo jeito para overlay de chat, alertas, TTS, alertas de gorjeta e imagens com IA, no OBS Studio, no Streamlabs Desktop, no Meld Studio e em outros apps que aceitam browser source. Não precisa instalar nada.

Cada recurso tem o seu próprio link. Copie o link na página indicada abaixo.

OverlayOnde copiar o linkMais ajuda
Overlay de chat, alertas, contadores e outros widgetsWidgets > Widgets salvos, depois de instalar um widget da Biblioteca de widgetsBiblioteca de widgets, overlay de chat
Texto para falaTTS > Configurações, Browser source para o OBSConfigurar o TTS
Alertas de gorjetaGorjetas > WidgetAlertas de gorjeta
Imagens com IAChat Bot > Imagens com IA, WidgetImagens com IA

Um widget da Biblioteca de widgets mostra o tamanho dele em Tamanho na live, por exemplo 800 × 600 px. Use essa largura e essa altura no browser source. O mesmo tamanho aparece no widget em Widgets salvos.

O card Sobre este widget na Biblioteca de widgets, com Tamanho na live de 800 por 600 px
Use os valores de Tamanho na live como largura e altura do browser source.

Se a página não mostra um tamanho, coloque o browser source no tamanho da sua tela (canvas), por exemplo 1920 × 1080. Depois mova ou redimensione a fonte na cena. A maioria dos overlays tem fundo transparente, então só o conteúdo aparece na live.

  1. Na caixa Fontes (Sources) da sua cena, clique em + e escolha Navegador (Browser).
  2. Digite um nome, por exemplo “Chat do KickBot”, e confirme.
  3. Na janela de propriedades, cole o link do overlay em URL.
  4. Coloque em Largura (Width) e Altura (Height) o tamanho do overlay.
  5. Para overlays com som (TTS, alertas, alertas de gorjeta), ative Controlar áudio via OBS (Control audio via OBS). A fonte passa a aparecer no Mixer de áudio (Audio Mixer), onde você pode mudar o volume dela.
  6. Clique em OK. Arraste a fonte para onde quiser na tela.

Outras opções do browser source no OBS:

  • Desligar fonte quando não visível (Shutdown source when not visible): descarrega o overlay quando a cena dele não está no ar. Deixe desativado para alertas e TTS, para não perder nada enquanto você está em outra cena.
  • Atualizar navegador quando a cena se tornar ativa (Refresh browser when scene becomes active): recarrega o overlay toda vez que você troca para a cena. Uma mensagem que está tocando para quando o overlay recarrega.
  • Atualizar cache da página atual (Refresh cache of current page): um botão que recarrega o overlay na hora. Use depois de mudar configurações no KickBot ou quando o overlay não aparecer direito.

O OBS explica cada opção no guia do Browser Source (em inglês).

  1. Na visualização do estúdio, clique em + ao lado de Fontes (Sources).
  2. Escolha Fonte de navegador (Browser Source), digite um nome e clique em Adicionar fonte (Add Source).
  3. Nas configurações da fonte, cole o link do overlay no campo de URL e defina a largura e a altura.
  4. Feche as configurações e coloque a fonte no lugar.

O Streamlabs Desktop tem as mesmas opções Desligar fonte quando não visível e Atualizar navegador quando a cena se tornar ativa do OBS. Veja o artigo do Streamlabs sobre browser sources (em inglês). Se você não ouve um overlay, confira se ele não está mudo no mixer de áudio.

  1. No painel Layers (camadas), clique em + e escolha Browser (navegador).
  2. Cole o link do overlay no campo URL do Inspector (inspetor).
  3. Redimensione a camada na tela, ou defina W e H (largura e altura) no Inspector.
  4. Para overlays com som, ative Add an audio track for the source (adicionar uma faixa de áudio para a fonte), abaixo do campo URL. O Meld não adiciona uma faixa de áudio sozinho para camadas de navegador.

Você também pode colar um link direto na tela do Meld para criar uma camada de navegador. O ícone de recarregar ao lado do campo URL recarrega o overlay. O Meld explica as camadas na documentação de layers (em inglês).

A fonte está vazia.

  • Muitos overlays só mostram algo quando há algo para mostrar. Um overlay de chat fica vazio até alguém mandar mensagem. Um alerta só aparece quando um evento acontece.
  • Copie o link de novo no painel e cole na fonte. Se você apagou e instalou um widget de novo, ele tem um link novo.
  • Recarregue o overlay: Atualizar cache da página atual no OBS, ou o ícone de recarregar no Meld.
  • Confira se a fonte não está oculta (o ícone de olho) e se não está atrás de outra fonte na lista.

Sem som no TTS ou nos alertas.

  • OBS: ative Controlar áudio via OBS nas propriedades da fonte e depois confira se a fonte não está muda no Mixer de áudio.
  • Meld: ative Add an audio track for the source.
  • Confira as configurações de volume do recurso no KickBot, por exemplo o volume do TTS nas Configurações de TTS.
  • Para você mesmo ouvir o overlay enquanto faz live no OBS, abra Editar > Propriedades avançadas de áudio (Edit > Advanced Audio Properties) e coloque o Monitoramento de áudio (Audio Monitoring) da fonte em Monitorar e enviar para a saída (Monitor and Output). Os espectadores ouvem de qualquer jeito.

As mudanças no KickBot não aparecem na live. Recarregue o overlay com Atualizar cache da página atual. Alguns overlays só leem as configurações quando carregam.

O overlay aparece cortado ou pequeno demais. Coloque a largura e a altura da fonte no tamanho do overlay, como aparece em Tamanho na live. Mude o tamanho nas propriedades da fonte, e não esticando a fonte na tela, para o texto continuar nítido.

Como coloco o chat da Kick no OBS?

Instale um widget de chat da Biblioteca de widgets, copie o link dele em Widgets salvos e adicione ao OBS como fonte Navegador, com o tamanho que aparece no widget. Veja overlay de chat.

Os overlays do KickBot funcionam com Streamlabs e Meld?

Sim. Qualquer software de streaming que aceita browser source funciona, incluindo OBS Studio, Streamlabs Desktop e Meld Studio.

Posso usar o link de um overlay em mais de uma cena?

Sim. Adicione a mesma fonte em cada cena, ou coloque seus overlays em uma cena só e adicione essa cena às outras.

Os overlays deixam meu PC lento?

Os overlays são páginas web leves. O trabalho pesado, como gerar o áudio do TTS, acontece nos servidores do KickBot. O browser source só mostra e toca o resultado.