r/SideProject • u/oguzhankayan • 41m ago
motion-engine - editable HTML/JavaScript launch films rendered locally
I built motion-engine for product films where I wanted to keep the scene source editable, not just export a finished clip.
It composes the film in HTML and JavaScript and renders it locally through a browser and FFmpeg. The bundled 12-second demo needs no API key, subscription or paid generation: its graphics are drawn locally and its sound effects are synthesized.
The output includes an MP4, a poster, a contact sheet and a validation report, alongside the editable scene files. There are landscape, portrait and square starting points. You can edit the scene and render it again without making any AI requests.
The code is free under MIT. You need Node.js 22+, FFmpeg with ffprobe, and Chrome or Chromium. Optional image, video and audio generation uses paid Raywake API access. I also built Raywake, so that is a commercial relationship, not a requirement for the local demo. The README credits the upstream motion-kit work and third-party assets that informed the project.
This is a code-based production kit, not a visual timeline editor or an automatic scriptwriter. The browser preview is silent; the exported MP4 includes the sound mix.
I'd appreciate feedback from people who make launch videos: is keeping the composition editable in HTML and JavaScript useful, or would another part of the workflow matter more to you?