---
name: anchored-notes
description: Build a concise annotated process film with three fixed segments and sequential curved explanations.
version: 1.0.4
---

# Anchored Notes

Use this parameterized HTML/SVG renderer to explain three parts of one process. A shared board stays still while each edge marker, curved line and explanation appears in order. The editable GSAP timeline runs for 8.4 seconds at 1920 × 1080.

Create a JSON brief with `heading`, `palette` (lagoon, plum or night), and exactly three `parts`, each containing `name` and `note`. Names accept up to 20 characters and notes up to 60; use short phrases and inspect wrapping. Input is treated as text. Chinese uses the same bundled Noto Sans SC face as Latin.

Install Node.js 22 or newer and FFmpeg, then run `npm install` in this directory. Dependencies use fixed versions and retain upstream licenses. Run `node scripts/compose.mjs /absolute/brief.json /absolute/output`. From this package run `npx hyperframes inspect /absolute/output --json`, then `npx hyperframes render /absolute/output --output /absolute/demo.mp4 --fps 30 --quality high --strict`.

The generated project is editable. Update the brief and rebuild to change content; edit runtime/scene.js before rebuilding for directing changes. The three annotations refer to parts of one board, not three independent peer objects. Do not use the layout to imply measured relationships that the brief does not support.

Check all text, each curve's attachment, reveal order and final reading hold. Seek backward and forward and compare native frames. Review the full encoded video at normal speed. This release has no built-in soundtrack; audio must be explicitly authored, mixed and checked before describing an output as scored. Installation and render verification remain separate from visual and listening approval.