ui.plan.ai

Agent-generated UI streams.

ui.plan.ai/docs/

Three video-loop directions in development. Black canvas, pillarbox on desktop, letterbox on mobile. The docs link is the only link rendered into the artwork; everything else is the project, looping.

01

Holographic workbench

Visual
A heads-up display floating in pure black. One frame is centered like a hologram, its click zones traced in luminous cyan. A spine of metadata typewrites beside it. A single status badge breathes through the promotion gates. No chrome — just the work, lit from inside.
Desktop 16:9
Wide HUD. 12% agent rail · 60% frame canvas · 28% metadata column · 1px status strip at the bottom. Faint vignette at the corners. The frame canvas is a hi-fi UI mock with click-zone outlines glowing cyan.
Mobile 9:16
Vertical stack: agent pill top · frame canvas in 16:9 letterbox · metadata column · status strip. Pillarbox bars are absolute black, indistinguishable from the page background.
Loop
8 seconds, four beats. (0–2s) frame fades up, metadata typewriters in. (2–4s) click zones pulse 1 → 4. (4–6s) status badge crossfades needs_review → team_visible → promoted. (6–8s) the whole HUD dims to the loop seam.
Palette
Pure black · cyan-white strokes (#a5f3fc) · electric green status (#4ade80) · warm white text (#fafafa).
Docs link
Pill chip, bottom-center of the HUD, mono. Dimmer than the primary text. The only clickable element in the artwork.
02

Filmstrip in the void

Visual
A continuous filmstrip drifting through the void. Each cell is a tiny rendered agent UI; sprocket holes glow as luminous dots; the date ticks up between cells; a soft cyan halo bleeds into the dark.
Desktop 16:9
Strip rotated 5–8° toward the viewer, drifts left → right. 5–7 cells visible at any time. The leader margin runs ui.plan.ai/docs along its length like a printed reel ID.
Mobile 9:16
Strip vertical, drifts bottom → top. 3–5 cells visible. The leader runs up the left margin, type rotated 90°.
Loop
12 seconds of constant-velocity scroll. No discrete beats — the loop point is invisible because nothing changes phase.
Palette
Pure black · cool white film edges · faintly warm overlay on cells · amber (#fbbf24) for the etched docs leader.
Docs link
Etched into the leader margin in mono, repeating with a centerdot separator: "ui.plan.ai/docs · ui.plan.ai/docs · ". The whole leader is the link target.
03

Constellation of agents

Visual
A star map. A faint 80px grid hangs in the void. Scattered glowing agent nodes labeled by slug; tiny frame-rectangles emit from each node along curved bezier paths toward a central hub — the workbench — which pulses gently on arrival.
Desktop 16:9
Hub anchored at the right third. 6–10 agent nodes scattered across left and upper. Several frames in flight at any time; trails decay smoothly.
Mobile 9:16
Hub at the bottom third. Nodes scattered above. Trails descend in soft S-curves.
Loop
10 seconds. Asynchronous emission cadence per agent means there is always a frame mid-flight at the loop seam — the cut is invisible.
Palette
Pure black · cyan agent nodes (#22d3ee) · white frames with cyan trail · green hub (#34d399).
Docs link
Label below the hub, mono. Pulses faintly in sync with the hub whenever a frame arrives.