---
name: comment-beacon
description: Turn a document review into a precise editorial motion clip: select the referenced passage, lift a nearby comment, and sweep two phrases in reading order.
version: 1.0.0
---

# Comment Beacon

A parameterized HTML/SVG + GSAP composition rendered by HyperFrames. Supply a real document screenshot and brief JSON; the generator builds the same review grammar with your content. It does not infer a review or author a document from an arbitrary prompt.

## Prepare the brief

Provide `title` (up to 64 characters), `reviewer` (36), `label` (48), `palette` (`lagoon`, `mulberry`, `cobalt`, or `graphite`), `document`, `badge`, `region`, and `fragments`.

`document` is a PNG/JPEG screenshot in a 1000 × 1160 coordinate plane; use this aspect ratio to preserve alignment. `region` is `[left, top, width, height]` in that plane. Select a meaningful passage, not an empty area. `badge` is an authorized team photograph or portrait. Paths resolve relative to the brief. Confirm picture rights and keep credits with the project.

`fragments` contains 3–9 objects with `words` and boolean `emphasis`. Include whitespace in `words` deliberately; concatenation is the displayed note. Exactly two fragments must be emphasized. Each fragment is at most 90 characters, and the whole note at most 180. Prefer 85–125 English characters or 45–80 Chinese characters for comfortable reading. Long unbroken tokens may need editorial shortening. CJK uses the bundled Noto Sans SC font.

## Run

Requires Node.js 22+, npm, Chromium support for HyperFrames and FFmpeg. From this directory run `npm ci`, then:

```
node scripts/compose.mjs /path/to/brief.json /path/to/project
node scripts/render.mjs /path/to/project /path/to/project/output.mp4
```

The render uses one worker, 1920 × 1080, 30 fps and an 8.8-second timeline. Keep generated projects and media outside this generic package. The editable project retains its brief and local media hashes.

## Direct the sequence

The document is immediately visible. Its passage is selected at 0.55–0.93 s. A 1.05–1.33 s dim lowers background emphasis; a short comment entrance begins at 1.38 s. A connector relates the selected passage to the author. Marker sweeps run at 2.75–3.40 s and 4.20–4.85 s; the remaining 3.95 seconds provide a steady reading interval.

Keep the comment stationary during marking. Do not move the entire frame to imitate a phrase sweep. A long phrase can wrap; each line receives the same background reveal. This is not a glyph-by-glyph reading path. Audio is absent by design; no narration or music editor is included.

## Validate before delivery

Check the actual document dimensions and selected passage. Inspect both transitions and native-resolution hold frames. Seek forward, backward and to zero; compare visible output as well as state values. Check the longest brief and CJK text for clipping. Perform one normal-speed encoded playback and preserve dropped-frame observations. Decode the whole MP4, inspect streams, verify media rights and retain package hashes. Browser counters are run-specific and do not establish user acceptance.

Bundled runtime assets retain their required notices. See `references/dependencies.md`.