Crea una experiencia de reproducción multivista fluida

Hola, soy Julia, ingeniera de AVFoundation. En este video, explicaré cómo crear una experiencia de usuario atractiva en tu app en varios reproductores. A la gente le gusta tener múltiples perspectivas de evento en vivo, como competiciones deportivas o varios canales. La reproducción con multivisualización permite usar varias transmisiones de video y audio simultáneamente. Un caso de uso es reproducir múltiples transmisiones diferentes del mismo evento. Imagina un partido de fútbol donde escuchas al locutor y ves dos ángulos de cámara diferentes del campo a la vez. En este caso, es importante sincronizar la reproducción entre las transmisiones. Así, se alinean los momentos importantes. Otros ejemplos incluyen conciertos con múltiples ángulos de cámara o discursos con contenido principal y lenguaje de señas en simultáneo.

Otro caso de uso es reproducir múltiples transmisiones diferentes de distintos eventos. Puedes usar multivista para ver eventos diferentes a la vez, como atletismo y natación en los JJ. OO., y música de fondo. En estos casos, no es necesario sincronizar las transmisiones de audio y video entre sí. AVFoundation y AVRouting cuentan con una API que facilita la creación de experiencias de reproducción de multivisualización enriquecidas. Revisaré estas API en este video. Sincronizaré la reproducción en varias transmisiones. Luego, analizaré cómo administrar el enrutamiento en múltiples vistas para AirPlay. Por último, compartiré cómo optimizar la calidad de reproducción en múltiples reproductores.

Para una experiencia multivista coordinada, como un evento deportivo, es fundamental sincronizar la reproducción de las transmisiones para que los momentos importantes se alineen. Todos los comportamientos de reproducción, como reproducir o pausar, deben estar coordinados. Pero este puede ser un proceso complicado. Además de los cambios de velocidad y las búsquedas, también debo administrar comportamientos complejos. AVPlaybackCoordinationMedium, de la estructura AVFoundation, facilita la sincronización precisa de la reproducción entre varios reproductores. Maneja la coordinación de cambios de velocidad y saltos de tiempo, así como otros comportamientos complejos como estancamientos, interrupciones y sincronización de inicio. Mostraré el uso de “Medio de coordinación de reproducción AV” para que sincronices varios reproductores en tu app. En este video, utilizaré el ejemplo de diferentes ángulos de cámara de un tren sobre vías moviéndose a través de distintas escenas, como plantas y otros objetos y puntos de referencia. Este ejemplo de tren permite ilustrar cómo podría verse el contenido de multivisualización con varios ángulos de cámara. En la demostración de coordinación, agregaré múltiples ángulos de cámara que se grabaron alrededor de la vía del tren, como si estuviera viendo un juego de deportes y quisiera agregar diferentes ángulos de cámara de un juego. Esta es una app para iPad con varias transmisiones de video diferentes de un tren de juguete andando por la vía. Comienzo con una vista aérea de la vía del tren en reproducción. Quiero ver más ángulos del tren, así que agrego una vista lateral de la vía. La segunda transmisión coincide con la transmisión que se está reproduciendo. Agregaré dos ángulos de cámara más grabados alrededor de la pista. Cada transmisión adicional se une en sincronización. Si hago una pausa, todos los jugadores harán una pausa sincronizada. Si miro más de cerca, puedo ver el tren desde múltiples ángulos en los cuatro jugadores. En la parte superior izquierda, la vista aérea, observo que el tren está cerca del borde de la mesa, junto a las plantas. Desde otros ángulos de cámara, puedo ver que el tren está empezando a entrar en la parte recta de las vías y se acerca al mono por detrás. Al ver la marca de tiempo de cada video, puedo confirmar que todos son al mismo tiempo.

Reproduzco, y todos los reproductores comenzarán a reproducir sincronizados. Puedo ver el tren en perfecta coordinación desde distintos ángulos.

Ahora, emitiré una búsqueda hacia adelante de 10 segundos. Con cada una de las acciones, los reproductores permanecen sincronizados.

