Os dispositivos de TV oferecem um conjunto limitado de controles de navegação para apps. Para criar um esquema de navegação eficaz para a interface da TV, considere esses controles limitados e como o usuário navega usando botões de controle remoto em vez de uma tela touchscreen.
Destaques
- O controlador oferece recursos limitados de navegação ( de cima para baixo, à esquerda e à direita). Portanto, preste atenção em como isso pode moldar o design da interface do seu app.
- A navegação precisa ser natural e familiar.
- Crie uma experiência de navegação simples com o botão "Voltar" do controle remoto.
- Se um usuário não tiver um caminho direto para chegar a um controle, considere realocá-lo.
Princípios
O objetivo é que a navegação pareça natural e familiar, sem dominar a interface do usuário ou desviar a atenção do conteúdo. Os princípios abaixo ajudam a definir um valor de referência para uma experiência do usuário consistente e intuitiva em apps de TV.
Eficiente
Acesse o conteúdo de maneira rápida e simples. Os usuários querem acessar o conteúdo rapidamente com um número mínimo de cliques. Organize suas informações de modo a exigir menos telas.
Previsível
Siga as práticas recomendadas e as recomendações para tornar a navegação previsível. Não reinvente os padrões de navegação desnecessariamente, porque isso leva a confusão e imprevisibilidade.
Intuitivo
Torne a navegação simples o suficiente para oferecer suporte à adoção de comportamentos de usuários amplamente adotados. Não complique demais adicionando camadas desnecessárias de navegação.
Controlador
Existem controles de vários estilos, desde um controle remoto minimalista até controles de jogos complexos. Todos os controles incluem um botão direcional, além dos botões "Selecionar", "Início" e "Voltar". Outros botões variam de acordo com o modelo.
- Botão direcional: o principal método de navegação na TV é pelo botão direcional, que inclui botões físicos direcionais para cima, para baixo, para a esquerda e para a direita.
- Botão de seleção: seleciona o item em destaque na tela. Você pode usar o gesto de tocar e pressionar para mostrar mais opções.
- Botão "Página inicial": direciona o usuário para a tela inicial do sistema.
- Botão Voltar: oferece aos usuários uma maneira de retornar à visualização anterior.
- Botão de microfone: invoca o Google Assistente ou a entrada de texto por voz.
Navegação direcional
Em um dispositivo de TV, os usuários navegam usando um botão direcional de quatro direções: para cima, para baixo, para a esquerda e para a direita. Para criar o app de TV ideal, crie um esquema de navegação em que o usuário possa aprender rapidamente a usar o app com as quatro teclas de seta. O botão direcional move o foco de um elemento para o mais próximo na direção correspondente.
Para testar se a navegação do app funciona bem com um botão direcional em um dispositivo de TV, considere o seguinte:
- Confira se o usuário consegue navegar para todos os elementos focalizáveis na tela.
- A direção de navegação precisa ser direta e previsível.
- Para listas de rolagem, confira se o botão direcional para cima e para baixo rola a lista inteira e se cada item pode ser selecionado.
Botão "Início"
Pressionar o botão home sempre leva o usuário de volta à tela inicial ou ao acesso rápido do Google TV. O app atual seria suspenso em segundo plano por padrão.
Tocar no botão home e mantê-lo pressionado mostra o painel do sistema no Google TV e a grade de apps no Android TV. O comportamento padrão pode variar de acordo com o fabricante.
Botão "Voltar"
Para manter a consistência entre os apps na plataforma, verifique se o comportamento do botão "Voltar" segue essas diretrizes.
Usar o comportamento previsível do botão "Voltar"
Para criar uma experiência de navegação previsível, quando o usuário pressionar o botão "Voltar" do controle remoto, ele será direcionado ao destino anterior. Por fim, o usuário precisa ser direcionado à tela inicial ou ao acesso rápido do Google TV se continuar pressionando o botão "Voltar".
O usuário é levado de volta ao topo da página rolando rapidamente e ativa o foco para o menu.
O menu do lado esquerdo é ativado, e o foco do usuário é direcionado para o item de menu ativo.
Confira se o botão "Voltar" não é controlado por telas de confirmação ou parte de um loop infinito.
O que não fazer
Não exibir um botão "Voltar"
Ao contrário dos dispositivos portáteis, o botão "Voltar" no controle remoto é usado para navegar para trás em uma TV. Não é necessário mostrar um botão "Voltar" virtual na tela.
O que não fazer
Mostrar botão de cancelamento, se necessário
Se as únicas ações visíveis forem de confirmação, destrutiva ou de compra, é recomendável ter um botão "Cancelar" que retorne ao destino anterior.
O que fazer
Arquitetura de navegação
Destino inicial fixo
A primeira tela que o usuário encontra ao iniciar o app pela tela de início também é a última que aparece ao retornar à tela de início depois de pressionar o botão "Voltar".
Links diretos simulam a navegação manual
Seja com links diretos ou navegando manualmente até um destino específico, os usuários podem usar o botão "Voltar" para navegar de qualquer lugar no app até o destino inicial.
Links diretos para um app a partir de outro simulam a navegação manual. Por exemplo, se o usuário acessar diretamente uma página de detalhes no app Filmestar no Google TV e pressionar o botão "Voltar", ele será direcionado para a página inicial do app.
Limpar caminho para todos os elementos focalizáveis
Permita que os usuários naveguem na interface com uma direção clara. Se não houver um caminho reto para chegar a um controle, é recomendável realocá-lo.
O que fazer
O que não fazer
Eixo
Projete seu layout para aproveitar os eixos horizontais e verticais. Dê a cada direção uma função específica para agilizar a navegação em hierarquias grandes.
O que fazer
