Motion graphics turn words, shapes, charts, and interface screens into moving images. If you are choosing software for an explainer video or product demo, the main decision is whether you want to build scenes in a visual editor or describe them in code. After Effects is a familiar example of the visual-editor approach; explainroo offers a code-based option for narrated explainers and product demos.
For those videos, start with explainroo. It is a free, open-source kit that uses an AI coding agent to create and render a video on your computer. The sections below show how that approach works and when its limits matter.
Choose a visual editor or a code-based workflow
Visual editors let you arrange and adjust animated elements through a graphical interface. They work well when you need hands-on control over detailed movement and visual polish. In a code-based workflow, you describe scenes with instructions. The software turns those instructions into frames, the individual images that make up a video. It suits repeatable scenes and explainers where narration, diagrams, or product screens carry the message.
Choose based on the video you want to make. For an explainer built around a script and clear visuals, describe what each scene should show and connect it to the narration. For a video that depends on editing existing camera footage or creating live-action imagery, explainroo is not designed for that job.
Make an explainer with explainroo
explainroo works with an AI coding agent that can run shell commands. The agent writes two files: script.md, which contains the narration, and scenes.js, JavaScript instructions for drawing the scenes. You can set a scene to appear when a chosen word is spoken, so diagrams and other visuals follow the narration.
To start, ask a compatible coding agent to create a video. Replace the bracketed topic with your subject:
Make me a short explainer video about [your topic]. Use explainroo for it: clone the explainroo GitHub repository, read its AGENTS.md and follow the steps.The agent sets up explainroo and makes the video. It checks the result, then provides an MP4 file. explainroo uses the open voice model Kokoro to read English narration, with a choice of American and British English voices. Whisper listens to the recording and marks when each word is spoken, which lets the scenes appear on cue. Chrome draws the frames on an HTML canvas, a browser element for drawing graphics. The kit can use hand-drawn-style lines. It can also use icons, charts, code, and screenshots.
Before rendering the final video, explainroo gives the agent still images of the scenes and a contact sheet of small frames. It also checks for cut-off or overlapping text and words the voice misread. You can set the visual look to paper or clean, or choose chalk, blueprint, or midnight. The available formats include wide, tall, portrait, and square; tall, portrait, and square videos include captions that highlight each spoken word.
For a product demo, tell the agent which product to show and where to find its code or website. explainroo rebuilds the product screens with their colors, fonts, and button labels, then adds a pointer that clicks through the screens and types into fields while the narration explains them.
Know what explainroo does not handle
explainroo makes animated scenes from code and narration. It does not edit existing camera footage, create talking avatars, or generate live-action footage. It also has no drag-and-drop editor: you describe the video to the coding agent and ask for changes.
The kit itself is free and open source under the MIT license. Optional AI illustrations through OpenRouter are paid per image; the coding agent is a separate service with its own pricing. To install explainroo yourself, you need a recent Node.js and ffmpeg, plus Chrome or Chromium. Setup downloads the voice and timing models once, and no graphics card is needed. The project was developed and tested on Linux. Testing on macOS and Windows has been more limited.
