O guia definitivo para streaming em HTML5

 

O HTML5 é a plataforma mais popular para a reprodução de vídeo. Este guia definitivo ajudá-lo-á a pôr em prática o streaming em HTML5 que lhe permite chegar a qualquer dispositivo, em qualquer parte do mundo, a qualquer momento.

Seja qual for o ponto de vista, a transmissão em direto está a explodir. Prevê-se que, em 2018, mais de 1,9 mil milhões de utilizadores da Internet utilizem vídeo em linha. Prevê-se que as receitas mundiais do vídeo OTT atinjam mais de 20 mil milhões de dólares no próximo ano. Chegou o momento de apostar tudo no vídeo em linha.

Sete passos fundamentais para o streaming em HTML5

A transmissão de vídeo em direto pode ser confusa para os recém-chegados. Claro, há a forma mais fácil de o fazer: O streaming do Facebook, por exemplo, é um toque. Mas o Facebook Live e outras plataformas de transmissão social, como o Youtube Live, têm sérias limitações.

Se precisar de uma abordagem mais profissional, as coisas tornam-se um pouco mais complicadas. Algumas pessoas perdem-se no labirinto da linguagem técnica. Não sejas como eles. Com a preparação correcta – incluindo a leitura desta publicação – será capaz de navegar facilmente pela terminologia e tecnologia de transmissão em direto.

Este guia irá guiá-lo através de sete passos e considerações fundamentais para a transmissão em HTML5. Vamos começar!

1. Necessidades de equipamento

O primeiro elemento-chave da transmissão em direto é a utilização do equipamento correto. Vou enumerar aqui as categorias e indicar-lhe alguns recursos para aprender mais sobre estes temas.

Câmara

A primeira e mais importante peça de equipamento é a câmara de vídeo. A sua câmara pode ser tão simples como um smartphone ou tão complexa como uma câmara de cinema topo de gama. A escolha entre câmaras de transmissão em direto depende do evento que pretende transmitir, do número de câmaras necessárias, etc. Pode começar com uma pequena máquina, como uma Canon FS300 ou uma Sony DCR-HC1000. Se já estiver familiarizado com o streaming em HTML5, poderá querer considerar uma câmara PTZ (Pan-Tilt-Zoom).

Microfones

Também precisa de microfones para captar o áudio. Os inquéritos demonstraram que o áudio é um elemento essencial nos fluxos de vídeo no que respeita à perceção da qualidade. Pode utilizar o microfone incorporado nas suas câmaras de vídeo para áudio. No entanto, a qualidade nem sempre é a mesma e é preciso ter cuidado com o ruído de fundo. Considere a possibilidade de utilizar microfones fora da câmara de qualidade superior, como o Blue Yeti ou um microfone shotgunde qualidade , paragarantir a melhor qualidade de áudio possível.

Codificador

A próxima peça de equipamento necessária é um codificador. Existem dois tipos de codificadores: hardware e software.

Os codificadores de hardware são ideais tanto para situações móveis de execução como para utilização em estúdio topo de gama. Para a maioria das outras utilizações, uma aplicação de codificação de software instalada num computador, tablet ou smartphone satisfará provavelmente todas as suas necessidades.

O OBS Studio é uma aplicação de transmissão em direto capaz e gratuita. Clique aqui para saber mais sobre algumas das principais aplicações de transmissão em direto, incluindo o OBS. Se preferir um codificador de hardware, veja o pequeno“Cube” montado na câmara da Teradek, que é ideal para transmissão de desporto.

2. Ligação à Internet

Quando tiver o equipamento necessário resolvido, terá de arranjar uma ligação à Internet para a transmissão em HTML5. Esta ligação pode provir de várias fontes. Pode utilizar:

  • Uma rede Wi-Fi
  • Um cabo Ethernet
  • Uma rede celular (a 3G é demasiado lenta; é necessária uma ligação 4G LTE)

Se estiver a operar a partir de um local com acesso limitado à Internet (ou se estiver em movimento), pode ser difícil confiar neste tipo de ligações. A solução para este problema é a“ligação de rede“, que consiste em combinar várias ligações de rede numa única ligação, mais rápida e mais fiável.

3. Requisitos de largura de banda para evitar o armazenamento em buffer

Agora que está a pensar na sua ligação à Internet, tem de considerar a sua velocidade. Se a velocidade da sua Internet for demasiado lenta, a qualidade da sua transmissão em direto em HTML5 será limitada. Também pode criar problemas de armazenamento em buffer e vídeo com atraso. Apenas 8,2% dos espectadores regressam a um site no primeiro dia após uma falha de vídeo, em comparação com 11,2% que regressam após uma experiência funcional.

A velocidade da Internet é medida utilizando duas métricas diferentes: velocidade de descarregamento e velocidade de carregamento.

  • A transferência é a velocidade a que pode carregar dados para os seus dispositivos, como ver Netflix.
  • Upload é a velocidade a que pode enviar dados para o resto da Internet, como carregar um vídeo para o Instagram.

Para efeitos de produção de uma transmissão em direto, a velocidade de carregamento é o número mais importante. As velocidades de carregamento e descarregamento são medidas em Mbps, ou Megabits por segundo. Então, como pode medir a sua velocidade de carregamento? A maneira mais fácil é visitar o site TestMy.net e fazer o teste de velocidade de upload. Anote os seus resultados e depois volte aqui.

