Crie uma experiência integrada de reprodução com várias visualizações

Olá! Meu nome é Julia, sou AVFoundation engineer. Vou mostrar como criar uma experiência interessante no seu app com vários reprodutores. As pessoas gostam de ver eventos ao vivo de diferentes perspectivas, como competições esportivas, ou assistir a vários canais ao mesmo tempo. Uma experiência de visualização múltipla consiste em reproduzir simultaneamente várias transmissões de áudio e vídeo. Uma caso de uso é transmitir um mesmo evento de várias perspectivas. Por exemplo, um jogo de futebol com áudio do narrador e vídeos de dois ângulos diferentes do campo. Nesse caso, é importante sincronizar a reprodução entre os streams. Assim, alinhamos momentos importantes. Podemos citar ainda streams sincronizados como shows de vários ângulos ou uma palestra exibida na tela principal com um stream em língua de sinais.

Outro caso de uso da visualização múltipla é reproduzir streams de eventos distintos. Por exemplo, mostrar provas de atletismo e natação nas Olimpíadas, com música de fundo. Nesses casos, os streams de áudio e vídeo não precisam estar sincronizados uns com os outras. O AVFoundation e o AVRouting têm APIs para facilitar a criação de experiências avançadas com visualização múltipla. Vou abordar essas APIs neste vídeo. Começarei com a sincronização da reprodução em vários streams. Falarei sobre como direcionar visualizações múltiplas com o AirPlay. Por fim, explicarei como otimizar a qualidade da reprodução para vários reprodutores.

Ao exibir vários streams que precisam estar coordenados, como um jogo, é fundamental manter todos os reprodutores sincronizados para alinhar momentos importantes. Isso significa que ações como reproduzir, pausar e buscar devem ser coordenadas. No entanto, esse processo pode ser complexo. Além de mudanças de velocidade e buscas, também é preciso gerenciar comportamentos avançados. O AVPlaybackCoordinationMedium, do framework AVFoundation, facilita a sincronização da reprodução em vários reprodutores. Ele gerencia mudanças de velocidade e avanços no tempo, além de travamentos, interrupções e sincronizações ao iniciar. Vou mostrar como usar o AVPlaybackCoordinationMedium para coordenar vários reprodutores no seu app.

Nas demonstrações deste vídeo, vou usar ângulos diferentes de um trem passando por cenários com plantas, objetos e pontos de referência. O exemplo do trem ajuda a ilustrar como conteúdo com visualização múltipla pode ser visto de vários ângulos. Na demonstração de coordenação, vou inserir vários ângulos filmados ao redor do trilho, como se estivesse assistindo a um jogo esportivo e quisesse adicionar outros ângulos das câmeras. Este é um app para iPad com diferentes streams de vídeo de um trem de brinquedo andando no trilho. Começo reproduzindo uma visão aérea do trilho. Quero ver mais ângulos do trem, então adiciono uma visão lateral. O segundo stream se alinha ao stream já em reprodução. Adiciono ainda dois outros ângulos gravados ao redor do trilho. Cada novo stream já entra sincronizado. Se eu pauso, todos os reprodutores também pausam. Vendo de perto, percebo o trem em vários ângulos nos quatro reprodutores. No canto superior esquerdo, na visão aérea, vejo o trem próximo ao topo da mesa, perto das plantas. Nos outros ângulos, vejo o trem entrando na parte reta dos trilhos e se aproximando do macaco por trás. Observando a data e hora de cada vídeo, confirmo que todos estão sincronizados.

Agora pressiono Reproduzir, e todos os reprodutores iniciam juntos. Posso assistir ao trem perfeitamente coordenado em vários ângulos.

Em seguida, avanço 10 segundos. A cada ação, os reprodutores permanecem sincronizados.

Mesmo que eu saia do app no iPad e mude para Picture In Picture, os streams permanecem sincronizados.

Se eu voltar ao app, todos os vídeos continuam sincronizados.

