Cinematic UI 2.0中文

← Gallery · Roll 01 / 06 · AI ops agents

Lockwork

An ops lead who has watched a dozen agents ace a demo wants one she can let near production; Lockwork shows the work step by step and stops at the one irreversible step until a named person turns the key.

Watch live ↗Read the treatment

Lockwork — first frame
Director · film
Robert Wise · The Andromeda Strain (1971)
Medium
Live typeset readouts in a hairline monitor wall on flat lab-white grounds, with SVG/CSS gate doors; no images, no 3D
The lead
JOB-0412, "Refund last night's duplicate charges": typed, planned and revised, held at the door, split into levels, replaced by your own task, closed.
The audience's part
Type a task and watch its level verdict and plan print; a Level 4 step stops at a key you approve or stop.
Grade
#EDEEEA#F2C200
Lockwork — frame 2Lockwork — frame 3

Screening

The live production, running below. Scroll inside it.

The treatment (treatment.md)

Written by the agent during production, unedited.

Open the full treatment

Fictional demo. Lockwork is an invented company; every person, customer and figure on the page is illustrative, and the footer says so.

1. Development

Product truth. Lockwork runs AI agents on a company's operations queue (billing fixes, access requests, ticket triage, on-call chores). Every tool an agent can call sits at one of four levels: 1 Read, 2 Draft, 3 Act (reversible, within limits), 4 Key (irreversible or over a limit: waits for a named person). Every step is written to a run log. Audience. Ops and engineering leaders who have seen agent demos and are now deciding whether one can be let into production. Solution-aware, sceptical, with security in the room. Primary action. Request access (a 30-minute working session on one of their own tasks, then a free 30-day pilot at Levels 1–2). Secondary. Try the sandbox prompt on the page; read the docs.

Logline. An ops lead who has watched a dozen agents ace a demo wants one she can let near production; what stops her is that nobody can say what an agent may touch or what it did at 2 a.m.; Lockwork shows the work step by step and stops at the one irreversible step until a named person turns the key.

Audience arc. Arrives believing: agents are good demos and unsafe employees. Leaves believing: I can give it a level, read everything it did, and nothing irreversible happens without one of us. Controlling idea. Trust is a procedure you can watch.

2. Casting session

Candidate Mechanism for the dramatic problem (trust in an autonomous worker) Signature shot Risk / wrong for
Robert Wise — The Andromeda Strain (1971) Procedure staged as drama: split screens of simultaneous work, scientists typing to the computer and reading its printed answers, a descent through containment levels with a check at every door, and one named man who holds the key The team descending level by level through decontamination while readouts print on the monitors Biohazard and self-destruct costume; a cold film. Wrong for warmth or consumer products
Sidney Lumet — Fail Safe (1964) The war room's big board, authority confirmed by voice, lenses tightening as tension rises The president, one phone and an interpreter in a bare room Its subject is automation failing catastrophically: the worst message an agent platform could send
Buster Keaton — The General (1926) One man doing a whole crew's job on a moving machine, shown in one wide take so you know the stunt is real Keaton alone on the tender, chopping wood and switching track while the chase runs behind him Comedy and silent-film costume undercut a security conversation

Kept: Wise. The product's problem is the one the film dramatises: work done by a system inside levels of containment, watched on monitors, with a human key at the last door. Lumet set aside because his film argues that automated procedure ends the world; Keaton because his proof-by-wide-take is charming where this audience needs evidence. Competitor test. A generic agent site could borrow "a live run on screen". It could not borrow the four levels as a descent with doors, the LED floor indicator reporting the agent's current clearance, key-plate actions for every human decision, and the diff as the brand's type switch: all four come from Lockwork's own permission model.

Filmography check (last three: Fincher / Zodiac, Anno / Shin Godzilla, Sciamma / Portrait). Differs on director; medium (live readouts in a split-panel monitor wall with gate doors on lab white stepping to graphite, vs a drawn SVG line, typeset paper documents, live 3D glass); form (autoplaying fixed hero + typed sandbox + click-driven lift + two scrubbed scenes + flow docs); type (Chivo / Chivo Mono, diff switch); lead (a job through eight states); interaction (type a task, then approve or stop its Level 4 step); ending (product in use: your task waiting at its level); instruments (LED floor indicator + teleprinter strip). Shares only "opens mid-action" with Zodiac.

