Content Playout

This page is related to Content creation tool present on DiVA, HMP350, and HMP300 devices.

Introduction

A Playout represents a full-screen composition made of a background layer with one or more app zones on top of it. The content creation tool comes with several horizontal and vertical Playouts templates already included - these can be freely used with or without user content and can be customized by adding, removing, or repositioning the app zones around.

• The background layer can be anything from a solid color to one or multiple media assets.
• The apps can be positioned anywhere within Playout without overlapping other app zones.

To get to the Playout page, either create a new Playout or modify an existing one - once here, you can edit the Playout structure.

New Playout

New Playout

To create a new Playout, click on the "New Playout" button in the Create page.

This will open the new Playout selection pop-up with the following elements:

1. Horizontal/Vertical selections icons

   Those icons let the user choose between horizontal and vertical Playouts

2. Search box

   The search box can be use to quickly find specific Playout using names and keywords (like rss for instance)

3. The Playout view

   List of available Playouts. Click on a Playout to select it.

Playout details page

Use Playout

The user can reach this page either after creating a new Playout or by clicking on an existing Playout in the Create page.

The page is composed of the following elements:

1. Top bar menu
2. Playout preview

   The Playout preview let the user see how the Playout will be displayed on the screen.

   It can also be used to select an apps to be highlighted and modified in the right panel (#3)

   User can also drag and drop media from the media selection view (#4) to update Media app in the Playout.

3. Edit panel

   The edit panel shows the list of configurable Apps and modifiable properties.

   The content of the panel depends on the Apps used in the Playout and their type.

4. Media view

   Display all available media to be used in the Playout.

   It is possible to drag and drop any media from the media view to an Media app in the Preview (#2).

   It is also possible to import media from explorer either using drag and rop of the "Upload Media" button (#5)

5. Actions buttons

   The following actions are possible:

   • Upload new media. This button is shown only when an Media app is selected. The uploaded media will be added to the the Apps and the the media view (#4)
   • Edit Playout: This button let the user edit and customize the Playout as explained in Edit Playout.
   • Setup: This button let the user change properties of the Playout such as name and keywords.
   • Copy: This button creates a new Playout as a copy of the current Playout. The original Playout will not be modified.
   • Save: This button save the current Playout. It is only visible if something has been modified.

6. Help button

   The help button is available on all pages and provide an inline help on all the functionality of the page.

Edit Playout

Edit Playout

This page let the user customize the Playout by rearranging the combination of Apps.

The page is composed of the following elements:

1. Top bar menu
2. Playout edit zone

   The edit zone let the user move and resize and apps present in the Playout.

   When clicking on an Apps its properties will open in the edit panel (#3)

   The user can drag and drop Apps from the Apps view (#4) to add them to the Playout

   It is not possible to have overlapping Apps. In case two apps overlaps, they are show in red, and must be moved or resized to enable the OK button (#5)

3. Apps properties zone

   This zone shows the list of Apps available in the Playout.

   Except the background, the Apps can be moved up and down or removed using the arrow and cross icon.

   The content of the Edit panel always contains the name and coordinates of the Apps. The second part of the panel depends on the Apps parameters.

4. Apps view

   Display all available Apps to be used in the Playout.

   It is possible to drag and drop any Apps from the Apps view to the Edit zone (#2) to add it to the Playout.

5. Actions buttons

   The following actions are possible:

   • Swap Horizontal: This button will swap horizontally the selected Apps. If no Apps are selected all the Playout is swap.
   • Swap Vertical: This button will swap vertically the selected Apps. If no Apps are selected all the Playout is swap.
   • Fill Horizontal: This button will increase the horizontal size of the Apps to fill all available space. This button should not be used on overlapping apps. If no Apps are selected the action is done on all the Apps of the Playout.
   • Fill Vertical: This button will increase the vertical size of the Apps to fill all available space. This button should not be used on overlapping apps. If no Apps are selected the action is done on all the Apps of the Playout.
   • Setup: This button let the user change properties of the Playout such as name and keywords.
   • OK: This button goes back to the initial Playout page.