El receptor reproduce contenido y refleja su estado al usuario. El destinatario debe responder de inmediato a las acciones en la app emisora . Por ejemplo, cuando el contenido está pausado en el receptor, muestra un ícono de pausa y, cuando el usuario presiona reproducir en la app emisora, el receptor comienza a reproducir el contenido y quita el ícono de pausa.
Ejemplos de comentarios sobre la IU del receptor:
- Reproduciendo
- En pausa
- Posición / búsqueda de reproducción
- Interrupciones por almacenamiento en búfer
IU del receptor
Obligatorio
A Coloca la mayoría de los elementos de la IU en el 1/4/3 de la pantalla
y mantén la coherencia con las demás UX.
B No presentes los elementos como controles interactivos. Por ejemplo, no reproduzcas la IU del emisor en la IU del receptor.
Prácticas recomendadas
- Usa transiciones (atenuación), transparencia y matices para suavizar el efecto visual.
- Considera el hecho de que los usuarios quieren ver la mayor cantidad de contenido posible. A menudo, los usuarios pausan el contenido para examinarlo, por lo que debes difuminar la IU innecesaria cuando sea posible.
Android
IU del remitente
IU del receptor
iOS
IU del remitente
IU del receptor
Chrome
IU del remitente
IU del receptor
App receptora inactiva
Se muestra una pantalla inactiva en el receptor, cuando este está conectado a un remitente, pero no transmite contenido.
Obligatorio
A Identifica la app receptora que se carga
Prácticas recomendadas
- Usa la pantalla inactiva para promocionar contenido o funciones de la app emisora.
- Cambia el contenido cada 30 a 60 segundos para mostrar más y evitar el efecto quemado de la pantalla.
- Desconéctate de la app receptora y deja de ejecutarse si está inactiva durante 5 minutos. Cuando se detiene, aparece la pantalla principal del receptor para ayudar a evitar el quema de pantalla.
Android
El diálogo de transmisión está conectado, pero no se está transmitiendo
App receptora cargada / inactiva
iOS
El diálogo de transmisión está conectado, pero no se está transmitiendo
App receptora cargada / inactiva
Carga de la app receptora
Cuando un usuario se conecta a un receptor, la app receptora debe cargarse primero antes de que pueda mostrar el estado inactivo de la app o comenzar a reproducir contenido.
Obligatorio
A Para identificar qué app receptora se está cargando mostrando el
logotipo de la app
B Identifica que la app receptora se está cargando mostrando
el ícono giratorio de carga animado
Android
Conectando el remitente
Cargando la app receptora
iOS
Conectando el remitente
Cargando la app receptora
Chrome
Conectando el remitente
Cargando la app receptora
Carga de contenido del receptor
Una vez que se carga la app receptora, el contenido puede comenzar a transmitirse a la app receptora.
Obligatorio
A Para identificar el contenido que se carga, muestra su título o material gráfico.
B Para identificar que el contenido se está cargando, muestra un ícono giratorio de carga animado.
Prácticas recomendadas
Cuando reanudes el contenido pausado, retrocede la reproducción de 5 a 10 segundos para que el usuario no se pierda nada durante la transición de un remitente a otro.
Android
Cargando el contenido del remitente
Cargando contenido del receptor
iOS
Cargando el contenido del remitente
Cargando contenido del receptor
Chrome
Cargando el contenido del remitente
Cargando contenido del receptor
Reproducción del receptor
Obligatorio
A Identifica lo que se reproduce cuando comienza el contenido
B Identifica la posición de reproducción cuando se ajusta la posición
C Identifica que el receptor está buscando contenido cuando se cambia la posición de reproducción, pero aún no se reproduce
Android
El remitente ajusta la posición de reproducción
Búsqueda de contenido del receptor
iOS
El remitente ajusta la posición de reproducción
Búsqueda de contenido del receptor
Chrome
El remitente ajusta la posición de reproducción
Búsqueda de contenido del receptor
Se pausó el receptor
Obligatorio
A Identifica si el contenido está en pausa mostrando un ícono de pausa y una posición de reproducción
B Identifica el contenido que está pausado mostrando su título o material gráfico
C Para identificar qué app receptora se carga mostrando un logotipo de la app
Prácticas recomendadas
- Con frecuencia, los usuarios pausarán el contenido para examinarlo, por lo que hará que la IU innecesaria se atenúe cuando se detenga durante unos segundos mostrando un ícono de pausa.
- La app receptora no debe continuar con la reproducción de contenido, a menos que haya una solicitud explícita del usuario para comenzar la reproducción, como reanudar o omitir un elemento en la cola.
- Desconéctala de la app receptora y detén su ejecución si está inactiva durante 20 minutos. Cuando se detiene, aparece la pantalla principal del receptor para ayudar a evitar el quema de pantalla. Almacena la ubicación de pausa para que el usuario pueda reanudar la reproducción a partir de ese momento.
Android
Remitente detenido
Se pausó el contenido del receptor
Remitente detenido
Se pausó el receptor después de 5 segundos
iOS
Remitente detenido
Se pausó el contenido del receptor
Remitente detenido
Se pausó el receptor después de 5 segundos
Chrome
Remitente detenido
Se pausó el contenido del receptor
Remitente detenido
Se pausó el receptor después de 5 segundos
Almacenamiento en búfer del receptor
El almacenamiento en búfer en el receptor se produce cuando la latencia de la red y otros factores provocan una demora en la reproducción.
Obligatorio
A Para identificar que el receptor está almacenando en búfer después de unos segundos, muestra un ícono giratorio de almacenamiento en búfer. Esperar unos segundos para indicar el almacenamiento en búfer evitará que el ícono giratorio de almacenamiento en búfer aparezca con demasiada frecuencia en condiciones de red deficientes.
Prácticas recomendadas
Identifica el contenido que se está almacenando en búfer si el almacenamiento en búfer continúa después de 5 segundos.
Android
El emisor indica el almacenamiento en búfer del receptor
Almacenamiento en búfer del contenido del receptor
iOS
El emisor indica el almacenamiento en búfer del receptor
Almacenamiento en búfer del contenido del receptor
Chrome
El emisor indica el almacenamiento en búfer del receptor
Almacenamiento en búfer del contenido del receptor
El receptor detiene la transmisión.
Cuando se detiene la reproducción o se agota el tiempo de espera, la IU del receptor debe promocionar otro contenido o funciones disponibles en la app emisora.
Obligatorio
A Muestra un logotipo de la app para identificar qué app receptora está cargada o inactiva
Prácticas recomendadas
- Usa la pantalla inactiva después de la reproducción para recomendar contenido o funciones de la app emisora en función de lo que se acaba de transmitir
- Cambia el contenido de la pantalla inactiva cada 30 a 60 segundos para evitar que la pantalla se queme
- Desconéctate de la app receptora y deja de ejecutarse si está inactiva durante 5 minutos. Cuando se detiene, aparece la pantalla principal del receptor para ayudar a evitar el quema de pantalla.
Android
App del remitente inactiva
App receptora inactiva
Se desconectó el remitente
Transmitir pantalla principal
iOS
App del remitente inactiva
App receptora inactiva
Se desconectó el remitente
Transmitir pantalla principal
Chrome
App del remitente inactiva
App receptora inactiva
Se desconectó el remitente
Transmitir pantalla principal
Las imágenes que se usan en esta guía de diseño son cortesía de Blender Foundation, y se comparten bajo los derechos de autor o una licencia Creative Commons.
- Elephant's Dream: (c) Copyright 2006, Blender Foundation / Países Bajos 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) Copyright 2008, Blender Foundation / www.bigbuckbunny.org