Isso também funciona em interfaces do sistema, como a tela Reproduzindo. As ações de reprodução também ficam coordenadas. Posso pausar e reproduzir, e os reprodutores se mantêm em sincronia. Coordenar todos os reprodutores cria uma ótima experiência para o usuário. Na demonstração, mostrei o exemplo do trem passando pelos pontos de referência. No mundo real, isso vale para eventos esportivos, streams de língua de sinais ou outros casos com visualização múltipla com coordenação de reprodução. Depois de mostrar como isso funciona na prática, vou explicar como implementar no seu app. A API AVPlaybackCoordinationMedium se baseia na arquitetura de VPlaybackCoordination que já existe para o SharePlay. Cada AVPlayer possui um AVPlaybackCoordinator que negocia o estado entre o reprodutor e outros reprodutores conectados. Para saber detalhes sobre o playback coordinator, veja o vídeo “Coordenar experiências de mídia com atividades em grupo”. Se houver vários reprodutores, o coordinator gerencia o estado remoto para garantir que todos estejam sincronizados. O AVPlaybackCoordinationMedium comunica as mudanças de estado para todos os coordenadores. O coordination medium repassa os estados de um coordenador para os demais, mantendo todos sincronizados. Isso é feito por meio de mensagens. O coordination medium passa mensagens entre os reprodutores sobre mudanças importantes, como velocidade, tempo e outros estados. Por exemplo, se um reprodutor pausa, ele envia essa informação ao coordination medium. Então, o coordination medium repassa isso para todos os outros coordenadores conectados. Os coordenadores aplicam o novo estado de reprodução. Assim, todos os reprodutores permanecem sincronizados em conteúdo com visualização múltipla coordenado. Implementar isso exige apenas algumas linhas de código. Começo configurando os AVPlayers, cada um com um recurso diferente. Aqui, estou usando dois vídeos. Um para uma visão aproximada e outro para uma visão aérea. Configuro-os separadamente e com recursos diferentes. Depois, crio o coordination medium. Conecto cada reprodutor ao coordination medium usando o método coordinate. Esse método pode incluir erros, então é importante resolvê-los. Faço o mesmo para o segundo reprodutor, a visão aérea. Agora, os playback coordinators estão conectados ao coordination medium, e as ações em cada reprodutor ficam sincronizadas. Basta executar uma ação em um reprodutor, e os outros replicam. Aqui, usei dois reprodutores, mas você pode conectar mais. O AVPlaybackCoordinationMedium é ótimo para coordenar a reprodução com visualização múltipla.

Falarei sobre ferramentas que servem para qualquer visualização múltipla, coordenada ou não. O AirPlay permite uma ótima experiência externa de reprodução. As pessoas podem transmitir vídeos em uma tela maior em casa ou o áudio em um HomePod. É importante direcionar a visualização certa para cada dispositivo. Vou mostrar como implementar o AirPlay no app com experiências com visualização múltipla. Vamos ver isso na prática. No exemplo que mostrarei, estou assistindo a um vídeo de visão aérea e um vídeo aproximado do trilho. Ambos os vídeos estão sendo reproduzidos no iPad. Porém, quero transmitir o vídeo por AirPlay do iPad para a Apple TV. O receptor AirPlay só aceita um stream, então prefiro exibir a visão aérea na TV para enxergar detalhes. Reproduzo os dois vídeos no iPad e transmito-os em uma Apple TV. Neste caso, a visão aproximada permanece no iPad e a visão aérea será exibida na TV, já que é minha visão preferida. Se eu quiser trocar o vídeo que aparece na TV, posso alternar os streams atualizando a visão preferida para a aproximada, e os dois vídeos trocam de lugar. No app para iPad, é só pressionar o botão de estrela, que define a visão aproximada como preferida. Agora, seleciono. A visão aproximada aparece na TV, e a visão aérea fica no iPad. Também posso pausar e reproduzir e, se os streams são coordenados, permanecem sincronizados. Este é um exemplo de reprodução coordenada. Porém, streams com visualização múltipla não coordenados também funcionam bem com o AirPlay. O AVRoutingPlaybackArbiter, do framework AVRouting, facilita a integração do AirPlay em experiências com visualização múltipla. O arbiter garante que a visualização múltipla funcione bem com o AirPlay ou outros dispositivos que aceitam só um vídeo ou áudio. Ele gerencia as trocas para o vídeo ou áudio correto. O AVRoutingPlaybackArbiter cuida das preferências em rotas de áudio não mixáveis. Essas são rotas de áudio em que só um stream pode tocar e não tocam áudio simultâneo no receptor. O arbiter também gerencia rotas externas de vídeo com restrição. São rotas onde só um stream de vídeo pode tocar, como o vídeo do AirPlay e adaptadores de Lightning para AV Digital. No caso da visualização múltipla, como nos vídeos do trem, posso ter uma visão aérea e aproximada. Quero que a visão aérea tenha prioridade sempre que usar o AirPlay. Primeiro, obtenho o singleton do playback arbiter. Depois, defino a visão aérea como preferredParticipantForExternalPlayback, uma propriedade do arbiter. Assim, ao direcionar para a Apple TV, a visão aérea vai para a TV e os demais continuam localmente no iPad. Da mesma forma, se houver vários reprodutores e a visão aérea precisar priorizar o áudio, obtenha o singleton do arbiter e defina a visão aérea como preferredParticipantForNonMixableAudioRoutes. Se o conteúdo com visualização múltipla estiver sendo reproduzido no iPad e eu direcionar o áudio para um HomePod, o áudio da visão aérea será reproduzido. Agora vou mostrar como usar a API. Primeiro, configuro dois AVPlayers: uma visão aproximada e uma aérea. Depois, obtenho o singleton do playback arbiter via AVRoutingPlaybackArbiter. Quero ver o vídeo aéreo na TV ao usar o AirPlay, então o defino como preferido. Quero ouvir o áudio dele no HomePod, então também o defino como preferido para áudio não mixável. Neste exemplo, escolhi o mesmo reprodutor para ambas as propriedades, mas eles podem ser diferentes. Com o AVRoutingPlaybackArbiter, garanta uma integração perfeita com o AirPlay e a reprodução externa no seu app com visualização múltipla. Agora, vou explicar como gerenciar a qualidade desses streams. Ao assistir conteúdo com visualização múltipla, alguns streams são mais importantes que outros. Em um jogo esportivo, por exemplo, um dos streams pode ser a visão aérea. Os outros dois podem ser diferentes ângulos do campo e uma visão aproximada da torcida.