Qual é a sua velocidade de carregamento?

  • 25 Mbps ou superior – velocidade suficiente, pronta para a transmissão de 4K
  • 5-8 Mbps – suficiente para a transmissão em fluxo contínuo em 720p ou 1080p HD (Alta Definição)
  • 3 Mbps – suficiente para o streaming em definição standard de 480p
  • 1,5 Mbps – velocidade suficiente para uma resolução razoável de 360p
  • 500 Kbps – velocidade recomendada mais baixa; apenas o suficiente para transmitir vídeo

Estes números são apenas recomendações. A quantidade real de largura de banda necessária para o seu fluxo depende de uma série de factores. Para saber mais sobre a largura de banda, consulte o nosso guia completo sobre os requisitos de largura de banda para streaming.

4. Definições do codificador

Em seguida, vamos ver como configurar o codificador para obter a melhor qualidade com o mínimo de interrupções. Terá de adaptar as definições às suas necessidades específicas, mas eis algumas recomendações em termos de definições de codificador comuns:

Resolução de vídeo

As resoluções são apresentadas por tamanho, por exemplo, 640 x 360 pixéis (frequentemente designado por 360p) ou 1920 x 1080 pixéis (frequentemente designado por “Full HD” ou 1080p). Em geral, escolha a resolução mais elevada que a sua velocidade de carregamento pode suportar.

Taxa de bits

A taxa de bits tem uma interação com a resolução. São necessárias taxas de bits mais elevadas para “transportar” os dados necessários para fotogramas de vídeo de maiores dimensões. Pode utilizar os números apresentados na secção 3 para obter um valor aproximado para as suas definições de taxa de bits.

Taxa de fotogramas

De um modo geral, recomendamos que “defina e esqueça” a 30 fotogramas por segundo (fps). Se estiver a transmitir desporto, pode precisar de 60 fps.

Intervalo de fotogramas-chave

Recomendamos que defina o intervalo do fotograma-chave para 2-3 segundos.

5. Codecs de vídeo e áudio

Tecnicamente falando, um “codec” é uma ferramenta de hardware ou software que é utilizada para comprimir ou descomprimir vídeo. O H.264, por exemplo, é um codec normalizado. Todos os dispositivos modernos, navegadores Web, leitores de vídeo e televisores sabem descodificar o vídeo H.264.

O mesmo se aplica ao áudio. O codec de áudio moderno mais popular é o AAC, que comprime o áudio.

Em caso de dúvida, utilize H.264 e AAC para todas as suas necessidades de transmissão de vídeo. É fácil confundirmo-nos aqui. Por exemplo, o áudio AAC pode ser agrupado com um vídeo H.264 num “formato de contentor” para transmissão. Para se tornar um mestre da transmissão em direto, vale a pena ler a nossa breve introdução ao H.264, codecs e ficheiros de contentor.

6. Leitor de vídeo para todos os dispositivos

Outro elemento fundamental do fluxo de vídeo HTML5 é o próprio leitor de vídeo. O vídeo da Internet é reproduzido através de leitores de vídeo, tal como no seu ambiente de trabalho. É que estes leitores estão integrados nos sítios Web que visita. Antigamente, era necessário utilizar o Flash para o vídeo online. No entanto, era lento e vulnerável à pirataria informática.

Atualmente, a transmissão em HTML5 é uma alternativa muito melhor. As plataformas de vídeo online, como a Dacast, incluem um leitor de vídeo HTML5 compatível com todos os telemóveis, tablets e computadores, bem como com dispositivos como as Smart TVs. Para saber mais sobre os leitores de vídeo em fluxo contínuo HTML5 e as vantagens que oferecem, clique aqui.

7. Plataforma de vídeo em linha

O último elemento-chave para o streaming em HTML5 é uma plataforma de vídeo em linha. Também conhecidas como OVP, estas empresas funcionam como um mecanismo de entrega para os seus fluxos de vídeo. Um OVP fornece acesso a uma rede de servidores para fornecer o seu conteúdo em todo o mundo, minimizando o atraso e o armazenamento em buffer.

Também fornecem uma série de ferramentas. Algumas delas podem incluir coisas como análises para o ajudar a compreender quem são os seus espectadores e o que estão a fazer, monetização opções para o ajudar a gerar rendimentos com o seu vídeo, ferramentas de gestão para manter o seu conteúdo organizado e ferramentas avançadas como APIs de vídeo para que possa criar soluções personalizadas para problemas técnicos.

Conclusão: revisão da configuração

Em conclusão, vejamos estes elementos e a forma como funcionam em conjunto. Para iniciar o streaming em HTML5, é necessário reunir o equipamento: câmara, equipamento de áudio e codificador. Em seguida, tem de se ligar à Internet e certificar-se de que a sua ligação é suficientemente rápida para transmitir.

Uma vez concluído este passo, deve configurar o codificador com base na velocidade da sua Internet. Por último, deve ligar-se à sua plataforma de vídeo em linha e certificar-se de que está a utilizar um leitor de vídeo compatível com a transmissão HTML5.

É realmente tudo o que há para fazer! Alguma pergunta ou aditamento? Deixe-nos saber na secção de comentários! Obrigado pela leitura – e boa sorte com as suas transmissões em direto.

Max Wilbert

Max Wilbert is a passionate writer, live streaming practitioner, and has strong expertise in the video streaming industry.