No ano passado, mostrei aos senhores como o Cloudinary é incrível para o fornecimento de mídia, otimização, filtros de imagem e transformações, Valor e ReagirSeja qual for a tarefa, o Cloudinary tem tudo o que o senhor precisa. Hoje, tenho o prazer de compartilhar que o Cloudinary anunciou um novo recurso enorme: uma solução completa de vídeo.
A solução de vídeo da Cloudinary se orgulha:
- Um sistema de ponta a ponta solução de gerenciamento de vídeo que permite que os desenvolvedores simplifiquem o fluxo de trabalho para usar vídeos em aplicativos da Web e móveis.
- A API integrada que oferece suporte a todo o ciclo de vida dos vídeos, desde o upload de vídeos em qualquer formato de qualquer dispositivo até o armazenamento com histórico de backup e revisão, transcodificação em tempo real, manipulações imediatas para se adequar a diferentes layouts de tela e requisitos de design, streaming com taxa de bits adaptável, distribuição global, monetização e análise
- Reprodutor de vídeo amigável ao desenvolvedor com aparência e comportamento personalizados
- Transcrição automática de vídeos para reprodução automática no modo mudo
- Marcação automática
- Transmissão ao vivo pela Web e por dispositivos móveis
Como sempre, o Cloudinary permite que os desenvolvedores usem suas APIs em uma série de linguagens: Node.js, PHP, Python, JavaScript do lado do cliente, etc. Vamos dar uma olhada nos recursos e como eles são usados!
Streaming adaptativo
O Cloudinary permite que o senhor transmita vídeo em qualquer tamanho e formato (4K, Full HD, HD, SD). Com essas personalizações, juntamente com a largura de banda e a capacidade da CPU detectadas na máquina do cliente, o Cloudinary pode servir de forma inteligente o conteúdo de vídeo que melhor corresponda a todos esses recursos:
var cld = cloudinary.Cloudinary.new({ cloud_name: 'cloud' }) // Initialize player var player = cld.videoPlayer('example-player') // Modify player source and play. player.source('oceans', { sourceTypes: ['hls'], transformation: { streaming_profile: 'hd' } }).play();
Lembre-se também de que o Cloudinary oferece entrega otimizada de servidores em todo o mundo, portanto, seu vídeo será reproduzido rapidamente desde a entrega inicial até o próprio fluxo de vídeo!
Criando listas de reprodução
A criação de listas de reprodução é uma ótima maneira de organizar o conteúdo do seu vídeo e fazer com que os espectadores continuem a percorrer um caminho de mídia, seja por meio de cursos educacionais ou de uma simples visualização cronológica. Usar o recurso de lista de reprodução da solução de vídeo do Cloudinary é tão fácil quanto adicionar objetos a uma matriz:
// Define Playlist Sources var source1 = { publicId: 'oceans', info: { title: 'Oceans', subtitle: 'My Oceans Movie' } }; var source2 = { publicId: 'book', info: { title: 'My Book', subtitle: 'Wonderful book movie' } }; // Initialize player var player = cld.videoPlayer('example-player'); /* Auto advance to next video after 0 seconds, repeat the playlist when final video ends, and present upcoming video 5 seconds before the current video ends. */ player.playlist([source1, source2], { autoAdvance: true, repeat: true, presentUpcoming: 5 });
A listagem de vídeos é exibida sob o vídeo principal, mostrando o título, a duração e os efeitos de foco – uma exibição padrão realmente elegante que não exige nenhum trabalho especial do senhor!
Conteúdo recomendado
O recurso de conteúdo recomendado é o meu recurso favorito em sites de vídeo, especialmente do ponto de vista de um provedor de conteúdo; o efeito “perder-se no YouTube”, ou seja, assistir a cada vez mais conteúdo, é um efeito direto dos recursos de conteúdo recomendado. Mais reproduções podem se transformar em mais conversões, seguidores e compartilhamentos, o que é uma coisa boa.
// Define Playlist Sources var source1 = { publicId: 'oceans', info: { title: 'Oceans', subtitle: 'My Oceans Movie' } }; var source2 = { publicId: 'book', info: { title: 'My Book', subtitle: 'Wonderful book movie' } }; // Recommendations can be as simple as an array of other // video source objects source1.recommendations = [source2] // For async fetching of recommendations // (e.g. fetching from database), promises can be used source2.recommendations = new Promise((resolve, _) => { console.log('Going to database...'); setTimeout(() => { console.log('Fetched source from database.', source1) resolve([source1]); }, 3000); }) // Initialize player var player = cld.videoPlayer('example-player', { autoShowRecommendations: true }); player.source(source1);
Assim como criar listas de reprodução, criar recomendações lógicas é muito simples!
Eventos e análises
A coleta de informações sobre a visualização e o progresso do vídeo pode fornecer insights sobre os hábitos do espectador, a eficácia do conteúdo ou simplesmente uma boa maneira de armazenar o ponto em que o usuário parou pela última vez, para que o senhor possa reproduzir um vídeo de onde ele parou na última sessão. O senhor pode rastrear eventos de reprodução de vídeo, pausa, busca, porcentagem reproduzida e tempo de reprodução:
var player = cld.videoPlayer('example-player', { analytics: { // Enable player analytics events: ['play', 'Pause', { type: 'percentsplayed', percents: [10, 50, 75, 100] }, // Some events may have additionals settings 'Start', 'Ended'] } }); // Modify player source player.source('oceans').play();
O armazenamento e o uso dessas informações podem ajudar a melhorar a usabilidade ou a fornecer o conteúdo mais popular.
Configuração do jogador
Como acontece com todas as mídias servidas pelo Cloudinary, o player de vídeo e qualquer mídia associada a ele é superpersonalizável. Desde opções de pôster, reprodução automática, transformações de vídeo, análises, controles e assim por diante, o player de vídeo e a mídia que ele serve serão personalizados de acordo com sua marca e gosto. Confira o lista completa das opções de configuração disponíveis.
Novo player de vídeo do Cloudinary e seus recursos são incríveis – não vi nenhuma solução, incluindo o YouTube, que dê ao usuário tanto controle sobre exibição de vídeo e ainda permite que o senhor crie suas próprias recomendações por vídeo. Além de todos os outros recursos incríveis que eles oferecem, essa nova solução de vídeo contribui para um serviço já incrível.