Mechanisms → on screen

  1. Descent through levels, a door at each → the Levels lift: four floor buttons; each press closes two door halves over the stage with the level plate on the seam and opens on the next level; the ground steps one tone darker per level (lab white → graphite). The pilot and final scenes open the same doors.
  2. Split screens of simultaneous procedure → the hero is a monitor wall: four hairline panels (the human words, task + plan, tool calls, effect / gate) running at once. The sandbox reuses the wall.
  3. Typing to the computer, reading its printed answer → the sandbox: the visitor types a task, the page answers line by line (typewriter), with a level verdict (slot roll).
  4. Readouts are the dialogue → two voices in type: humans in Chivo, the agent in Chivo Mono, printed; the audit-log wall in the pull-back is a month of readouts.
  5. The one man with the key → every Level 4 step stops at a gate with a named key holder. In the hero autoplay "Dana R." approves after five seconds unless you approve or stop first; in the sandbox the key is yours. All human decisions use the same key-plate button, including Request access.
  6. High-key, shadowless, colour-coded light → flat lab-white grounds, hairlines, no shadows or gradients, tone by level, one colour only where a person decides.
  7. The clock always running → run clock in the teleprinter strip; LED floor indicator follows the run.

3. Medium

Designed: live typeset readouts in a hairline monitor wall, flat lab grounds and SVG gate doors. No canvas except the LED indicator (type-fx draws it), no photographs, no 3D. Wise's mechanism (procedure on many monitors at once, inside levels of containment) becomes typeset readouts in split panels on flat grounds that darken by level, because an agent's work is text and the drama is where it is allowed to act. Why not 3D: a modelled lab would be the film's costume; the work happens on the monitors.

4. Lead, cast, location, asset call

Lead: the job — JOB-0412, "Refund last night's duplicate charges." Its verb is the product's: it is worked, and it waits at the door.

# State Shot / scene
1 Typed in as a task Loader / hero task panel
2 Planned, then revised ("all 14" → "the 3 confirmed duplicates") Hero plan line (typewriter)
3 Worked across panels: reads, drafts, retries Hero wall
4 Held at the door, Level 4, $1,240.00, key holder named Hero gate
5 Split into its levels (each floor shows its JOB-0412 step) Levels lift
6 Replaced by the visitor's own task Sandbox (the turn)
7 One line in a month of log Log pull-back
8 Closed; the visitor's task typed back, waiting at its level Final card

Supporting cast: jobs 0413 (offboarding) and 0414 (on-call latency) in the hero loop; Dana Ruiz (Finance key holder), fictional customer Harrow & Pike. Location: one facility, high-key and shadowless; floors darken with consequence. Asset call: answered by the brief: no paid generation, no footage needed. Everything is type, SVG and CSS. Fonts: Chivo, Chivo Mono (Google Fonts, OFL). Nothing open for the user to supply.

5. Screenplay

All visible copy is in copy.md.

6. Storyboard

Form: hybrid. Autoplaying fixed-stage hero, two short scrubbed set pieces, a click-driven lift, a typed sandbox, and calm flow documents for proof, offer and questions. Skeleton: wave with a cold open · turn in the middle (~45 %, the sandbox) · opens mid-action (the agent already working) · ends on the product in use (your task at its level beside the key).

Award pass

