Prototype

Tell it what the motion should feel like.
Get numbers you can argue with.

ramin is a motion graphics studio that runs in the browser. Ask for an entrance and it writes a Y-position track, an easing curve, an overshoot and a letter stagger — all of it sitting in the inspector, waiting for you to disagree. It never hands you a video.

The whole idea, in one example. You say this, and the timeline gets that.

What you type

“Make the headline enter aggressively from below, overshoot slightly, and settle.”

Then you drag the overshoot to 2%, because 4% was too much. That is the part that matters: the AI produced an argument, not an artefact.

What lands in the inspector

Y position
180 → 40
Duration
0.65s
Easing
back.out
Overshoot
4%
Letter stagger
20ms
Opacity
0 → 1

Built for commercial motion

Product ads, kinetic typography, title sequences, launch graphics, short-form campaign work. The things a brand ships, rather than the things a creative-coding sketch demonstrates.

Objects, not pixels

A scene is layers, transforms, materials, cameras, lights, behaviours and effects. Every one of them is a value you can type into.

One source of truth

The composition is JSON. Export it, diff it, hand it to a model, open it again — the frames come back identical.

A real timeline

Tracks, keyframes you can drag, easing curves, springs solved to their settling time, and per-character stagger on any property.

Runs on your GPU

Three.js through WebGPU where the browser has it, and the same TSL effect graph on WebGL2 where it does not.

The stack, top to bottom

The editor and the renderer are separated on purpose. React describes the document; the engine draws whatever the evaluator produced. Neither knows how the other works.

UIReact. Never touches a Three.js object.
CompositionPlain data. Layers, animations, behaviours, effects.
EvaluatorComposition plus a time in seconds, out comes a frame. Pure.
EngineReconciles the evaluated frame onto a Three.js scene graph.
WebGPUWebGPURenderer, with the WebGL2 backend as the fallback.

What is not built yet

This is an honest prototype, so here is the list rather than a list of features it does not have.

  • The planner is rule-based and runs locally. It understands a documented vocabulary and says so when it does not understand you; a model-backed planner goes behind the same seam.
  • Text is rendered from canvas glyphs stacked for depth. Shapes get real extrusion and bevels; type does not, yet.
  • SVG and 3D model layers exist in the document and the timeline. Nothing draws them.
  • There is no video export. The composition exports as JSON, which is the format the whole tool treats as canonical.