@jonray I have created a (fairly) simple HTML file to produce an animation of squares (similar to yours, like opening and shutting panes in a window). I call it “Window Panes” or a “Jonray Grid”.
It is parameterized. By default white panes appear with black surrounds. You can change the color(s) e.g. to create a green-screen animation. You can record this animation (e.g. using the HTML as a browser-source in OBS Studio, or by using a screen recording app like Sharex) and then use the resulting video as a black and white overlay in a video editor such as Shotcut, using the “Multiply” blend mode.
The parameters are:
let opening_order = [12, 9, 2, 15, 6, 11, 10, 1, 7, 14, 3, 5, 13, 4, 8]; /* THERE SHOULD BE (cols x rows) VALUES AND NO DUPLICATES */
--width : 1920px;
--height : 1080px;
--scale : 0.5; /* Scale factor that alters the size of the animation to (width x scale) : (height x scale) */
--cols : 5; /* Number of columns across */
--rows : 3; /* Number of rows down */
--total_duration : 3; /* Number of seconds to open the panes, then no. of secs to stay open, then no. of ses to close the panes */
--border_outside : 40px; /* Width of the border outside (the actual width is the sum of this value and "border_inside")*/
--border_inside : 10px; /* Width of the borders inside (the struts are actually 2 times this wide) */
--border_color : #000000; /* Color of the border */
--pane_color_shut : #000000; /* Color of the window pane when shut */
--pane_color_open : #FFFFFF; /* Color of the window pane when open (for a green-screen video use something like #00FF00)*/
The “scale factor” enables you to produce smaller videos, still in the same aspect ratio and when you open them as a clip in a full-size project Shotcut will resize the clip for you.
Just click on the HTML file link below then right-click and choose “View Page Source” and copy-paste it. - Enjoy
How are you?