× Initiating database migration review
× Database migration started




Videos with flat transparency are used as flat textures on solid models.


Transparent with chromakey

Videos can have transparency by using a chromakey background with a specific colour.
Typically, #00FF00 gives 100% transparency while #41BA11 gives smoke-like transparency. The background must be added in a video editing program or be supplied with the video.

For a more in-depth look read about the setChromakey function.



1. Add the files to the blipp:
scene.addRequiredAssets(['Intro.mp4', 'Intro.mp3']);

2. Assign the blend mode to a model (works for both video and image):
model.setChromakey([120, 0.8, 0.97, 72]); // 120 is the (H) hue value 

Chromakey.png is an opaque solid colour image of the same colour as used for the chromakey transparency, a fully transparent PNG will not work.

3. Play the video on the model as a texture
model.playVideo(filename, soundfilename, repeat, holdfirst, holdlast);
model.playVideo("Intro.mp4", "Intro.mp3", false, false, true); 

When a video ends, the model's onVideoTextureEnd event function will be called if present.

100% transparency

Smoke-like transparency

Transparency with add / multiply

Using the blend modes can help a lot with video textures as they are very compact and don’t require any kind of transparency.

Add blend mode:

This mode acts just like the "Linear Dodge (Add)" blend mode in Photoshop by making all the dark parts transparent, and the light parts shiny over the image. This way, by making the desired transparent parts of the video black (#000000), you can add sparkles, rays, fog etc... to a dark background or even camera view.

A snapshot from the video

The result
Multiply blend mode:

This mode acts just like the multiply blend mode in Photoshop by adding colour to the existing values. Note that this blend mode is much more intense in processing power than add so only use in strictly must use cases.