Incluso si salgo de la app de iPad y cambio a una vista de imagen en imagen, las transmisiones permanecen sincronizadas.

Si regreso a la app, todos los videos siguen reproduciéndose sincronizados.

Esto incluso funciona bien en todas las interfaces del sistema, como con la interfaz En reproducción. Los comportamientos de reproducción también están coordinados. Puedo pausar y reproducir, y los reproductores permanecen sincronizados. Coordinar todos los reproductores crea una excelente experiencia de usuario. En la demostración, mostré un ejemplo con un tren que se mueve por los puntos de referencia. En un escenario del mundo real, estos podrían ser eventos deportivos, transmisiones en lenguaje de señas u otros casos de uso de multivisualización en los que desees coordinar la reproducción. Ahora que repasamos cómo se ve en acción, te mostraré cómo crear esta experiencia en tu app. La “API AV Playback Coordination Medium” se basa en la arquitectura AVPlaybackCoordination existente para SharePlay. El AVPlayer tiene un AVPlaybackCoordinator que negocia entre el estado de reproducción del reproductor y de todos los demás reproductores conectados. Para conocer más detalles sobre el coordinador de reproducción y cómo funciona, consulta el video “Coordinate media experiences with Group Activities”. Si hay varios reproductores de video, el coordinador de reproducción se encarga de administrar el estado remoto y se asegura de que todos los reproductores estén sincronizados entre sí. “AV Playback Coordination Medium” informa los cambios de estado a través de los coordinadores. El medio de coordinación pasa estados de un coordinador a los demás coordinadores y los mantiene a todos sincronizados. Esto se consigue mediante la mensajería. El medio de coordinación pasa mensajes entre reproductores para cambios de estado importantes, como velocidad de reproducción, tiempo y otros cambios de estado. Por ejemplo, si se pausa un reproductor, envía ese mensaje al medio de coordinación. Luego, el medio de coordinación enviará esto a todos los demás coordinadores conectados. Los coordinadores de reproducción manejarán y aplicarán el estado de reproducción. De esta manera, todos los reproductores pueden permanecer sincronizados al reproducir contenido de multivisualización coordinado. Implementar esto simplemente requiere unas pocas líneas de código. Primero configuro los AVPlayers, cada uno con un activo diferente. Aquí estoy usando dos videos. Uno de una toma de primer plano y otro para una toma a vista aérea. Los estoy configurando por separado con diferentes activos. A continuación, creo el medio de coordinación. Luego, conecto a cada reproductor al medio de coordinación usando el método de coordenadas. Este método puede generar errores, por lo que es importante manejarlos. Por último, haré lo mismo para el segundo reproductor, la vista aérea. Ahora, los coordinadores de reproducción están conectados al medio de coordinación y las acciones de cada reproductor estarán sincronizadas. Solo debo llamar a una acción de un reproductor y todos los otros reproductores conectados harán lo mismo. En este ejemplo solo usé dos reproductores, pero puedes conectar más. AVPlaybackCoordinationMedium es ideal para coordinar la reproducción de multivisualización.

