Overlays de Tela

Overlays são elementos dinâmicos que aparecem por cima do seu conteúdo. São perfeitos para exibir informações em tempo real como hora, clima, logos ou anúncios importantes sem interromper seu conteúdo principal.

Tipos de Overlay Disponíveis

Overlay de Relógio

Exiba a hora atual na sua tela.

Recursos:

Família de fonte personalizável (12+ opções)
Cor de texto personalizada com seletor de cores
Detecção automática de fuso horário
Design limpo e minimalista

Overlay de Imagem

Adicione logos, gráficos ou imagens de marca.

Recursos:

Selecione da sua biblioteca de mídia
Suporta JPG, PNG e outros formatos de imagem
Arraste para posicionar em qualquer lugar da tela
Redimensione arrastando os cantos
Perfeito para logos e marcas d'água

Use overlays de imagem para o logo da sua empresa em um canto de cada tela para manter a marca consistente.

Overlay de Clima

Mostre as condições climáticas atuais.

Recursos:

Exibição da temperatura atual
Ícone de clima (ensolarado, nublado, chuva, etc.)
Detecção automática de localização
Design limpo e minimalista

Overlay de Anúncio

Exiba anúncios em texto, com rolagem ou estáticos.

Recursos:

Mensagem de texto personalizada
Ótimo para alertas e promoções
Posição de exibição proeminente
Fácil de atualizar rapidamente

Adicionando um Overlay

Overlays são adicionados através da aba Design na configuração da tela:

Navegue para Telas
Clique em uma tela para abrir a configuração
Vá para a aba Design
Encontre a seção "Adicionar Overlay" na barra lateral
Arraste um tipo de overlay para o canvas de visualização
Solte onde você quer que seja posicionado
Configure as definições do overlay no modal que aparece
As alterações são salvas automaticamente

O posicionamento de overlay é feito inteiramente por arrastar e soltar. Simplesmente arraste um overlay para o canvas e posicione-o exatamente onde você quer.

Posicionando Overlays

Overlays usam posicionamento por arrastar e soltar no canvas:

Arraste para Posicionar

Segure o overlay no canvas
Arraste-o para o local desejado
Solte para definir a posição
O overlay se encaixa em sua nova localização

Redimensionar Overlays

Passe o mouse sobre um overlay para ver as alças de redimensionamento
Arraste cantos ou bordas para redimensionar
Mantenha a proporção arrastando os cantos

Empilhamento de Overlays

Quando overlays se sobrepõem:

Overlays adicionados depois aparecem por cima
Clique em um overlay para trazê-lo para frente
Overlays sempre renderizam acima do conteúdo das zonas

Configuração de Overlays

Configurações do Relógio

Configuração	Opções
Fonte	Poppins, Roboto, Inter, Open Sans, Lato, Montserrat e mais
Cor do Texto	Qualquer cor via seletor de cores

Configurações de Imagem

Configuração	Descrição
Imagem	Selecione da sua biblioteca de mídia
Posição	Arraste no canvas para posicionar
Tamanho	Arraste os cantos para redimensionar

Configurações de Clima

Configuração	Descrição
Localização	Detectada automaticamente com base na localização da tela
Exibição	Temperatura e ícone de clima

Configurações de Anúncio

Configuração	Descrição
Mensagem	Seu texto personalizado
Exibição	Overlay de texto proeminente

Editando Overlays

Clique para Editar

Clique em qualquer overlay no canvas
Um menu de contexto ou modal aparece
Modifique as configurações conforme necessário
As alterações são salvas automaticamente

Excluir Overlay

Clique no overlay
Clique no ícone de excluir/lixeira
Confirme a exclusão
O overlay é removido imediatamente

Melhores Práticas

Posicionamento

Não obstrua conteúdo importante
Considere a distância de visualização
Use cantos para informações persistentes (relógio, logo)
Use a área inferior para anúncios

Equilíbrio de Conteúdo

Limite a 2-3 overlays por tela
Garanta que o texto seja legível
Combine com as cores da marca
Teste da distância real de visualização

Layouts Comuns

Display de Recepção:

+--------------------------------+
| [Relógio]            [Logo]    |
|                                |
|       Conteúdo Principal       |
|                                |
|                     [Clima]    |
+--------------------------------+

Quadro de Menu:

+--------------------------------+
|          Itens do Menu         |
|                                |
|   Item 1    Item 2             |
|   Item 3    Item 4             |
|                                |
| [Anúncio: Especial do Dia!]    |
+--------------------------------+

Display Corporativo:

+--------------------------------+
| [Logo]                         |
|                                |
|       Apresentação             |
|                                |
|               [Relógio]        |
+--------------------------------+

Solução de Problemas

Overlay Não Aparece

Verifique se a tela está online
Confira se o overlay foi salvo
Atualize a configuração da tela
Certifique-se de que o overlay não está escondido atrás do conteúdo

Clima Não Exibindo

Verifique a conexão com a internet
A detecção de localização pode estar bloqueada
Aguarde o carregamento inicial dos dados

Hora do Relógio Errada

Verifique a configuração de fuso horário da tela
Verifique a hora do sistema do dispositivo físico

Imagem Não Carrega

Verifique se a imagem existe na biblioteca de mídia
Confira se o formato do arquivo é suportado (JPG, PNG)
Certifique-se de que o arquivo não está corrompido

Próximos Passos

Crie Playlists para seu conteúdo principal
Aprenda sobre a Biblioteca de Mídia
Configure Agendamentos para timing de conteúdo