O receptor reproduz o conteúdo e reflete o estado dele para o usuário. O destinatário precisa responder imediatamente às ações no app remetente . Por exemplo, quando o conteúdo é pausado no receptor, ele exibe um ícone de pausa. Quando o usuário pressiona "Reproduzir" no app remetente, o receptor começa a reproduzir o conteúdo e remove o ícone de pausa.
Exemplos de feedback da interface do receptor:
- Em exibição
- Pausado
- Posição / busca da reprodução
- Armazenando em buffer
IU do receptor
Obrigatório
A Coloque a maioria dos elementos da interface em 1/4 da parte inferior da tela
e mantenha a consistência com as outras UX.
B Não apresente elementos como controles interativos. Por
exemplo, não reproduza a interface do remetente na interface do destinatário.
Práticas recomendadas
- Use transição (esmaecer), transparência e nuances para suavizar o efeito visual.
- Considere o fato de que os usuários querem ver o máximo possível do conteúdo. Os usuários geralmente pausam o conteúdo para analisá-lo, então esmaeça a interface desnecessária quando possível.
Android
interface do remetente
interface do receptor
iOS
interface do remetente
interface do receptor
Chrome
interface do remetente
interface do receptor
App receptor inativo
Uma tela inativa é exibida no receptor quando ele está conectado a um remetente, mas não faz transmissão.
Obrigatório
A Identifica qual app receptor está carregado
Práticas recomendadas
- Use a tela inativa para promover conteúdos ou recursos do app remetente.
- Mude o conteúdo a cada 30 a 60 segundos para exibir mais e evitar que a tela seja queimada.
- Desconecte-se do app receptor e interrompa a execução se ele estiver inativo por cinco minutos. Quando interrompida, a tela inicial do receptor aparece e ajuda a evitar a queima de tela.
Android
Caixa de diálogo "Transmitir", conectada, mas sem transmissão
App receptor carregado / inativo
iOS
Caixa de diálogo "Transmitir", conectada, mas sem transmissão
App receptor carregado / inativo
Carregamento do app receptor
Quando um usuário se conecta a um receptor, o app receptor precisa ser carregado antes de mostrar o estado inativo ou começar a reproduzir o conteúdo.
Obrigatório
A Identifique qual app receptor está carregando exibindo o
logotipo
B Identifique se o app receptor está sendo carregado exibindo
o ícone de carregamento animado
Android
Conectando do remetente
App receptor carregando
iOS
Conectando do remetente
App receptor carregando
Chrome
Conectando do remetente
App receptor carregando
Carregamento de conteúdo do destinatário
Depois que o app receptor for carregado, o conteúdo poderá começar a ser transmitido para o receptor.
Obrigatório
A Identifique o conteúdo que está sendo carregado exibindo o
título ou a arte gráfica
B Identifique o conteúdo que está sendo carregado exibindo um
ícone de carregamento animado
Práticas recomendadas
Ao retomar o conteúdo pausado, volte a reprodução de 5 a 10 segundos para que o espectador não perca nada
durante a transição do remetente para o destinatário.
Android
Carregando conteúdo do remetente
Carregando conteúdo do receptor
iOS
Carregando conteúdo do remetente
Carregando conteúdo do receptor
Chrome
Carregando conteúdo do remetente
Carregando conteúdo do receptor
Reprodução do receptor
Obrigatório
A Identificar o que está sendo reproduzido quando o conteúdo começa
B Identificar a posição de reprodução quando a posição é ajustada
C Identificar que o receptor está buscando conteúdo quando a
posição da reprodução mudou, mas ainda não está sendo reproduzida
Android
Remetente ajustando a posição de reprodução
Busca de conteúdo do destinatário
iOS
Remetente ajustando a posição de reprodução
Busca de conteúdo do destinatário
Chrome
Remetente ajustando a posição de reprodução
Busca de conteúdo do destinatário
Receptor pausado
Obrigatório
A Identificar se o conteúdo está pausado, exibindo um ícone
pausado e a posição de reprodução
B Identificar qual conteúdo está pausado exibindo o título ou a arte gráfica
C Identificar qual app receptor está carregado exibindo um
logotipo do app
Práticas recomendadas
- Muitas vezes, os usuários pausam o conteúdo para examiná-lo. Portanto, exiba um ícone de pausa para que a interface desapareça desnecessariamente quando pausada por alguns segundos.
- O app receptor não pode continuar a reprodução de conteúdo, a menos que haja uma solicitação explícita do usuário para iniciar a reprodução, como retomar ou pular um item na fila.
- Desconecte-se do app receptor e interrompa a execução se ele estiver inativo por 20 minutos. Quando interrompida, a tela inicial do receptor aparece e ajuda a evitar a queima de tela. Armazene o local pausado para que o usuário possa retomar a reprodução a partir desse ponto mais tarde.
Android
Remetente pausado
Conteúdo do destinatário pausado
Remetente pausado
Receptor pausado após cinco segundos
iOS
Remetente pausado
Conteúdo do destinatário pausado
Remetente pausado
Receptor pausado após cinco segundos
Chrome
Remetente pausado
Conteúdo do destinatário pausado
Remetente pausado
Receptor pausado após cinco segundos
Armazenamento em buffer do receptor
O armazenamento em buffer no receptor acontece quando a latência da rede ou outros fatores causam um atraso na reprodução.
Obrigatório
A Identifica se o receptor está armazenando em buffer após alguns segundos exibindo um ícone de carregamento de buffer. Espere alguns segundos para indicar que o armazenamento em buffer
vai impedir que o ícone de carregamento do buffer apareça com muita frequência em condições de rede ruins
Práticas recomendadas
Identifique qual conteúdo está sendo armazenado em buffer se ele continuar após cinco segundos.
Android
O remetente indica que o receptor está em buffer
Armazenamento em buffer do conteúdo do receptor
iOS
O remetente indica que o receptor está em buffer
Armazenamento em buffer do conteúdo do receptor
Chrome
O remetente indica que o receptor está em buffer
Armazenamento em buffer do conteúdo do receptor
O receptor interrompe a transmissão
Quando a reprodução é interrompida ou expira, a interface do receptor precisa promover outros conteúdos ou recursos disponíveis no app remetente.
Obrigatório
A Identifique qual app receptor está carregado ou inativo exibindo um logotipo do app
Práticas recomendadas
- Use a tela inativa após a reprodução para recomendar conteúdos ou recursos do app remetente com base no que acabou de ser transmitido
- Mude o conteúdo da tela inativa a cada 30 a 60 segundos para evitar que a tela seja queimada
- Desconecte-se do app receptor e interrompa a execução se ele estiver inativo por cinco minutos. Quando interrompida, a tela inicial do receptor aparece e ajuda a evitar a queima de tela.
Android
App do remetente inativo
App receptor inativo
Remetente desconectado
Transmitir tela inicial
iOS
App do remetente inativo
App receptor inativo
Remetente desconectado
Transmitir tela inicial
Chrome
App do remetente inativo
App receptor inativo
Remetente desconectado
Transmitir tela inicial
As imagens usadas neste guia de design são cortesia da Blender Foundation, compartilhadas sob direitos autorais ou licença Creative Commons.
- Elephant's Dream: (c) copyright 2006, Blender Foundation / English Media Art Institute / www.elephantsdream.org
- Sintel: (c) copyright Blender Foundation | www.sintel.org
- Tears of Steel: (CC) Blender Foundation | mango.blender.org
- Big Buck Bunny: (c) direitos autorais 2008, Blender Foundation / www.bigbuckbunny.org