Layouts e zonas

Um layout divide uma tela em áreas. Cada área toca a própria playlist, no próprio loop, e sabe de que tamanho de arte precisa.

Por que isso existeUma tela é um retângulo, e um cardápio não é. Dividir a tela deixa os pratos parados enquanto o letreiro corre e o som vem de outro lugar — três coisas mudando em três velocidades, que é o que uma parede de loja realmente faz. A alternativa é um único vídeo que precisa ser reeditado toda vez que a sopa muda.

As zonas#

A plataforma traz nove layouts: tela cheia, uma área principal com letreiro embaixo, uma barra lateral de um lado ou do outro, um formato em L, dois tipos de divisão, um canto de clima sobre uma imagem em tela cheia e uma divisão em três. As áreas se chamam Principal, Barra lateral, Secundária, Rodapé e Widget.

Todo layout também tem Áudio, que não é uma área — não tem um quadro na tela. É onde vai uma playlist de música ou de avisos, e num videowall o som sai de um painel só, não importa quantos estejam mostrando imagem.

Desenhando o seu#

No formulário de uma tela, em Layout, Desenhar um layout abre um canvas com o formato dessa tela. Arraste uma zona para movê-la, arraste um canto para redimensioná-la ou digite os pixels exatos — um espaço vendido como 1920 × 240 é digitado como 1920 e 240, em vez de arrastado até o número bater.

Telas → uma tela → Configurações avançadas → Layout → Desenhar um layout

Vitrine · tamanhos para 1920×1080 — Old Street

Imagem principal1920 × 842 px · 100% × 78%Camada 02

Letreiro de notícias1920 × 238 px · 100% × 22%Camada 0

as programações se referem a elas como Principal e Rodapé3

1A tela na própria resolução e formato, então um totem em retrato é desenhado em retrato.

2Cada zona mostra o tamanho que terá de verdade, em pixels, nesta tela.

3Como uma programação se refere a esta zona. Nunca muda, não importa como você a renomeie.

O layout é feito de proporções, não de pixels. Um layout serve para qualquer tela em que você o coloque: uma barra lateral com um quarto da largura tem 480 px numa tela 1920 e 960 numa 4K. Os tamanhos em pixels mostrados são os da tela de onde você veio.
Renomear uma zona é seguro. O que uma programação aponta é a chave da zona, mostrada embaixo do nome, e ela nunca muda. Chame de «Letreiro de notícias» ou «Placar do futebol» — as programações que apontam para ela continuam funcionando.
Remover uma não é. O conteúdo destinado a uma zona que não existe mais continua programado e deixa de aparecer. Antes de salvar, o editor diz quais programações seriam afetadas.
As camadas decidem as sobreposições. Zonas podem ficar umas sobre as outras — é isso que o canto do clima é. A camada mais alta fica na frente.

Tela com uma parte vazia

Um layout não precisa cobrir a tela inteira, e onde nenhuma zona chega, a tela fica preta. O editor diz quanto disso existe enquanto você desenha, porque uma faixa preta num lado é óbvia do outro lado de uma sala e nada óbvia num canvas.

De que tamanho de arte uma zona precisa#

É a pergunta que os tamanhos em pixels existem para responder. Um designer precisa de um número, e «a barra lateral» não é um número. Abra o painel de programação da tela e cada zona aparece com o tamanho — Imagem principal 1920 × 842 —, que é o que você manda para quem vai fazer a arte.

Os mesmos números aparecem quando você configura um espaço de anúncio: escolher Fixos oferece os tamanhos que as suas telas realmente produzem, com o layout e a zona de onde cada um vem, para você escolher em vez de digitar. Veja Como funciona a publicidade.

Exemplo — A vitrine de uma padaria em Old Street

A tela da vitrine tem 1920 × 1080. O layout é uma imagem principal sobre um letreiro, com a divisão em 78%, que o editor informa como 1920 × 842 e 1920 × 238. As fotos são encomendadas em 1920 × 842. O letreiro recebe um widget de notícias, que não precisa de arte nenhuma. O Áudio não recebe nada, porque a vitrine dá para a rua.

No celular

Layouts podem ser escolhidos no celular, mas não desenhados. Arrastar quadros num canvas e ler tamanhos em pixels pede uma mesa.