WORLD OBJECT   The level door: two halves meeting on a seam that carries a level plate, opened by a key.
               Reaches the loader (LED floor test + wall hairlines), the cuts (doors part into the pilot and
               the final; doors close and open in the lift and over the hero's gate panel), every human-decision
               button (key plate with a notched bit: Request access, Approve), the progress mark (LED floor
               indicator), section marks (L1–L4 plates), the footer (closing plate).
LEAD STATES    typed → planned & revised → worked → held at the door → split into levels → replaced by yours
               → one line in a month → closed, yours waiting
LOADER         0.9 s: the LED indicator runs its floor test 1-2-3-4 while the four panel hairlines draw; the
               last hairline lands as the task line cuts on. H1 and CTA are in the DOM and visible at first paint.
CUT MATERIAL   Door halves (top/bottom) closing or parting on a seam plate. Exception: push between the calm
               documents, where nothing should perform.
ACCENT         Key yellow #F2C200 — "a person decides here". ≤ 5 % of any frame: the gate prompt, the KEY floor,
               Approve, and Request access (asking for access is the visitor's decision; it is a key).
TYPE           Chivo (humans: headlines, body) · Chivo Mono (the agent: plans, logs, labels) · switch = the diff,
               a struck word followed by its replacement, once per chapter headline · display deliberately small
               (≤ 3.4 vw) because the monitor wall and the level numerals carry the scale; the numerals
               (34 vmin) are the only giant type.
INSTRUMENTS    TL wordmark · top-centre LED floor indicator (the agent's current level; KEY in yellow when
               waiting) · TR key-plate Request access · bottom-centre teleprinter strip (last printed step +
               run clock, pause control) · phone: LED in the slate, bottom bar with the key plate.
VERB           Hand it a task and hold the key: type it, watch it plan, approve or stop the one irreversible step.
TRIGGERS       autoplay (hero run, LED, teleprinter) · click (approve/stop, pause, lift floors, example chips)
               · input (sandbox) · idle (sandbox suggests a task after 7 s) · hover/focus (log highlighter)
               · scroll-enter-then-play (odometers, final typewriter) · scroll scrub (doors + read-fill,
               log pull-back). 7 kinds; scroll scrubs 3 of 19 performances.
TYPE CAST      signature typewriter + led-matrix, cube-flip, slot-roll, odometer, highlighter, read-fill (table below)
RHYTHM         Set pieces: hero wall, pilot door, lift, sandbox, log pull-back, last door. Calm documents: results,
               access + form, questions, credits. Phone: the wall stacks (plan, gate), tools become one line,
               the lift swipes, the pull-back is shorter.

Trigger table

Beat Performance Trigger Keyboard / touch Reduced motion
Loader LED floor test, panel hairlines draw autoplay (once) — skipped; wall drawn
Hero JOB-0412 → 0413 → 0414 run loop autoplay, pauses off-screen Pause/Play button (Space when focused) paused at JOB-0412 held at the door; Play button
Hero Plan line typed, revised autoplay (run clock) — full revised line
Hero Gate: Approve / Stop; Dana approves at 5 s click buttons, Enter; tap buttons work, state cuts
Chrome LED floor indicator follows the run's level autoplay (state) it is a link to the lift static level
Chrome Teleprinter strip prints the last step autoplay — last line static
Pilot Doors part on the seam scroll scrub scroll, Space, PgDn doors open
Pilot Statement lit in reading order scroll scrub (read-fill) scroll fully lit
Lift Doors close/open, ground darkens, level name flips click floor buttons, ←/→ ↑/↓, swipe instant switch
Sandbox Example chips fill the box click buttons; tap same
Sandbox Ghost suggestion types itself after 7 s idle idle any key dismisses off (chips remain)
Sandbox Level verdict rolls, plan types, steps print, key gate input (Enter / Run) Enter in field; tap Run verdict and plan at rest
Log Pull-back from one line to a month scroll scrub scroll the pulled-back still
Log Marker drawn behind the key-holder field hover / focus rows are focusable; tap marker shown on focus
Results Figures roll once to exact values scroll enter, then play — exact values
Final Your task typed back, with its level scroll enter, then play — full text
Final Last door parts scroll scrub scroll open

Scroll scrubs: pilot doors (+ read-fill as one scene), log pull-back, last door — 3 scenes, about a sixth of the 19 performances.

Type cast

Effect Job Trigger Where
typewriter (signature) The agent's voice thinking aloud: typed, considered, deleted, retyped autoplay (hero run) · input (sandbox answer) · idle (ghost suggestion) · scroll enter (final echo) Hero plan line; sandbox plan; sandbox ghost; final card
led-matrix Elevator floor indicator: the level the agent is working at right now autoplay, state-driven Chrome, top centre
cube-flip A switch with mass: the floor name tips to the next as the lift moves click Lift: Read / Draft / Act / Key
slot-roll A result that really was uncertain: the level your task needs input Sandbox verdict
odometer Proof: illustrative pilot figures roll once to exact values scroll enter, then play Results
highlighter Attention answered: marker behind who held the key hover / focus Log rows
read-fill The one statement, read aloud by the scroll scroll scrub Pilot

Latin check: every effect is rendered in Chivo / Chivo Mono at its real size in --act frames.

Shot list

# · slug Beat Shot / camera Blocking Light / colour Cut out (eye-trace) Len E Money frame Mobile
1 · INT. MONITOR WALL — FLOOR 0 (floor) Cold open, mid-action WS frontal, lock-off; four panels Task cuts on; plan types and revises; steps print with level tags; tools stream; at L4 the gate panel's doors close, yellow plate, Dana approves at 5 s; next job High-key lab white, hairlines; yellow only at the gate Push; eye at the gate panel → the pilot's door seam waits at centre flow (100svh) 7 JOB-0412 held at the door H1 + CTA, then plan + gate stacked, tools one line
2 · THE FIRST DOOR (pilot) Ordinary world: the two questions MS lock-off Door halves (graphite) part from the seam plate "L1 · READ"; the statement lights word by word White ground behind graphite doors Push; eye at the last lit word → the lift numeral, left 240 3 Doors open, statement lit Same, type re-broken
3 · THE LIFT (levels) How control works Lock-off frontal; giant numeral left, floor text right, floor buttons Click a floor: doors close (plate on seam), ground steps darker, name cube-flips, doors open Ground L1 #EDEEEA → L4 #1C1F21; yellow on the Key floor Push; eye on the Key plate → the sandbox's Run key flow (100svh) 6 Level 4, graphite, yellow plate Numeral top, text below, buttons as a row; swipe
4 · THE SANDBOX (sandbox) The turn: your task Monitor wall again, closer (2 panels + prompt) Type → verdict rolls → plan types → steps → gate: you approve or stop; persists to log, form, final Lab white; yellow on your key Push; eye at "approved by you" → the log line flow 9 Your task held at your key Stacked
5 · THE LOG, OCTOBER (log) Every step written down ECU on one line → ELS of a month (scale 5.5 → 1) One line (JOB-0412, key: Dana Ruiz) pulls back into ~400 lines; your line marked if you ran one; readable rows below with hover marker Light grey wall, ink lines Push; eye on the totals → the results figures 260 6 The wall with totals Shorter, scale 4 → 1
6 · RESULTS (results) Proof Eye level, document Four figures roll once; one quote Plain Push flow 5 Figures at rest One column
7 · ACCESS (access) The offer Eye level, document Three steps, price, form (task prefilled), security notes beside the button Plain white Push flow 3 Form One column
8 · QUESTIONS (faq) Objections Document <details> Plain Push flow 2 — Same
9 · THE LAST DOOR (final) Final image: product in use MS lock-off Doors (plate "L4 · KEY") part onto graphite; your task types back with its level; key-plate CTA Graphite, one yellow key Credits 220 5 Your task beside the key Same
10 · CREDITS Footer — Closing plate, fictional-demo statement Graphite — flow 1 — Same

Screens to the offer: Request access is in the slate from frame one (and the phone's bottom bar); the full offer is about 10 screens down on desktop, 12 on a phone. Hold budget: pinned holds ≈ pilot 140 + log 160 + final 120 = 420vh of ≈ 1,500vh ≈ 28 %; acceptable for medium copy; the lift and sandbox are not pinned.

The audience's part

Action       types a task (or taps an example) and presses Run
Response     the level verdict rolls, the plan types out, steps print with their levels; a Level 4 step stops at a key
Consequence  the visitor approves or stops; "approved by you" / "stopped by you" is written into the log section,
             the task prefills the access form and is typed back on the final card
Equivalent   Enter in the field, Tab to Approve / Stop, Enter; tap on touch

Sequence check. The wall returns once (hero → sandbox) on purpose: the second time it runs your job. The door appears four times (pilot, lift, hero gate, final): it is the motif, and its plate changes each time (L1 → floors → KEY → L4). Grounds travel white → graphite only where consequence rises (lift L4, final). Typewriter appears at the opening, the turn and the end. Energy 7 3 6 9 6 5 3 2 5.

Short laptop (1366×640): the wall drops its tools panel to four lines; the lift numeral scales by vmin; pinned scenes size by svh. Ultrawide: the wall's panels widen, line length capped inside panels.

CRO decisions (cro-master)

  • Awareness: solution-aware and sceptical. Lead with the differentiator (control and record), not the category.
  • Offer: a 30-minute working session on one of their tasks, then a free 30-day pilot at Levels 1–2. Price shown ("from $1,500 a month", illustrative) because hiding it reads as enterprise-only.
  • One primary action: Request access, the only yellow button (slate, hero, access, final, phone bar). Secondary actions are text links (sandbox, docs).
  • Objections → proof next to the action: what can it touch (levels), what did it do (log), what if it's wrong (undo answer), where does data go (VPC, no training) sit beside the form; "no sales sequence" and the reply time under the button.
  • Friction: three fields; the task field is prefilled from the sandbox.
  • Claims: every figure is labelled illustrative; the customer and quote are fictional and say so.

Every production on this site is a fictional brand. The output is real: made by agents using the skill.