Le Blog Amazon Web Services

Améliorez votre diffusion en direct avec l’habillage dynamique HTML5

L’ajout d’habillages dynamiques HTML5 à du contenu diffusé en direct est devenu une méthode populaire pour mettre en valeur les diffusions linéaires. Cette popularité est largement due à la facilité de création. Comme ces éléments graphiques sont construits à l’aide de technologies web standard, les créateurs de contenu n’ont plus besoin d’utiliser des outils propriétaires de création ou de rendu. Parmi les cas d’utilisation courants, citons l’ajout des scores et des statistiques d’équipe à des événements sportifs, la création de bandeaux déroulants pour une chaîne d’information, l’affichage de bannières “en ce moment” et “à suivre”, ou simplement l’ajout d’un logo de chaîne. En réponse à la demande croissante des clients, AWS a ajouté la prise en charge de l’habillage dynamique HTML5 à son service de traitement vidéo dans le Cloud AWS Elemental MediaLive et à sa solution on premise AWS Elemental Live.

Les éléments graphiques sont définis dans une page Web HTML5. Par exemple, l’activation ou la désactivation d’éléments individuels, la mise à jour des scores et le réglage de l’opacité sont tous contrôlés dans la page. AWS Elemental MediaLive et AWS Elemental Live superposent ensuite les graphiques à la vidéo pendant l’encodage. L’approche générale de l’activation des graphiques sur MediaLive et Elemental Live est comparable, à quelques différences près.

Activation de l’habillage dynamique avec MediaLive

Pour commencer à utiliser MediaLive, vous devez d’abord activer l’option d’habillage dynamique située dans la section des paramètres généraux de la configuration de votre chaîne MediaLive. Une fois cette option activée, MediaLive déploie les ressources supplémentaires nécessaires pour superposer les éléments graphiques au démarrage de la chaîne.

Vous utilisez ensuite les actions du programmateur pour contrôler la source des graphiques et quand les activer et les désactiver. À l’aide de l’action Motion Graphics Activate, vous définissez l’URL de la page Web ainsi que les informations d’accès si nécessaire. Vous spécifiez également la durée (en millisecondes) pendant laquelle les graphiques restent à l’écran. Si vous spécifiez une durée nulle, MediaLive continuera à superposer les graphiques jusqu’à ce que vous programmiez une action de désactivation des graphiques ou que vous arrêtiez la chaîne. Vous pouvez également utiliser les SDK AWS ou l’AWS CLI pour contrôler les actions du programmateur.

Activation de l’habillage dynamique avec Elemental Live

Depuis plusieurs années, Elemental Live est capable d’insérer des éléments graphiques animés à partir de sources SWF, MOV et PNG. La version 2.21.0 GA améliore cette capacité pour inclure le rendu à partir de sources HTML. Comme avec MediaLive, vous activez cette option au niveau de la chaîne, mais avec Elemental Live, vous spécifiez également votre URL d’entrée dans la configuration de la chaîne (événement).

Vous définissez ensuite si Elemental Live doit activer immédiatement la superposition graphique au démarrage de la chaîne et, éventuellement, activez le contrôle via le point de terminaison motion_image_inserter de l’API REST et/ou les marqueurs SCTE-35 présents dans le flux entrant. Avec le contrôle SCTE-35, des messages SCTE-35 ou SCTE-104 peuvent être insérés en amont de l’encodeur pour spécifier les points du flux où la superposition doit être activée ou désactivée, avec ou sans spécification d’une durée. Dans le cas d’un marqueur SCTE-35, le système réagira aux messages time_signal() avec un segmentation_type_id de 0x38 (Provider Overlay Placement Opportunity Start) et 0x39 (Provider Overlay Placement Opportunity End).

Tarification

Pour MediaLive, l’habillage dynamique est facturé à l’usage, pour la durée d’exécution d’une chaîne dont la fonction habillage dynamique est activée, que les graphiques soient actifs ou non. Reportez-vous à la page de tarification de MediaLive pour plus de détails.

Pour Elemental Live, l’habillage dynamique HTML5 est inclus avec une licence additionnelle Motion Graphics payante. Cette licence perpétuelle permet d’utiliser des habillages dynamiques pour n’importe quelle chaîne fonctionnant sur l’appareil. Il est important de tenir compte de l’impact de l’habillage dynamique sur la densité des chaines, Elemental Live allouera des ressources de calcul pour le traitement de l’habillage dynamique et, selon votre configuration, cette charge supplémentaire peut réduire le nombre de chaînes simultanées que vous pouvez exécuter sur chaque appareil.

Vous pouvez générer vos propres pages HTML5, ou pour démarrer rapidement ou pour des fonctionnalités plus avancées telles que les modèles graphiques et les mises à jour pilotées par un opérateur ou des données, vous pouvez utiliser des solutions tierces telles que LIGR Systems, Singular.live et Videoflow.

Si vous avez des questions, des commentaires ou si vous souhaitez participer à des discussions avec d’autres membres de la communauté, visitez les forums des développeurs AWS : Media Services.