Falling text effect

Hi guys.
I made another tutorial video based on a falling text made in Hitfilm Express
I tried reproduce some effects like slow down text speed and blur when text show up
The project files are in video description.


Very nice effect! :+1:
And well explained in your tutorial.
Thanks for reproducing it for Shotcut.
Oh! and thanks for the MLT file.

1 Like

Thanks for sharing, it is a vey nice effect and very well explained

One trick is to add an “Unpremultiply Alpha” filter after the “Blur: Box” to make the blur effect look better
it will give blur in the same color as the text, insted of black

Screenshot from 2022-04-08 07-59-26

with “Unpremultiply Alpha”
Screenshot from 2022-04-08 07-59-33


Nice tutorial, @guilherme - well paced, and very useful for a lot of users. Thank you!

1 Like

Thanks for the tip!
I’ll try to use it

1 Like

@guilherme brilliant tutorial - thank you so much :smiley:

@TimLau excellent tip :smiley:

1 Like

I updated the project file with @TimLau 's suggestion. Thanks Tim

1 Like

Without taking anything away from @guilherme and his excellent tutorial, this falling text effect can be also be done via a HTML file.

In this demo the falling text is slower, but the speed can be changed. Also the font, etc etc. Here’s a demo. Apologies for the low-quality cat video! If anyone would like to know how I did it - I hope to post here with details, as soon as I can find a moment. I will also post the HTML file I used.


Advantage of HTML method - you can easily use long words!

That is so clever. Thank you :+1:

Where’s the html file? Like how do you do this in Shotcut… I watched the videos, I read your posts in this thread, but I couldn’t find how to do it

1 Like

Hi @patc3 - good point - seems I forgot to post it. I’ll search for it. It doesn’t appear to be on my present computer. I’ll dig out a backup hard drive and have a look. Should be on there but it may take a few hours. Hang in there…

1 Like

No problem and no stress… but I’m super curious! Didn’t even know you could do stuff with HTML in Shotcut

Oops, apparently there used to be an HTML filter for text, but it’s now been deprecated

Bonjour @patc3,
Allez voir ce topic de @jonray:
"Flip and Spin" Text Effect - VERSION 2 (more user-friendly)
24 titres animés.
On peut contourner la disparition du filtre Texte: HTML.
Je ne retrouve pas le lien du mode opératoire, mais voici le pack (@Elusien, @Namna ), ainsi que le PDF explicatif en français, que j’avais adapté pour ma sœur, fan de ces animations !
HTML Text.zip (549.7 KB)

Hi @patc3
Check out this topic from @jonray:
"Flip and Spin" Text Effect - VERSION 2 (more user-friendly)
24 animated titles.
It’s possible to workaround the removal of the Text: HTML filter.
I can’t find the link, but here’s the pack (@Elusien, @Namna ), as well as the explicative PDF in French, which I had adapted for my sister, a fan of these animations!

1 Like

Merci beaucoup Serge, je regarderai dès que je peux en fin de semaine

Hi @patc3 ,
I found the HTML file!
Falling text effect by JonRay with code by elusien- Supercalfragilistic.html.txt (2.4 KB)

Instructions for use:

  1. Download the file. Remove the fake “txt” extension, leaving you with an html file.

  2. Double-click the file. Your browser will open and you should see the animated text (white on a black background).

  3. Using screen capture software, record the whole screen (I use ShareX or OBS). Save as an MP4 video. It should look like this*:

  4. In Shotcut - on V1 place your background video, image, or colour clip.

  5. On V2 import the screen capture MP4.

  6. To this, apply a crop:rectngle filter (use “transparent”) and crop out the unwanted edges of the MP4.

  7. Apply a Blend Mode filter set to “Add” - OR a chromakey:simple filter, to remove the black background.

Problems and tips:
*The HTML file is set for the font “Anton”. You may not have that font installed, in which case you will see the text with a default “Times Roman” font:

You can change the font in line 33 of the HTML file:
eg change “anton” to “arial”. (Don’t use quotation marks).

TIP: Use “Print my fonts” or a similar utility to see all fonts installed on your computer - and the name of each font to type in line 33… The HTML animation will show ANY font you have installed.

To CHANGE the text.
In the HTML, (Line 79), simply replace “supercali…” to any text you like.

TIP - use Notepad++ to edit the text (alternatively, any text editor will do). Remember to SAVE the HTML file once you have made changes.
Good luck!

1 Like

Wow nice, thanks a lot! That’s quite simple. Also it just occurred to me if I find another trick to generate animated text/title screen, I can simply record my screen.