# Working with motion graphics overlays
Motion graphics overlay

You can use the motion graphics overlay feature to superimpose a motion image onto the video in a MediaLive channel. The motion image is based on an HTML5 motion graphic asset. 

To set up for motion graphics overlay, you must perform work in two areas: 
+ You must choose an *HTML5 authoring system*. You must use this authoring system to prepare an HTML5 asset, and you must continually publish the asset to a location outside of MediaLive. 
+ On MediaLive, you must enable motion graphics in each channel where you want to include a motion graphic overlay.

After you have started the channel, you use the [schedule](working-with-schedule.md) feature in MediaLive to insert the motion graphic in the running channel. As soon as the schedule receives the action, MediaLive starts to download and render the content. It continually downloads and renders the content for as long as the motion graphics action is active. At any time, you can deactivate the image by creating a deactivate action in the schedule.

## Pricing


There is a charge for running a channel that has the motion graphics overlay feature [enabled](mgi-prepare-channel.md). There is a charge even when there is no motion graphics overlay currently inserted in the channel.

The charge is based on the largest video output in the channel.

To stop this charge, you must disable the feature.

For information on charges for using this mode, see the MediaLive price list. https://aws.amazon.com/medialive/pricing/

**Topics**
+ [

## Pricing
](#mgi-pricing)
+ [

# Step 1: Prepare the motion graphic asset
](mgi-prepare-asset.md)
+ [

# Step 2: Enable the feature
](mgi-prepare-channel.md)
+ [

# Step 3: Insert the overlay
](mgi-insert-overlay.md)

# Step 1: Prepare the motion graphic asset


You use an authoring system to create the asset and to manage the content, including implementation of features such as fade or opacity. 

MediaLive's role in displaying the graphics overlay is limited to rendering the asset, and to inserting it and removing it from the video at the specified times. MediaLive doesn't provide any features for manipulating the motion graphic.

**To prepare the motion graphic asset**

1. Use the authoring system to create the asset. The HTML5 content must meet these requirements:
   + It can be any HTML5 authoring system that uses standard browser-based rendering techniques. 
   + It can use any HTML5 tags except video and audio.
   + It can incorporate Javascript to interact with a backend system that provides the ability to dynamically control the asset that is being published to the source URL. 
   + You should size the content to match the width and height of the largest video rendition in your channel. MediaLive can't change the resolution of the asset to fill the frame, although it will resize content down to fit a smaller video rendition without cropping.

1. Publish the motion graphic asset to a source URL that is accessible via a public IP address.

1. Make a note of the location. You will need it when you add the schedule action.

1. If the location of the motion graphics asset requires login in order to download files, obtain the required user name and password. Make a note of the credentials. You will need them when you add the schedule action.

# Step 2: Enable the feature


Perform this step for each MediaLive channel where you want to insert a motion graphic overlay. 

**Note**  
The information in this section assumes that you are familiar with the general steps for creating a channel, as described in [Creating a channel from scratch](creating-channel-scratch.md). 

**To enable the feature**

Follow this procedure when you create the channel or when you are modifying an existing channel.

1. Display the **General channel settings** section and choose the **Motion graphics configuration** pane.

1. Turn on the **Enable motion graphics configuration**. More fields appear.

1. Set the fields as follows:
   + **Motion graphics insertion** – Set to **Enabled**.
   + **Motion graphics settings** – Leave the value as **HTML motion graphics** (the only option).

   For detailed information about this section of the **Create channel** page on the console, see [Complete general settings](creating-a-channel-step3.md).

   When you create or save the channel, it will be set up for motion graphics overlay. This means that when you add an action to the channel schedule, the option for motion graphics will appear in the list in the **Action type** field.

**Important**  
When you save a channel that has the motion graphics overlay feature enabled, there is a charge for the feature that applies when the channel is running, even when there is no motion graphics overlay currently being inserted.  
To stop this charge, you must disable the feature.

**To disable the feature**

To disable the motion graphics feature, turn off the **Enable motion graphics configuration** field.

# Step 3: Insert the overlay


When you are ready, you can create an action in the MediaLive channel schedule to activate (insert) the overlay. You can create the action at any time – before the channel has started or while it is already running.

The schedule is a timetable that is attached to each channel. The schedule is designed to let you specify actions to perform on the channel at a specific time. You can set up the action so that a motion graphic is active for a specific time, or so that it is active indefinitely. In both cases, you can stop the overlay at any time by creating a deactivate action.

For detailed information, see [Creating an AWS Elemental MediaLive schedule](working-with-schedule.md) and [Creating actions in the schedule (console)](schedule-using-console-create.md).