A continuación, hablaré de herramientas que se pueden aplicar a todo tipo de reproducción de multivisualización, tanto coordinada como no coordinada. AirPlay permite una increíble experiencia de reproducción externa. Las personas pueden direccionar transmisiones de video a una pantalla más grande en su hogar o direccionar una transmisión de audio a un HomePod. Es importante direccionar la vista correcta al dispositivo correcto. Repasaré cómo dar soporte a AirPlay en tu app con experiencias de multivisualización. Veámoslo en acción. En el ejemplo que mostraré, estoy viendo un video de vista aérea y un video de una pista en primer plano. Ambos videos se están reproduciendo en el iPad. Ambos videos se están reproduciendo en el iPad. Pero quiero transmitir el video en AirPlay desde el iPad al Apple TV. El receptor AirPlay solo admite una única transmisión, por lo que si lo direcciono, prefiero que el de vista aérea se reproduzca en la pantalla grande para ver todos los detalles con mayor claridad. Comienzo la reproducción de dos videos en el iPad y los direcciono a un Apple TV. Cuando lo haga, la vista de primer plano continuará reproduciéndose en el iPad. El video en vista aérea se reproducirá en la pantalla grande, ya que es mi reproductor preferido. Para cambiar el video en el televisor, solo actualizo el reproductor preferido a la transmisión deseada y los videos intercambiarán lugares. En esta app para iPad, se hace presionando el botón de estrella, que establecerá el video de primer plano en el reproductor preferido. Ahora lo selecciono. La transmisión de primer plano se reproducirá en el televisor, y la vista aérea se reproducirá en el iPad. Puedo pausar y reproducir, y si las transmisiones están coordinadas, permanecerán sincronizadas. Este es un ejemplo de un caso de uso de reproducción coordinada. Pero las transmisiones de multivisualización no coordinadas también funcionan con AirPlay. AVRoutingPlaybackArbiter, que es parte de la estructura AVRouting, te permite integrar fácilmente la compatibilidad con AirPlay para las experiencias de multivisualización. El árbitro de reproducción garantiza que la multivisualización funcione sin problemas con AirPlay u otras experiencias de reproducción externas que solo admiten una única transmisión de video o audio. Administra las complejidades de cambiar a la transmisión de video o audio correcta. AVRoutingPlaybackArbiter es responsable de administrar y aplicar las preferencias en rutas de audio no mezclables. Se trata de rutas de audio en las que solo se puede reproducir una sola transmisión de audio y no es posible la reproducción de audio simultánea en el receptor. El árbitro de reproducción también maneja rutas de video de reproducción externa restringidas. Son rutas en las que solo se puede reproducir una única transmisión de video en el receptor, como con los adaptadores de video AirPlay y AV digital Lightning. En un caso de reproducción de multivisualización, como en el caso de los videos de varias vistas del tren, podría tener un video de vista aérea y múltiples tomas de primeros planos. Quiero que la vista aérea tenga prioridad siempre que reproduzca un video en AirPlay. Primero, obtengo el elemento individual del árbitro de reproducción. A continuación, establezco la vista aérea como “preferredParticipantForExternalPlayback”, una propiedad del árbitro de reproducción. Ahora, si direcciono a un Apple TV desde el iPad mientras reproduzco contenido de multivisualización, la vista aérea envía el video al Apple TV mientras los otros videos continúan reproduciéndose localmente en el iPad. De forma similar, si hay varios reproductores y la vista aérea debe tener prioridad de audio, primero obtengo el elemento individual del árbitro de reproducción y establezco el reproductor de vista aérea en “preferredParticipant ForNonMixableAudioRoutes”. Si se reproduce contenido de multivisualización y direcciono el audio a un HomePod desde el iPad, se reproducirá el audio de la vista aérea. Ahora, un ejemplo de cómo usar esta API. Primero, configuré dos AVPlayers, uno de primer plano y otro de vista aérea. Y obtengo el elemento individual del árbitro de una instancia de AVRoutingPlaybackArbiter. Quiero ver el video de vista aérea en la pantalla grande cada vez que direcciono a AirPlay, así que lo configuro como el participante preferido para reproducción externa. Y quiero escuchar su audio si direcciono a un HomePod, así que también lo configuro como participante preferido para rutas de audio no mezclables. Aquí, elegí el mismo reproductor para ambas propiedades, pero se puede configurar para reproductores diferentes. A través del AVRoutingPlaybackArbiter, garantiza una integración perfecta de AirPlay y otras experiencias externas de reproducción de audio y video en tu app de multivisualización. A continuación, te contaré cómo administrar la calidad de estas transmisiones. Al ver contenido con multivisualización, algunas transmisiones pueden ser más importantes que otras. Al ver un partido deportivo en multivisualización, una transmisión puede ser una vista aérea del campo. Otras dos podrían ser de diferentes perspectivas del campo y otra podría ser de primeros planos del público.

