VisoTalk

The idea

Why a video is a document, and how time, pictures and determinism work in it.

An explainer is not a timeline of clips. It is a script with things hung on its words. VisoTalk makes that literal: the video is one file, doc.tsx, and the engine turns it into a live player and an MP4.

Three things in a document

What it isWritten as
LinesThe narration, and the caption each line shows<Line id="l1">Half of the Moon is always lit.</Line>
PartsBoxes of ordinary React that draw what is on screen<Part id="moon" x y w h>…</Part>
AnimationsActions that show, hide or change a part, hung on words<Appear on="moon" line="l1" word="Moon"/>

The skeleton (lines, parts, animations) is plain tags and literals. The engine reads it and never runs it, so a document can be validated, edited and printed back without executing anything. What is inside a part is code, run by the player and the exporter.

Time comes from the words

You never write a frame number or a timestamp. An action starts at a word of a line (word, with nth or a <Mark> when the phrase repeats), at the end of another action (after), or at the start or end of a line or scene. The narration is spoken by a local voice and aligned word by word; the solver turns every anchor into seconds and snaps it to the frame grid.

So the narration is the root of time. Change a sentence and the picture moves with it; nothing is re-timed by hand. A phrase that cannot be found, or is ambiguous, is an error pointing at doc.tsx:line:col, not a silent mistimed frame.

A picture is React, and it continues

A part draws with CSS, SVG, data tables and loops, so a bar chart is a .map over data and a diagram is computed, not typed coordinate by coordinate. An element a part registers (<Obj id> or useTarget) can be addressed by an action, and the document can tween any number the part reads (useProp): one angle moves a whole orrery. That is how one picture carries on across several sentences instead of being redrawn for each.

  • Nothing is on screen until the document shows it: a part is invisible until an Appear.
  • A scene's parts end with the scene. A part declared in <Doc> is global: it keeps its instance, and the numbers the document gave it, across scenes.

A frame is a function of the clock

The player and the exporter run the same renderer; the exporter only changes who drives the clock (every whole frame, instead of the browser's animation frame). For that to hold, a part may use no other source of time or randomness. validate refuses Math.random, Date, timers, network calls and CSS animations, and check renders sampled frames twice, in a different order, and compares them. Every example is also held to golden frames. The result is a video you can diff, review and re-render.

What the engine does so the agent does not have to

Agents are good at content and bad at production. VisoTalk moves the production work into code: the clock and the word alignment, the frame-exact export and the audio mix, licences and generated credits for every image, clip and sound, and qa for overflow, clipping, text over text and anything on screen for under two seconds. The skill carries the rest: the order to work in and the taste an agent would otherwise learn by failing.

Not this

Not a timeline you drag. Not a model that paints pixels, so every part has an identity and can be moved, retimed and exported at any aspect ratio. Not avatars or talking heads, and not an embedded third-party page: determinism for every frame is worth more than reuse.

Where it is

The format is 0.x and may change in any minor version; the engine and the skill are MIT licensed. What a part draws is code and is not edited in Studio, and sharing a page that runs someone's code needs a sandbox that is not built yet. The full type definitions are in spec/ir; visotalk schema prints every tag, motion and hook.

Next: how a video is written.