SparkLumina
Back to Showcase
Creative

Animation Theater

Draw scenes frame by frame, then use session recording to capture the entire creation process with audio.

2 min read

Frame-by-Frame Drawing

Animation Theater in SparkLumina lets you create short animations by drawing scenes frame by frame on the infinite canvas. Each frame can be a separate region or layer—a character in one pose, then another, then another. You control the pacing by creating as many frames as your story needs, using Excalidraw’s drawing tools and the AI Smart Drawing sidebar for quick backgrounds or props.

Because the canvas is infinite, you can lay out frames horizontally (timeline style) or in a grid. Pan and zoom to work on details, then step back to see the full sequence. It’s ideal for simple explainers, storyboards, or playful flip-book style animations.

Session Recording with MediaRecorder

When you’re ready to capture the creation process, use session recording. The frontend uses the browser’s MediaRecorder API to record a mixed stream: the canvas viewport (via captureStream on the canvas element) plus any audio—including TTS narration from the AI.

The recording captures your drawing strokes, AI-generated content appearing in real time, and optional voice-over. The output is initially WebM, the format MediaRecorder produces natively.

WebM → MP4 via ffmpeg

WebM is not universally supported on all players and devices. SparkLumina sends the WebM file to the backend, where ffmpeg converts it to MP4 (H.264 video + AAC audio). MP4 plays everywhere: browsers, phones, video editors, and social platforms. The conversion runs server-side; you download the final MP4 when it’s done.

Audio Synthesis

If you enable TTS during your session, the AI’s spoken narration is mixed into the recording. The audio is synthesized in sync with the visual flow, so the final video has both drawing and voice in alignment. You can also add your own microphone input if your setup supports it.

Sharing

Export the MP4 and share it on YouTube, social media, or your course platform. Viewers see the full creation process—how each frame was drawn and how the story unfolded—making it perfect for tutorials, art demos, or educational animations.