{"id":37740,"date":"2025-06-09T07:00:00","date_gmt":"2025-06-09T14:00:00","guid":{"rendered":"https:\/\/cloudinary.com\/blog\/?p=37740"},"modified":"2025-06-09T08:27:35","modified_gmt":"2025-06-09T15:27:35","slug":"workflow-animated-overlays-video-ads","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/workflow-animated-overlays-video-ads","title":{"rendered":"Building a Workflow for Testing Animated Overlays on Video Ads"},"content":{"rendered":"\n

Video ads need to grab attention fast, as viewers often decide within seconds whether to keep watching or scroll past. A plain video sometimes isn\u2019t enough, so some advertisers will add animated overlays such as CTAs, logos, and visual effects.<\/p>\n\n\n\n

The problem is that manually adding these overlays with video editing software is slow and inefficient. Every small tweak means going back, making changes, re-exporting, and re-uploading. This becomes even more challenging when managing multiple ads across different platforms.<\/p>\n\n\n\n

To make this process easier, you can use transformation parameters<\/a> to apply overlays like different CTAs and promo messages dynamically with simple URL changes, eliminating the need to edit (and re-edit) the base video. <\/p>\n\n\n\n

This guide walks you through how to create and test overlays using Cloudinary Studio<\/a>, deploy variations with dynamic URLs<\/a>, and track performance to optimize your ads.<\/p>\n\n\n\n

Create and Test Overlays in Cloudinary<\/h2>\n\n\n\n

You can enhance images, videos, and other media using transformation parameters. <\/p>\n\n\n\n

But what are these parameters, and how do they work? They\u2019re simple modifications you can add to an image or video URL to apply changes dynamically. Instead of editing files manually, you can adjust overlays, resize elements, or apply effects just by tweaking a URL.<\/p>\n\n\n\n

They follow this syntax:<\/p>\n\n\n

https:\/\/res.cloudinary.com\/YOUR_CLOUD_NAME\/video\/upload\/transformation_params\/your-video.mp4<\/span><\/code><\/span>Code language:<\/span> JavaScript<\/span> (<\/span>javascript<\/span>)<\/span><\/small><\/pre>\n\n\n
Set Up a Transformation in Cloudinary<\/h2>\n\n\n\n
If you haven\u2019t already, sign up for a free Cloudinary account<\/a> or log in. Then, navigate to the Transformation Center<\/strong> in your dashboard and click New Transformation<\/strong>.<\/p>\n\n\n\n
\"\"\/
Cloudinary\u2019s Transformation Center<\/figcaption><\/figure>\n\n\n\n
Switch from the Image<\/strong> tab to the Video<\/strong> transformation screen by clicking the video icon:<\/p>\n\n\n\n
\"\"\/
Switch to the video transformation screen in Cloudinary<\/figcaption><\/figure>\n\n\n\n
Here, you can add text layers, image overlays, or other effects. Cloudinary provides a default sample video on this page, allowing you to preview transformations before applying them to your own videos.<\/p>\n\n\n\n
Let\u2019s add a “New Arrivals\u201d text overlay to a video. This preview screen shows how the transformation will look before applying it to multiple videos.<\/p>\n\n\n\n
Click the Text Layer<\/strong> action and fill in the form:<\/p>\n\n\n\n
While you can go through the documentation<\/a> to learn all the possibilities (which is definitely useful), you can also use the Transformation Center<\/strong>, a visual tool where you can apply transformations without writing any code. Just fill out a few fields, and Cloudinary takes care of the rest.<\/p>\n\n\n\n