Processo criativo, desenvolvimento e gerenciamento de produtos para Smart TV

O mercado de Smart TVs cresce em ritmo acelerado. Nos últimos anos ultrapassaram o número de TVs convencionais, representando...

Data de publicação: 26/10/2018
O desenvolvimento de apps para Smart TVs, é preciso pesquisar sobre o perfil dos usuários e seguir guidelines que irão melhorar a interface e a usabilidade.

O mercado de Smart TVs cresce em ritmo acelerado. Nos últimos anos ultrapassaram o número de TVs convencionais, representando 73% das vendas de televisores em 2017. Além disso, cerca de 91% dos consumidores possuem a TV conectada à internet.
Gráfico comparando a quantidade de pessoas que assistem TV convencional e Smart TVs.

User Experience (UX)

O primeiro passo é pesquisar mais sobre o perfil dos usuários, identificar suas personas. O público-alvo pode ser o mais variado possível, desde um usuário que respira tecnologia, até um senhor que acabou de adquirir a sua primeira Smart TV e não sabe nem instalar um aplicativo.
É preciso entender as dores e frustrações dos usuários, pois cada perfil tem suas particularidades, curva de aprendizado e até mesmo diferentes graus de curiosidade (usuário explorador, passivo, etc). Tudo isso precisa ser tratado para minimizar problemas ou impedimentos ao interagir com seu aplicativo.
Além do usuário, que é parte essencial do processo, existem alguns guidelines que irão melhorar a interface e a usabilidade dos aplicativos:

1. Distância

Distância média entre a TV e o usuário, que geralmente é de 3 metros.
A distância média entre o usuário e a televisão é de aproximadamente 3 metros, e por mais que existam televisores enormes, a disposição dos elementos poderão torná-los pequenos e pouco confortáveis aos olhos do quem vê. Pontos de atenção:

  • Tamanho das fontes, botões, cores e ícones;
  • Affordances e Destaques (elemento que está com foco);

 

2. Navegação

Mão segurando um controle prateado de Smart TV.
É importante lembrar que o controle de uma televisão tem suas limitações e não possui os recursos de um teclado. Sendo assim, pensar em uma navegação simples e objetiva é essencial. Por exemplo, explorar sempre o recurso do botão “Voltar”, já que em muitas vezes é utilizado como botão de escape, caso o aplicativo trave.
Desenho comparando a UI de uma navegação simples com outra complexa com diversos erros.
Navegações mega complexas e que envolvam combinações de botões devem ser evitadas, pois podem confundir o usuário e levá-lo a desistência.

3. Foco

Mudanças no tamanho, cor e borda são as principais características utilizadas para ajudar o usuário a se localizar na tela. Levando em conta a diversidade de usuários que podem utilizar as aplicações, esse item tem prioridade alta na hora de planejar a interface.
Menu do Apple TV com foco no botão, destacando o mesmo dos demais links.
Pense no seguinte cenário: o usuário está navegando no aplicativo e foi ao banheiro, quando retornar a interface do aplicativo deve lhe mostrar onde foi sua última ação, para que ele volte a navegar sem nenhum impacto.
Desenho comparando a UI do foco correto em um botão e outro foco sem nenhum destaque.

User Interface (UI)

 

1. Simplicidade

Tema universal na hora de se criar uma interface. Telas cheia de conteúdos e navegações complexas tendem a dificultar o entendimento e facilidade do usuário em encontrar as informações.
É nítida a diferença entre as estruturas e quantidade de informações nos exemplos abaixo. A segunda tela possui muito mais complexidade e sobreposição de interações.
Imagem comparando a UI de uma tela simples com outra cheia de informações, dificultando a visualização para o usuário.

2. Continuidade

Seguindo a lei da continuidade de Gestalt, é muito importante dar a noção ao usuário de que há mais informações. Uma forma simples de fazer isso, por exemplo, seria “cortando” o último elemento de um card, de modo que ele saiba que é possível navegar além do que já está exibido na tela.
Exemplo de continuidade do conteúdo 'cortando' um pedaço do card.

3. Proximidade

Mantenha os elementos na tela sempre agrupados (outra lei de Gestalt), de forma que o usuário consiga interpretar os diferentes tipos de conteúdo, independente da distância que ele estiver do dispositivo. Quanto menor for a distância entre os elementos, mais agrupados eles estarão.
Tela inicial de um aplicativo mostrando os agrupamentos de informações através da proximidade.

Development

 

1. Web Hosted App

Disponibilizar novas versões aos usuários, quando o app é nativo, exige percorrer um moroso processo de validação e publicação via seller stores. Nesse caso, novos lançamentos oriundos de demandas de negócio emergentes, podem ser inviabilizados. Já a abordagem web hosted traz muita flexibilidade e agilidade a esse processo.
Compor e configurar um time de desenvolvimento não é tão custoso, caso a maioria das atividades demandadas tenham como premissa conhecimento e habilidade em desenvolvimento web “clássico” (html, css e js).

2. Web Caching

Acelerar e aumentar a performance da aplicação. A cada nova requisição, são utilizados os dados estáticos armazenados em cache, que não sofreram mudanças. Além da economia de tempo necessário para baixar os arquivos, evita-se um aumento excessivo dos custos ($$$) de cloud.

3. Feature Flag

Habilitar/desabilitar funcionalidades críticas ou de alto risco ao projeto, de maneira ágil e sem necessidade de disponibilizar uma nova versão do app aos usuários. Caso a disponibilização de alguma funcionalidade dependa de questão contratuais, que serão resolvidas ao longo do projeto, utilizar essa abordagem provê flexibilidade, segurança e apoio ao negócio.

Conclusões

 

  • Nem tudo no mundo é touchscreen, mude seu mindset.
  • Ainda existe muita coisa que não possui pattern ou referência.
  • Entenda qual é o público alvo da aplicação.
  • A interação com os desenvolvedores é essencial em diversos pontos do processo, desde discussões sobre navegação, até como as informações serão trazidas pela API.
  • Testar! Nunca deixe de aplicar testes de usabilidade ao produto, pois é essencial para validar se a solução está aderente às necessidades do público-alvo.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

17 − 2 =

Posts relacionados

  1. Sobre a Dextra

    Somos especialistas em desenvolvimento de software sob medida para negócios digitais. Pioneiros na adoção de metodologias de gestão ágil, combinamos processos de design, UX, novas tecnologias e visão de negócio, desenvolvendo soluções que criam oportunidades para nossos clientes.

  2. Categorias

Scroll to top