HOW MOTION LAB WORKS

From blank frame
to living system.

Motion Lab keeps the entire creative process in one place. Build the scene, direct its movement, connect it to sound, and render—without leaving the browser.

Open Motion Lab See the workflow
01Find the spark

Start blank—or start inspired.

Open a clean project or choose a cinematic preset. Presets are fully editable systems, so they accelerate the first frame without deciding the final one.

Creator-ready presetsBlank projectsEditable controlsAutomatic project saving
MOTION LAB

Liquid Prism

MOVE / TYPE

Kinetic Type

Quantum Aura

Infinite Tunnel

02Build the scene

Layer every part of the idea.

Combine generative patterns, typography, video, audio, and custom code. Reorder, blend, duplicate, and tune each layer without flattening your work.

Pattern and preset layersTypography and videoAudio tracksReusable code layers
MOTION LAB
Kinetic titleTYPE
Prismatic auraPRESET
SoundtrackAUDIO
Particle systemCODE
03Direct the movement

Turn parameters into performance.

Move through time on a multi-layer timeline, keyframe the controls that matter, and shape the feel of every transition with easing.

Precise keyframesCustom easingLayer timingReal-time playback
MOTION LAB
00:04:18
04Make it respond

Connect sound, code, and effects.

Map audio energy to visual controls, write custom motion logic, and finish the scene with blend modes and post-processing—all with immediate feedback.

Audio-reactive bindingsIntegrated code editorBlend modesPost-processing stack
MOTION LAB

const motion = audio.energy;

layer.scale = 1 + motion;

layer.glow = motion * .65;

// updates every frame

05Send it out

Render, share, and keep exploring.

Set the output dimensions, render from the browser, or share the project with the community. Your project stays editable and ready for the next version.

Flexible dimensionsBrowser renderingProject sharingCommunity remixing
MOTION LAB
Export project
1920 × 108060 FPS
BUILT FOR EXPLORATION

Serious control.
A playful workflow.

Layered composition

Keep type, patterns, media, audio, and code independently editable.

Keyframes & easing

Create intentional timing with precise keyframes and expressive curves.

Audio reactivity

Bind volume, energy, and frequency information to visual parameters.

Creative code

Build visual logic in the integrated editor and reuse it like a native layer.

Real-time effects

Stack blend modes and finishing effects while watching the result live.

Shareable projects

Publish your work, invite a remix, or return to the editable project later.

The best way to learn
is to make something move.

Start free, open a preset, and change one thing. Then another. That’s the whole idea.

Start creating