Hello,
tl;dr:
watch the Demo
About the gauge overlay
I’m working on an HTML gauge overlay for my GoPro videos.
There are also many other software for making similar overlays, for example GoPro Quik, Dashware, Virb Edit, RaceRender etc. But none of them can really compare with HTML regarding flexibility, open standard and public available resources.
The data in the demo is exported from GoPro, and visualized with hacked gauges from https://canvas-gauges.com/. webvfx is used to sync the data with the video frames.
Feedback regarding webvfx
As a fresh user with no prior experience of video editing, I found Shotcut intuitive and easy to use in general. That said, here are a few things that annoyed me the most when I was developing the overlay.
-
Very often Shotcut would crash, if I reload the HTML layer when playing the video project.
-
Due to the nature of this overlay, it has to be in sync with the video frames. However it’s not easy to add the overlay to a clip, because the webvfx plugin cannot access any metadata of the clip. Suppose I have added an HTML overlay to a 10-min video, and then split the video in the middle point. Now both 5-min parts will have their own copies of the overlay, which are the whole 10-min overlay playing in double speed. Instead, I want the 10-min overlay split into two as well. Currently I achieve this by carefully tuning my code, and/or pre-rendering the overlay on top of the video and editing it afterward. But it’s really annoying because I have to repeat all the steps whenever I need to edit the clip (e.g. change the duration). Here are a few potential solutions:
- To allow “binding” the overlay with the video by sending “raw progress” in the webvfx render function. For example, in my example above, the overlay of the 2 clips will be rendered for progress [0, 0.5] and [0.5, 1] respectively
- To send the metadata of video clip to the webvfx module, e.g. start time, duration etc.
- To allow adding and sending parameters to the overlay. The parameters may be inputted manually. This may be combined with the solutions above.
-
The overlay does not show up if I reload the html file, I have to click on a different frame.
-
The filters does not show up when the project is just loaded. I have to click on something in playlist, and then back to the project.
-
It’s not easy to debug javascript errors, and very often Shotcut will stop working in such cases (without freezing or crashing). Normally I would test it in Chrome before loading it to Shotcut, but there may be still errors.
-
The overlay is rendered differently by Chrome and by Shotcut, mostly text.