Design de IU de TV: trabalhando com espaço em branco

Publicados: 2022-03-11

Projetar para TV requer uma compreensão abrangente e disciplinada dos princípios de UX. Um dos elementos que é uma preocupação constante na hora de projetar para TV é o uso do espaço em branco no design. Existem muitos aplicativos de TV no mercado que não sabem como (ou conscientemente optam por não) aproveitar adequadamente o espaço em branco. O resultado é uma desordem visual que prejudica ativamente os objetivos de negócios.

Aqui está uma explicação do que é espaço em branco e como usá-lo em seu aplicativo de TV é melhor para os negócios.

O espaço em branco é nosso amigo

Em primeiro lugar…

O que é espaço em branco?

O espaço em branco é um pedaço de espaço desocupado com zero texto ou gráficos em camadas no topo.

Isso é importante observar porque uma imagem gráfica de fundo pode ser considerada um espaço em branco, desde que não haja nada adicionado acima dela.

O espaço em branco é
O espaço em branco nem sempre é apenas branco.

Qual é o grande negócio?

Por que algo tão simples faz tanta diferença? Os proprietários de empresas geralmente veem o espaço em branco como uma oportunidade perdida de promover mais conteúdo – um desperdício de espaço valioso na tela. Seu objetivo é colocar o máximo de conteúdo possível na frente dos usuários, o que, em algum nível, é compreensível. No entanto, quando muito conteúdo é disponibilizado para os clientes, eles enfrentam o que é chamado de paralisia de decisão — uma completa falta de capacidade de decidir.

A lei de Hick, ou Lei Hick-Hyman, nomeada em homenagem aos psicólogos britânicos e americanos William Edmund Hick e Ray Hyman, descreve o tempo que uma pessoa leva para tomar uma decisão como resultado das possíveis escolhas que ela tem: aumentar o número de de escolhas aumentará o tempo de decisão logaritmicamente.

Isso é realmente um grande negócio quando você leva em consideração todo o conceito de aplicativos de TV - ESCOLHA! Quantas vezes você navegou em uma biblioteca interminável de miniaturas de programas de TV e filmes apenas para se ver incapaz de decidir sobre qualquer coisa? Não é porque o conteúdo não é grande. É porque não há espaço para respirar – sem separadores significativos. Sua mente vê tantas opções que desliga.

Para os designers, o espaço em branco é o espaço negativo em uma página que fornece espaço visual para seus olhos.

Os designers sabem que o espaço em branco ajuda o usuário a se concentrar e absorver o conteúdo que deseja que ele veja.

Procuravam-se designers de UI freelancers em tempo integral nos EUA

Diga sim ao espaço em branco

O espaço em branco é especialmente importante para o design de aplicativos de TV porque, normalmente, os usuários estão relaxados, desfrutando de uma experiência descontraída - tentando tomar uma decisão à distância. Ao fornecer a eles um bom equilíbrio entre conteúdo e espaço em branco, estamos realmente ajudando-os nesse processo.

Quando usado corretamente, o espaço em branco pode transformar um design e a experiência que o usuário obterá dele. Designs e layouts precisam de espaço para respirar para serem agradáveis ​​aos olhos e ajudar a facilitar as decisões. Ao utilizar o espaço em branco, você realmente aumenta a legibilidade do conteúdo e as interações do usuário. Isso é alcançado reduzindo as distrações que impedem os espectadores de tomar uma decisão.

De acordo com uma pesquisa realizada pela Human Factors International, o espaço em branco aumenta a compreensão do usuário em quase 20%.

Vejamos como o espaço em branco ajuda a criar espaço para respirar e como isso transforma o processo de tomada de decisão.

Uma interface de TV aparentemente projetada para causar ansiedade
Uma interface de TV aparentemente projetada para causar ansiedade.


Uma interface de TV tentando fazer muito ao mesmo tempo
Uma interface de TV tentando fazer muito ao mesmo tempo.


Esteticamente bem executado, mas sem espaço em branco entre o conteúdo
Esteticamente bem executado, mas sem espaço em branco entre o conteúdo.


Uma interface com espaço para respirar
Uma interface com espaço para respirar.


Uma interface de TV com bom equilíbrio e hierarquia entre os elementos
Uma interface de TV com bom equilíbrio e hierarquia entre os elementos.


Uma interface de TV com bom equilíbrio e hierarquia entre os elementos
Uma interface de TV com bom equilíbrio e hierarquia entre os elementos.


Vê isso?

O espaço em branco cria separações claras que focam os olhos do usuário no conteúdo que você deseja que ele veja.

O Hulu faz um ótimo trabalho ao usar o espaço em branco em seu aplicativo Hulu Live. Confira a grande imagem de fundo que é usada em vez da arte tradicional de pôster - é imersiva e bonita de se ver. Este é um ótimo exemplo de como usar o enorme espaço de varejo disponível.

Hulu atrai você com espaço em branco imersivo
O Hulu atrai você com espaço em branco imersivo.

O espaço em branco reduz a carga cognitiva e acelera a tomada de decisões. Conforme descrito pela Fast Co Design, adicionar espaço em branco faz muito mais do que apenas remover a desordem - ele atende a essas funções essenciais:

  • Melhora a compreensão
  • Esclarece as relações entre elementos interativos
  • Atrai e concentra a atenção dos usuários

Espaço em branco não é apenas estética, é a chave para uma interface de usuário bem-sucedida. Ao focar em espaço em branco visual, espaço em branco de layout, espaço em branco de texto e espaço em branco de conteúdo, melhoramos drasticamente a compreensão do usuário. Isso adiciona ênfase e posiciona seu conteúdo na frente e no centro. As imagens próximas umas das outras parecerão semelhantes; assim, esclarecer os relacionamentos com os usuários permitirá que eles naveguem com confiança. Como você já ouviu antes, “menos é mais”.

Use o poder do espaço em branco para elevar seus designs e ajudar na tomada de decisões.

Reduzir a carga cognitiva tornará a interface do usuário não apenas mais utilizável, mas também mais agradável de usar - o espaço em branco ajudará a criar uma sensação de harmonia e fluidez em toda a experiência do usuário.

Uso eficaz do espaço em branco

Aqui estão mais alguns exemplos de aplicativos de TV que usam o poder do espaço em branco eficaz para criar interfaces agradáveis ​​de usar.

Essas interfaces de TV permitem que o usuário se concentre em uma, em vez de dezenas de opções
Essas interfaces de TV permitem que o usuário se concentre em uma, em vez de dezenas de opções de cada vez.

O espaço em branco é um elemento muitas vezes esquecido e subutilizado em muitos dos designs de televisão de hoje. Embora o conteúdo seja rei em aplicativos de TV, isso não significa que devemos desordenar a tela cobrindo cada centímetro dela. O espaço em branco é um dispositivo de design simples, mas poderoso, que deve ser aplicado a todos os aplicativos de TV do mercado. É moderno, elegante, visualmente estimulante e comprovado para ajudar os usuários a decidir qual conteúdo assistir.

O uso de espaço em branco no design permite que seu conteúdo brilhe em qualquer tela de tamanho
O uso de espaço em branco no design permite que seu conteúdo brilhe em qualquer tela de tamanho.

• • •

Leia mais no Blog Toptal Design:

  • eCommerce UX – Uma visão geral das melhores práticas (com infográfico)
  • A Importância do Design Centrado no Homem no Design de Produto
  • Os melhores portfólios de UX Designer – Estudos de caso e exemplos inspiradores
  • Princípios heurísticos para interfaces móveis
  • Design Antecipatório: Como criar experiências de usuário mágicas