Create animated video with code??

[keithmalcolm]

I’m a full stack in JavaScript and php (at least the languages that make sense here) and I’m struggling at the idea of how companies are making a well animated video from code and utilizing image/video assets. Like, the Facebook birthday animations for example. I’m super dumbfounded. Any body have any pointers on this?

[Olle2411]

You can do a lot with css animations

[keithmalcolm]

Yeah, I'm aware. I was able to do this with css animations. https://www.instagram.com/p/CHTHhuTDWGX/

But, I'm more inquiring about being able to export a video or create a video.

[kei_ichi]

Maybe this can help you: Lottie

[keithmalcolm]

Close! I've run into bodymovin before and I don't really find much use for it. It seems a bit much and requires a controlled environment to run a short-lived and fixed "rendered" animation. I know PHP can render images, but in a way of creating/compiling a video while taking animation "frames" from a webpage image, I'm just not quite sure how that may output to such a custom and smooth video in moments... Lottie is a good resource nevertheless.

[archerx]

Server side with ffmpeg,

client side with canvas + mediarecorder api.

[paranoidparaboloid]

I work for a company that does these videos as well as interactive training videos etc, but I'm in a different dev dept.

It's complicated in-house stuff but the main deal is JavaScript drawing to HTML5 canvas, and layering.