En este caso, importa más la vista aérea del campo. Quiero verlo más claramente y reproducirlo con mayor calidad. Importan menos los primeros planos del público, así que no necesito verla en detalle y no importa si se reproduce con una calidad menor. En un escenario de multivisualización, diferentes reproductores pueden tener diferentes calidades. Indica esto configurando networkResourcePriority de AVPlayer. Veamos en detalle cómo funciona esto. Cada reproductor consume ancho de banda de red al transmitir contenido. Si los reproductores tuvieran el mismo tamaño, sería mejor que cada uno consumiera la misma cantidad de ancho de banda de red y reprodujera con la misma calidad. Sin embargo, cada reproductor puede tener diferentes necesidades de ancho de banda y calidad de red. Para respaldar esto, configura networkResourcePriority de AVPlayer. Cada reproductor comienza con un nivel de prioridad predeterminado. Puedes establecer el nivel de prioridad en alto o bajo. Con un nivel de prioridad alto, el reproductor requiere un alto nivel de recursos de red y la transmisión en una resolución de alta calidad es fundamental. Un nivel de prioridad bajo implica que el reproductor requiere un ancho de banda de red mínimo y que la transmisión con una resolución de alta calidad no es tan fundamental.

Mostraré un ejemplo de cómo puedes lograr esto con networkResourcePriority. Primero, crea un AVPlayer y, luego, configura la networkResourcePriority del reproductor. En el ejemplo del partido, la vista aérea del campo es lo más importante: configuro esa prioridad en alta. Los primeros planos del público son menos importantes, por eso la configuro en baja. Así, la vista aérea del campo tendrá una prioridad de red más alta, y la vista del público tendrá una más baja. Las prioridades de red indican al sistema qué reproductor priorizar al asignar ancho de banda. La distribución exacta del ancho de banda de red considera varios factores: número de reproductores, tamaño de la capa de video, limitaciones de hardware, entre otros. A continuación, haré una demostración de las prioridades de la red en acción. Mostraré el ejemplo de multivisualización del tren, y esto puede extenderse al ejemplo del juego deportivo y a otros escenarios de multivisualización, donde se requieren diferentes calidades de reproducción. Estoy viendo dos transmisiones diferentes: una vista aérea de la vía y una vista cercana del tren. Quiero poder ver el tren sin perderme nada: quiero verlo desde arriba con claridad. Establecí la prioridad de recursos de red de la vista aérea en alta. Los videos se están reproduciendo en este momento en alta resolución. Las etiquetas de resolución están en la parte inferior de los videos. Si encuentro malas condiciones de red y el ancho de banda de la red es limitado, la vista de primer plano a la derecha cambiará primero a una resolución más baja. Puedo ver que eso sucede ahora. La vista aérea “más importante” de la izquierda conservará una resolución de alta definición. Al configurar la prioridad de red de un reproductor, tienes más control sobre la calidad de la transmisión. Las API AVFoundation y AVRouting que analizamos funcionan en conjunto, lo que te permite crear experiencias de multivisualización sin inconvenientes. Ahora que vimos las funciones avanzadas de multivisualización, que incluyen coordinación de reproducción, integración de AirPlay y optimización de calidad, crea y mejora tu propia app con multivisualización. Usa AVPlaybackCoordinationMedium para crear experiencias de multivisualización sincronizadas. Sincroniza múltiples ángulos de cámara de tu evento deportivo favorito. Explora AVRoutingPlaybackArbiter para mejorar una app de multivisualización con integración AirPlay. Lleva la reproducción de varias transmisiones, como transmisiones ASL, a la pantalla grande. Ajusta y optimiza la calidad de reproducción mediante la asignación de ancho de banda de la red. Asegúrate de que las transmisiones importantes se reproduzcan en alta calidad. Esperamos ver las emocionantes experiencias de reproducción de multivisualización que crearás. Gracias por acompañarnos.