Dynamic Watermark Demo: Add text to videos

Videos hosted through VdoCipher cannot be downloaded. There does however remain the risk of piracy from screen capture. Add text to videos with our dynamic watermark feature that effectively prevents users from pirating video content using screen capture, and goes a long way towards helping users protect their premium content.

The sample video below contains a dynamic watermark displaying User name, User IP and User email. The video is displayed using our WordPress plugin and same can be configured using APIs or moodle plugin as well.

The dynamic watermark can be customized for movement, color, size and transparency. You can try the watermark feature on your own website by signing up for a Free Trial on our home page.

Videos streamed on VdoCipher are protected from unauthorized downloads. Our WordPress plugin generates dynamic URLs which make it impossible for anybody to download the video content. If you have built your own video website from scripting languages such as Python, Ruby, PHP or .NET, you can refer our API page on how to embed secure videos to your website.

To integrate videos to your Android app you can use VdoCipher SDK for easy playback. Our video player also streams secure video in mobile browsers Chrome and Safari.

How watermarking works

While our videos cannot be downloaded, there does remain the possibility of screen capture softwares being used to pirate premium content. Our watermark feature eliminates the feasibility of piracy from screen recording softwares. By overlaying user identifiable information, such as name, IP and email address on top of the video, watermarking is an effective deterrent against piracy originating from screen capture. Our users value the watermarking feature as it provides immense revenue security for them.

Watermark Demo: Get started with adding a watermark (Add text to videos)

To generate a watermark or to add text to videos you essentially need a JSON string describing how and what you will overlay on your protected videos. In this blog we will be detailing how to integrate Dynamic and Static watermark to add text to videos.

Step 1 is to create the watermark code. Once you have created the watermark code, in Step 2 you add the watermark to the video. This is done by adding watermark code to the WordPress plugin settings (for WordPress users), or by adding it as part of OTP API call for VdoCipher API users.

Step 1: Create Watermark Code

We are assuming that you have uploaded your video to your VdoCipher account and are ready to embed the video either using WordPress plugin or implementing the API yourself. In both the cases, you would need to pass a JSON string as annotation code. The JSON string would contain all the information about the watermark. A JSON string is a universal form of representing structured data in a way that machines can understand.

Here is a sample JSON string that adds a moving (dynamic) watermark and a static watermark.

[

{'type':'rtext', 'text':'moving text', 'alpha':'0.8', 'color':'0xFF0000','size':'15','interval':'5000'},
{'type':'text', 'text':'static text', 'alpha':'0.5' , 'x':'10', 'y':'100', 'color':'0xFF0000', 'size':'15'}
]

Technically, this is an array of JSON objects, where each object describe a single annotation item.

Each of these items will be described by its parameters. Every item requires a type parameter which defines the type of watermark. The type of watermark can be either a moving text or a static text. The rest of the parameters depends on the type.

Following is a short description of how each parameter affects the display of text.

Moving text

The following code will display a dynamic watermark code, displaying name, IP and email address in a single line. The text color will be red (#ff0000), opacity is 0.8, and font-size is 15. The watermark is configured to update position every 5 seconds (5000ms).

[{
'type':'rtext',
'text':'{name}, {ip}, {email}',
'alpha':'0.8',
'color':'0xFF0000',
'size':'15',
'interval':'5000',
'skip':'2000'
}]

Type of text – Moving watermark

Set type parameter as rtext for Dynamic watermark

'type':'rtext',

Set the text to be shown

'text" : 'Enter whatever text you like to be displayed',

You can add user identifiable information, such as user name, user email and user IP.

• ‘text’: ‘{name}’,
• ‘text’: ‘{email}’,
• ‘text’: ‘{ip}’,

'text':'Name: {name}, email: {email}, IP: {ip}

To display the name, email and IP separately, and not in a single line, you can simply create 3 watermark objects, as follows:

[{'type':'rtext','text':'{name}','alpha':'0.8', 'color':'0xFF0000', 'size':'15', 'interval':'5000', 'skip':'2000'},
{'type':'rtext','text':'{ip}','alpha':'0.8', 'color':'0xFF0000', 'size':'15', 'interval':'5000', 'skip':'2000'},
{'type':'rtext','text':'{email}','alpha':'0.8', 'color':'0xFF0000', 'size':'15', 'interval':'5000', 'skip':'2000'}
]

Specify text opacity

This is the opacity of the text. For full opacity keep alpha value 1.

'alpha':'0.8',

Specify text color

This is the hex value of the watermark text color. You can pick your choice of color and its corresponding hex value from the following page on W3schools.

'color':'0xFF0000',

Specify the font size

This is the font size

'size':'15',

Specify the interval over which watermark changes position

The value is the interval in milliseconds when the text changes position

'interval':'5000',

Skip feature for watermark

It is possible to have watermark skip for some time between two overlays. Here is a sample code for it –

'skip':'2000'

Time stamp for watermark. (Only for WordPress)

[[{'type':'text', 'text':'Time: {date.h:i:s A}', 'alpha':'0.30' , 'x':'12', 'y':'130', 'color':'0xFF0000', 'size':'13'}]]

Add Custom Variables as Watermark

The following blog details how you can add text to videos or custom variables as watermark to your videos: Custom Variables as Watermark

Some important things to keep in mind about Watermark

• Note that both the name and the value of these parameters should be in quotes. This rule applies to both text as well as numbers.
• Each parameter is to be separated by comma. There should not be a comma after the last parameter for the dynamic watermark video settings.

Static text

[{
'type' : 'text',   //This defines the type of annotation item to static watermark
'text' : 'the text you like to be displayed',
'x' : '10',  //the distance from the left border of video.
'y': '50',  //the distance from the top border of video.
'alpha': '0.8', //the opacity of the rendered text, 0 is invisible, 1 is full opaque
'color':'0xFF0000',    //the color of the text specified as hexadecimal or uint
'size':'15' //Height of the text, in pixels.
}]

Step 2: Add Watermark Code to Video Request

If you are using our WordPress plugin you can simply add the watermark JSON in the plugin settings page. If you are integrating VdoCipher to your custom-built site, you would need to pass the JSON object as part of the OTP request.

The HTTP POST data containing watermark JSON object has to be sent as Content-Type: application/json. The JSON Object is to be sent as value to the key annotate. The header for the OTP request should include the Authorization using API Secret Key. A sample OTP request including watermark information is as follows.

POST https://dev.vdocipher.com/api/videos/{{videoID}}/otp HTTP/1.1
Authorization: Apisecret {{API_Secret_Key}}
Content-Type: application/json
Accept: application/json
{
	"annotate":"[{'type':'rtext', 'text':' {name}', 'alpha':'0.60', 'color':'0xFF0000','size':'15','interval':'5000'}]"
}

Replace the {{videoID}} and {{API_Secret_Key}} with video Id and API Secret Key respectively.

This blog: Protect Videos on WordPress provides more details on securing videos using WordPress.

Still having problems to add text to videos or with the dynamic watermark on video code? Send us the code you are using and the output you wish to be shown to support@vdocipher.com