Overlay para streamers

(nome temporário)

Overlay totalmente personalizável que permite aos streamers através de uma dashboard montar a interface de seu overlay, criar/integrar com alertas/chat/metas/etc. E para usar será necessário apenas uma URL contendo todos os seus widgets da cena.

O que teremos de diferente?

Um novo jeito de gerenciar overlays de uma forma super criativa e personalizada!

  • Não será necessário adicionar várias URLs no OBS (um para cada widget que precisar),
    • Seu overlay será criado em nuvem e só será preciso adicionar uma única URL contendo todos os widgets ao OBS (ou app de transmissão).
    • A proposta é que você possa gerenciar seu overlay de forma muito mais simples e intuitiva!
    • A quantidade de URLs que você precisa adicionar no seu app de transmissão será reduzida em apenas 1 por cena de transmissão.
  • Widgets personalizados!
    • 100% dos objetos adicionados ao widget poderão ter as suas propriedades personalizadas (tamanho, cor, borda, etc).
    • Nenhum widget será vinculado à condições fixas como "Inscrição", "Doação", "Follow". Cada widget terá um fluxograma próprio e nele você poderá definir N condições para disparar seu widget.
  • Não será necessário conhecimento (nem mesmo mínimo) de HTML ou CSS para criar um bom overlay, você terá a liberdade de personalizar todos os aspectos do seu overlay com poucos cliques!
  • Widgets conectados a várias plataformas simultaneamente!
    • Streama em mais de uma plataforma? Você poderá interagir entre 2 ou mais plataformas ao mesmo tempo!
    • Já imaginou contar quantas inscrições você teve em ambas em apenas um único widget? Follows, doações!
  • Widget de chat personalizado! Você poderá criar um chat único para cada overlay.
    • E também contará com um sistema de badge único por viewer, através de um comando os viewers poderão escolher alguma badge para aparecer ao lado de seu nick. Badges pré-definidas pelo streamer (no momento).
Dashboard

O dashboard do overlay permite que você gerencie todos os widgets que serão adicionados ao seu overlay.

A partir dessa dashboard será possível criar: um Overlay (um conjunto de widgets), widget do tipo "Alerta", "Meta" e "Chat"

Como funciona: você criará os widgets que compõem o seu overlay e após finalizar todos os seus widgets, entrará em seu overlay principal e importará seus widgets e irá posiciona-los aonde quiser. Feito isso, será gerada uma URL única para seu overlay que contém todos os seus widgets, agora basta copiar e colar no OBS e tudo estará funcionando!

Lista de overlays cadastrados
Lista de overlays cadastrados
Exemplo de um overlay
Exemplo de um overlay
Atalhos
Atalhos
Widgets

Meta

O widget de criação de metas define um determinado objetivo a ser alcançando: Inscrição, Doação, etc.

Ao criar uma meta o sistema irá gerar um template básico para você, que pode ser modificado ao seu gosto. Assim como na dashboard, é possível adicionar, remover ou personalizar qualquer objeto que desejar.

Para inserir dados reais na meta como o valor atual da meta, o valor estimado da meta, a porcentagem de progresso e entre outros basta criar um texto e colocar entre chaves {{}} o nome da variável que deseja incluir, ex: {{title}} para exibir o título do widget como texto. Veja os prints abaixo para mais exemplos.

Assim como todos os widgets, a meta também tem seu próprio fluxograma, que serve para definir as condições para incrementar a meta. Você pode vincular múltiplos eventos (como Inscrição e Follow ao mesmo tempo), mesclar eventos de plataformas diferentes (porém cada plataforma possuirá seu próprio fluxograma, mas incrementarão a mesma meta)

Widget de meta padrão
Widget de meta padrão
Variáveis de um widget "Meta", para ser utilizado na dashboard
Variáveis de um widget "Meta", para ser utilizado na dashboard
Exemplo de uso das variáveis ao editar o texto, inserindo título e porcentagem da meta
Exemplo de uso das variáveis ao editar o texto, inserindo título e porcentagem da meta
Exemplo de uso das variáveis ao sair da edição de texto, exibindo título e porcentagem da meta
Exemplo de uso das variáveis ao sair da edição de texto, exibindo título e porcentagem da meta
Fluxograma de uma meta, definindo a regra para uma meta do tipo "Gift Sub"
Fluxograma de uma meta, definindo a regra para uma meta do tipo "Gift Sub"

Alerta

O alerta é um widget que tem como propósito dar algum tipo de feedback ao usuário. Ele pode ser utilizado para informar que houve algum dos seguintes eventos: Doação, Inscricão, Follow, Raid etc.

Assim como a meta, o alerta também tem seu próprio fluxograma que também pode ser vinculada a múltiplos eventos e mesclados com plataformas diferentes.

Diferente da meta cada objeto dentro do alerta pode ter suas próprias condições definidas em um fluxograma exclusivo, ou seja, é possível definir que alguns objetos apareçam somente em condições específicas. Por exemplo: se eu crio um alerta de inscrição, eu vou querer exibir ao menos três informações: O nome de quem se inscreveu, a quantidade de meses e a mensagem de texto. Porém, o primeiro mês de inscrição não possui mensagem de texto, então nesses casos eu gostaria de ocultar o objeto responsável por exibir a mensagem de texto, para que o alerta fique de acordo com o contexto do evento que está sendo disparado.

Demonstração de efeito no texto