---
name: prompt-passage
description: Author a narrated interface film that connects a tool, asks a question, follows the answer, and turns a follow-up into a concrete counted result.
version: 1.0.1
---

# Prompt Passage

Create a continuous software demonstration in editable HTML/CSS/SVG and GSAP, then encode it with HyperFrames. This is a parameterized film toolkit with authored brief data, not a live service integration.

## Inputs and honesty

Supply a JSON brief with brand, language, voice, two accent colors, question, four answer paragraphs, followup, four ordered tasks, result title/unit, three result labels and integer values, closing, and seven spoken passages. Use a neutral representative interface unless you own the shown product. Label fictional data clearly. The final count is the sum of the three input values; do not treat it as a customer or performance claim.

Use different subject matter and task logic for each film. The answer must explain something useful and the follow-up must produce the shown result. Choose short enough copy to fit the 1920x1080 stage. English question/followup should remain under 72 characters; validate actual fonts and native frames after authoring. CJK is supported through a bundled build dependency, but always inspect rendered glyphs.

## Build

Node.js 22+, Python 3, FFmpeg and a local Chrome-compatible browser are required. Dependency versions are locked. Install with `npm ci --ignore-scripts`. The dependency licenses remain in node_modules and generated font folders. No model key or paid call is needed.

Run `node build.mjs /absolute/brief.json /absolute/project` then `python3 score.py /absolute/project`. These commands produce the HTML project, narration PCM, engine word events, measured scene schedule, script, storyboard and editable audio event list. The speech engine is local eSpeak NG; timing markers are synthesis events, not an ASR transcript. This synthetic voice has an intentionally disclosed machine quality.

The builder sets each scene duration from measured speech length plus action/readability clearance. Edit the narration first, then rebuild every affected scene. Preserve the connector click, composer continuity, clipped typing, line-by-line serif answer, masked scroll, second ask, finite quiet beat, checklist marks, same-element card resize, deterministic count and upward close. Do not replace the card resize with a cut.

## Audio

`score.py` composes a new procedural music bed and synchronized contact sounds. Both waveforms are mixed by HyperFrames with the seven speech clips. Every audio element has an id and explicit start/duration. `audio-timeline.json` is editable evidence of cues; waveform files plus a final AAC track prove actual sound delivery. If you edit cue timing, regenerate the audio and rerender. A positive stream probe is not listening approval.

## Validate and encode

Set `DO_NOT_TRACK=1` and `HYPERFRAMES_NO_TELEMETRY=1`. In the generated project run the installed HyperFrames CLI `lint .`, `check .`, then `render . --fps 60 --quality high --workers 1 --output film.mp4`. Keep rendering sequential. Inspect zero before any seek, return to zero from the end, both sides of every boundary, result morphology and native font rendering. Compare direct and reverse seeks semantically; record raw representation differences separately.

Probe and fully decode the encoded video, inspect native frames and play it once at 1x with measured dropped frames. Keep real counts even when nonzero. Review desktop and phone presentation separately; the film remains landscape and phone playback uses a contained video. Listen before claiming sound quality. Hand off the project, encoded film, poster and measured limitations. A successful encode does not mean user acceptance or publication.