Record AR video with fixed camera

Questions
1

I want to record videos with a fixed camera and AR elements, similar to this one: YouTube

At first I don’t plan to use QR codes or similar because is not mature in Babylon, so I’ll just sync the camera position and the virtual scene before recording.

My question is, how do I record this kind of videos? how to mix the camera input and the scene from babylon?

As far as I understand, I would first paint the camera frame to the canvas, later render the babylon scene with a clear background, save that image and keep going. No idea how to make the shadows so they mix with the table…

Is there an easier way? Has anyone done something like this? any suggestions?

Thanks

2

This is one solution: Render a Scene to a PNG - Babylon.js Documentation

You can also directly use the browser API to generate videos like here: VideoRecorder - Babylon.js Documentation

Example of use: Babylon.js/toolsTabComponent.tsx at master · BabylonJS/Babylon.js · GitHub

3

Thanks, it’s a bit late so I’ll check tomorrow.

Can you please suggest me a way to work with shadows? I mean, if I create a sphere I want to cast the shadow on my real table, not a virtual surface.

Thanks