Support for Video Content with Transparency Elements

Situation Description

To create a unique and customized broadcast grid, the SmartPlayer team has developed and added a new feature for video content. For video content using transparency, a chroma key functionality allows part of the video to be replaced with transparent elements. Working with transparency thus enables a more personalized broadcast grid and diversifies the content displayed on the device.

This functionality is supported on devices running the following operating systems:

• Android
• Windows
• Linux
• Raspberry

Brief Overview of the Functionality

Chroma key (or "green screen") is a compositing technique used to highlight and replace the background of an image or video. During chroma keying, a specific color (often green or blue) is made transparent, allowing that background to be replaced with another image or video. This method is widely used in film and video production.

Action Steps

To start using this functionality, the user needs to log into the SmartPlayer personal account.
Next, the user should go to the "Content" section in the personal account and upload the appropriate video content by dragging and dropping it from local storage on the device.

Example of "Content" section display in SmartPlayer personal account

The content uploaded by the user will appear in the list of content available in the personal account for playback.

Example of uploaded content displayed in the personal account

After adding the content, the user should go to the "Broadcasts" section and select the "Create" category.

Example of "Broadcasts" section and "Create" category display

To create a broadcast, the user needs to select an area for content playback using a special icon.

Example of "Broadcasts" section and "Create" category display

The next step is to add two types of content: first, transfer content, such as an image, and then add video content with chroma key usage to the same area.

Example of properly configured broadcast for chroma key usage

Make sure to align the playback duration for both types of content in the broadcast, as shown in the screenshot above.

The user then needs to click on the video content in the zone to open the content settings toolbar on the right side of the screen.

Example of content settings toolbar display

In the opened settings toolbar, the user should select the "Content Settings" section.

Example of the "Content Settings" section display

After selecting "Content Settings," the user also needs to select the operating system of their device to locate the chroma key setting.

Example of settings with OS selection display

Once the correct OS settings are selected, the user will see the "Chroma Key" settings block. Two settings are available:

1. Checkbox for enabling/disabling chroma key
2. Color selection for chroma key – options: select color from palette, RGB model, HEX code

Example of chroma key settings display

When selecting the desired color for the chroma key, the user will be able to replace the portion of the video content that matches the chosen color with other content. It’s crucial to select a color from the palette that is as close as possible to the color the user wants to remove from the video content. If the color is selected incorrectly, the functionality may not work.

Once all settings are completed, the user should click the save button in the toolbar on the right and continue creating and configuring the broadcast for screen output.

Example of the "Save" button in chroma key settings

Связанная информация

Чтобы полностью ознакомиться с работой данной функциональности, пользователю необходимо запустить трансляцию с расписанием. Чтобы ознакомиться с описанными ранее шагами по созданию трансляции и расписания рекомендуется просмотреть следующие статьи из Wikipedia:

• Раздел "Устройства"
• Раздел "Контент на устройства"
• Раздел "Трансляции"
• Раздел "Расписание"

Видеоинструкция

Поддержка видеконтента с прозрачностью

Дополнительная информация

Если данная статья не помогает использовать функционал по назначению или после ее прочтения остаются вопросы можно озвучить данные вопросы в разделе "Обсуждения" вверху страницы.

Пример отображения вкладки "Обсуждения" на wiki-странице

Также дополнительную информацию можно узнать на странице Как взаимодействовать пользователю с разделом "Обсуждения"