1. Help Center
  2. Managing Your Brand

Creating and Uploading Animated Overlays

Enhance your content by adding engaging motion overlays in Slate. Learn how how to properly create, export, and use animated overlays.

What's in this article:

What is an animated Overlay?

An animated overlay is a fixed-position, motion overlay that can be uploaded to your Slate account to put on top of any piece of content. Animated overlays are .mov files. The max file size for video overlays is 100MB but we recommend staying under 80MB.

Types of Animated Overlays

There are two different types of animated overlays you can create: 

  • Looping Overlays: The animated overlay will loop for the length of your video
  • Non-Looping Overlays:  the animated overlay will play once and then freeze. The last frame of the the animated overlay will remain on screen for the remainder of the video.

To control looping, open up the overlay in your brand dashboard and toggle looping on or off.

Screenshot 2024-09-06 at 10.23.07 AM

TIP: If you want the animated overlay to play once then fully disappear, make the last frame blank.

Creating and Uploading Animated Overlays

England-1

You can create animated overlays in any of the 4 dimensions supported in Slate (9:16, 4:5, 1:1, 16:9). 

You will  want the majority of your animated overlay to be transparent in order to see the photo and video content underneath. Animated overlays that have a built in transparency is pretty new technology, and so if your team uses a mix of Android & iOS (for Mobile Creation), or Windows and Mac (for Web Creation), then two files will need to be uploaded to support all platforms.

  1. Create a video overlay in one of the available 4 dimensions in the video editing software of your choice
  2. a) If using the Android app or Windows Desktop for Web Creation – export your video using the Quicktime format and codec Apple Pro Res 4444 + Alpha.  This needs to be a .mov file. Your video overlay must be exported in this codec in order to work. This Android compatible animated overlay can easily be converted to an iOS compatible file in just two clicks - see below Converting an Overlay to HEVC
    b) If using the iOS app or Mac for Web Creation – export your video using the Quicktime format and codec HEVC + Alpha.  This needs to be a .mov file. Your video overlay must be exported in this codec in order to work. 
  3. Upload this file directly to the web brand dashboard! It may take 1-2 minutes to load for larger file sizes.
  4. If you run into any issues, send the .mov file to support@slateteams.com or your CSM. We'll handle loading it in for you!

The max file size for video overlays is 100mb but we recommend staying under 80mb. These will be compressed before being added to your app.

NOTE: If you have issues with the animated video overlay not maintaining its transparency after export, try exporting directly from After Effects or Premiere without using Adobe Media Encoder.

Converting a overlay to HEVC (iOS Compatible Animated overlay)

To convert an animated overlay that isn't compatible with Slate: 

  1. Right click on the video in your desktop folder
  2. Select 'Encode Selected Video Files' from the dropdown menu
    step 1 in macbook
  3. Under settings, select the drop down menu and change the file type to 'HEVC 2160p;'
  4. Check 'Preserve Transparency'
  5. Click 'Continue'
  6. The new file will export to the same folder the original file lives in
  7. Upload that overlay to Slate, and confirm it shows the Apple icon at the top corner
    step 2 in macbook-1
NOTE:  This conversion will only work on an Apple device.

How to Use an Animated Overlay

An animated overlay can be used the same way you would use a regular static overlay! Learn more about overlays here.

Available on:

WebIconiOSLogoAndroidLogo

FAQs:

Q: Are animated overlays part of my subscription?

A: Animated overlays are included in our Unlimited and Enterprise subscription tiers. Contact your account manager or email support@slateteams.com if you have any questions about upgrading your account

Q: Can I upload custom sized animated overlays?

 A: No. Although you can create in a custom workspace on web, overlays and templates are only supported in the sizes listed above (9:16, 1:1, 4:5, or 16:9).

Q: Can I control layering in the mobile app?

A: No, you don't have the ability to send things forward or back, and assets lay as they were designed. Therefore, overlays will always be on top of media.