Neste exemplo, valorizo mais a visão aérea do campo. Quero ver claramente e com alta qualidade. Para mim, a visão aproximada da torcida é menos importante, então aceito uma qualidade mais baixa. No cenário de visualização múltipla, diferentes reprodutores exigem diferentes qualidades. Isso é indicado pela propriedade networkResourcePriority do AVPlayer. Vou explicar em detalhes como isso funciona. Cada reprodutor consome banda de rede ao transmitir conteúdo. Se fossem do mesmo tamanho, poderiam consumir uma quantidade igual de banda e tocar com a mesma qualidade. Mas cada reprodutor pode demandar diferentes necessidades de banda e qualidade. Para auxiliar nisso, defina o networkResourcePriority no AVPlayer. Cada reprodutor começa com prioridade padrão. Você pode definir o nível como alta ou baixa. Alta significa que o reprodutor precisa de mais recursos de rede e que uma resolução alta é essencial. Baixa indica que o mínimo de banda é suficiente e que a alta resolução não é fundamental.

Vou mostrar um exemplo com o networkResourcePriority. Primeiro, crie um AVPlayer e defina sua prioridade. No exemplo do jogo, a visão aérea é a mais importante, então está com prioridade alta. A visão aproximada da torcida é menos importante, então defino como baixa. Com isso, a visão aérea terá prioridade de banda mais alta, e a visão aproximada prioridade mais baixa. Essas prioridades indicam qual reprodutor deve receber mais recursos ao alocar a banda da rede. A distribuição da banda depende de outros fatores, como número de reprodutores, tamanho do vídeo, hardware, entre outros. Agora, faço uma demonstração das prioridades de rede em ação. Neste exemplo, mostro o trem na visualização múltipla, o que pode se aplicar também a esportes e outros cenários com níveis de qualidade diferentes.

Estou assistindo a dois streams: uma visão aérea do trilho e uma visão aproximada do trem. É importante que eu veja o trem sem perder nada, por isso quero a visão aérea bem nítida. Defino a prioridade de recursos de rede da visão aérea como alta. Os dois vídeos estão em alta resolução neste momento. As tags de resolução aparecem na parte inferior. Se houver conexão fraca com a rede e banda limitada, a visão aproximada à direita reduz a resolução primeiro. Veja isso acontecendo agora. A visão aérea, mais importante, à esquerda, mantém a resolução alta. Ao definir a prioridade de recursos de rede do reprodutor, você controla melhor a qualidade do stream. As APIs do AVFoundation e AVRouting permitem criar experiências com visualização múltipla perfeitas. Agora que você conhece essas funções da visualização múltipla, como coordenação de reprodução, integração do AirPlay e otimização da qualidade, crie e aprimore seu app com ele.

Use o AVPlaybackCoordinationMedium para criar experiências com visualização múltipla sincronizadas e interessantes. Sincronize vários ângulos de câmera do seu evento esportivo favorito. Explore o AVRoutingPlaybackArbiter integrando o AirPlay ao seu app com visualização múltipla. Leve a reprodução de vários streams, como vídeos em ASL, à tela grande. Ajuste e otimize a qualidade alocando corretamente a banda da rede. Garanta a máxima qualidade dos streams importantes. Estamos ansiosos para conferir as incríveis experiências de visualização múltipla que você vai criar. Agradeço por assistir!