Поддержка видеконтента с прозрачностью/en: различия между версиями

Материал из SmartPlayer
(Новая страница: «Support for Video Content with Transparency Elements»)
 
Нет описания правки
 
(не показаны 3 промежуточные версии 2 участников)
Строка 1: Строка 1:
<div lang="ru" dir="ltr" class="mw-content-ltr">
<languages/>
== '''Описание ситуации''' ==
== '''Situation Description''' ==
Для создания индивидуальной и уникальной эфирной сетки команда SmartPlayer проработала и добавила новое решение для видеоконтента. На видеоконтенте с использованием прозрачности появиться возможность заместить часть видео с помощью функционала прозрачности реализованном в виде хромакея. Таким образом работа с прозрачностью позволит сделать эфирную сетку более индивидуальной и разнообразить выводимый на устройство контент.
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.
{{Note|Данный функционал поддерживается на устройствах под управлением следующих ОС:
{{Note|This functionality is supported on devices running the following operating systems:
* Android  
* Android  
* Windows
* Windows
* Linux
* Linux
* Raspberry|warn}}
* Raspberry|warn}}
== '''Краткая информация о функционале''' ==
== '''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''' ==
Чтобы начать работать с данной функциональностью пользователю необходимо авторизоваться в личном кабинете SmartPlayer.<br>
To start using this functionality, the user needs to log into the SmartPlayer personal account.<br>
Следующим шагом пользователю необходимо в раздел "Контент" личного кабинета и загрузить подходящий видеоконтент. Данное действие можно сделать, перетянув нужный контент из локального хранилища на устройстве с помощью drag-n-drop.
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.
[[File:Раздел_контент_в_личном_кабинетеSP.png|thumb|center| Пример отображения раздела "Контент" в личном кабинете SmartPlayer |800px]]
[[File:Раздел_контент_в_личном_кабинетеSP.png|thumb|center| Example of "Content" section display in SmartPlayer personal account |800px]]
Добавленный пользователем контент отобразится в списке доступного в личном кабинете контента для проигрывания.
The content uploaded by the user will appear in the list of content available in the personal account for playback.
[[File:Пример_загруженного_контента.png|thumb|center| Пример отображения загруженного контента в личный кабинет |800px]]
[[File:Пример_загруженного_контента.png|thumb|center| Example of uploaded content displayed in the personal account |800px]]
После переноса контента пользователь должен перейти в раздел "Трансляции" и выбрать категорию "Создать".  
After adding the content, the user should go to the "Broadcasts" section and select the "Create" category.  
[[File:Трансляции_и_категории.png|thumb|center| Пример отображения раздела "Трансляции" и категории "Создать"|800px]]
[[File:Трансляции_и_категории.png|thumb|center| Example of "Broadcasts" section and "Create" category display|800px]]
Для создания трансляции пользователю с помощью специальной иконки необходимо выбрать зону, в которой будет проигрываться контент.
To create a broadcast, the user needs to select an area for content playback using a special icon.
[[File:Добавить_зону.png|thumb|center| Пример отображения раздела "Трансляции" и категории "Создать"|800px]]
[[File:Добавить_зону.png|thumb|center| Example of "Broadcasts" section and "Create" category display|800px]]
Следующим шагом пользователю необходимо добавить два вида контента: первым перенести контент, например изображение, а вторым в ту же зону добавить видеоконтент, на котором планируем использовать хромакей.
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.
[[File:Пример_правильной_трансляции.png|thumb|center| Пример отображения правильно построенной трансляции для использования хромакея|800px]]
[[File:Пример_правильной_трансляции.png|thumb|center| Example of properly configured broadcast for chroma key usage|800px]]
{{Note|Нужно обязательно сравнять по длительности проигрывания оба контента в трансляции, как показано на скриншоте выше|warn}}
{{Note|Make sure to align the playback duration for both types of content in the broadcast, as shown in the screenshot above.|warn}}
Далее пользователю необходимо кликнуть на видеоконтент в зоне, чтобы открыть тулбар с настройками контента. Тулбар появиться с правой стороны экрана.
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.
[[File:Тулбар_с_контентом.png|thumb|center| Пример отображения тулбара с настройками контента|800px]]
[[File:Тулбар_с_контентом.png|thumb|center| Example of content settings toolbar display|800px]]
В открывшемся тулбаре с настройками пользователю необходимо выбрать раздел "Настройка контента".
In the opened settings toolbar, the user should select the "Content Settings" section.
[[File:Настройки_контента по ос.png|thumb|center| Пример отображения раздела "Настройки контента"|800px]]
[[File:Настройки_контента по ос.png|thumb|center| Example of the "Content Settings" section display|800px]]
Выбрав раздел "Настройки контента" пользователю также, нужно будет выбрать ОС на которой работает его устройство, чтобы найти настройку хромакея.
After selecting "Content Settings," the user also needs to select the operating system of their device to locate the chroma key setting.
[[File:Выбор_ос.png|thumb|center| Пример отображения настроек с выбором ОС|800px]]
[[File:Выбор_ос.png|thumb|center| Example of settings with OS selection display|800px]]
Выбрав нужную настройку по ОС пользователю, откроется блок настроек "Хромакей". В нем доступно для настройки два параметра:
Once the correct OS settings are selected, the user will see the "Chroma Key" settings block. Two settings are available:
# Чекбокс (галочка) активации/деактивации использования хромакея
# Checkbox for enabling/disabling chroma key
# Выбор цвета для хромакее - доступно: выбор цвета из палитры, RGB - модель, HEX - код
# Color selection for chroma key – options: select color from palette, RGB model, HEX code
[[File:Настройки_хромакея.png|thumb|center| Пример отображения настроек хромакея|800px]]
[[File:Настройки_хромакея.png|thumb|center| Example of chroma key settings display|800px]]
{{Note|Выбрав нужный цвет для хромакея, пользователь сможет заместить часть воспроизводимого контента, соответствующего выбранному цвету на другой контент. Очень важно подбирать цвет в палитре максимально близкий к тому цвету, который пользователь хочет убрать из видеоконтента и заменить его на другой контент. Если цвет будет подобран некорректно, существует вероятность что функционал не будет работать.|warn}}
{{Note|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.|warn}}
После завершения всех настроек пользователю необходим нажать на кнопку сохранить в тулбаре справа и продолжить создание и настройку трансляции для вывода ее на экран.
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.
[[File:Кнопка_сохранить_хромакей.png|thumb|center| Пример отображения кнопки "Сохранить" в настройках хромакея|800px]]
[[File:Кнопка_сохранить_хромакей.png|thumb|center| Example of the "Save" button in chroma key settings|800px]]
</div>
== '''Related Information''' ==
<div lang="ru" dir="ltr" class="mw-content-ltr">
To fully understand how this functionality operates, the user needs to launch a scheduled broadcast. For information on the steps for creating a broadcast and schedule, the following Wikipedia articles are recommended:
== '''Связанная информация''' ==
Чтобы полностью ознакомиться с работой данной функциональности, пользователю необходимо запустить трансляцию с расписанием. Чтобы ознакомиться с описанными ранее шагами по созданию трансляции и расписания рекомендуется просмотреть следующие статьи из Wikipedia:
* [[Раздел "Устройства"]]
* [[Раздел "Устройства"]]
* [[Раздел "Контент на устройства"]]
* [[Раздел "Контент на устройства"]]
* [[Раздел "Трансляции"]]
* [[Раздел "Трансляции"]]
* [[Раздел "Расписание"]]
* [[Раздел "Расписание"]]
== '''Видеоинструкция''' ==
== '''Video Tutorial''' ==
[https://www.youtube.com/watch?v=Een5iHvZBt8 Поддержка видеконтента с прозрачностью]
[https://www.youtube.com/watch?v=C38NVEkNvOo Supporting Video Content with Transparency]
== '''Дополнительная информация''' ==
== '''Additional Information''' ==
Если данная статья не помогает использовать функционал по назначению или после ее прочтения остаются вопросы можно озвучить данные вопросы в разделе "Обсуждения" вверху страницы.
If this article does not help in using the functionality as intended, or if there are still questions after reading, users can ask questions in the "Discussions" section at the top of the page.
[[File:Обсуждение_видеоконтента_с_прозрачностью.png|thumb|center| Пример отображения вкладки "Обсуждения" на wiki-странице |800px]]
[[File:Обсуждение_видеоконтента_с_прозрачностью.png|thumb|center| Example of "Discussions" tab display on a wiki page |800px]]
Также дополнительную информацию можно узнать на странице [[Как взаимодействовать пользователю с разделом "Обсуждения"]]
Additional information can also be found on the page [[How to interact with the "Discussions" section]]
</div>

Текущая версия от 12:52, 30 октября 2024

Другие языки:

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

Related Information

To fully understand how this functionality operates, the user needs to launch a scheduled broadcast. For information on the steps for creating a broadcast and schedule, the following Wikipedia articles are recommended:

Video Tutorial

Supporting Video Content with Transparency

Additional Information

If this article does not help in using the functionality as intended, or if there are still questions after reading, users can ask questions in the "Discussions" section at the top of the page.

Example of "Discussions" tab display on a wiki page

Additional information can also be found on the page How to interact with the "Discussions" section