---
name: signal-funnel
description: Animate a collection becoming a useful result through a visible collection and processing step. Generate editable 1080p HTML motion projects with GSAP and render them with HyperFrames.
version: 1.1.3
category: video
delivery: download-only
---

# Signal Funnel

Use this parameterized renderer for a short explanation of collection, consolidation or treatment. Write a brief that names the individual materials, what happens to them, the output, and where it goes. This is a diagram tool; it does not infer scientific safety or numerical efficiency.

## Make a project

Requires Node.js 22+, Python 3, FFmpeg and HyperFrames 0.8.30 with a local Chrome installation. GSAP and fonts are installed into an external cache and verified against fixed SHA256 values. A verified cache works offline. HyperFrames installation may need network access:

```sh
npm install --no-save hyperframes@0.8.30
node scripts/install-runtime.mjs
node scripts/compose.mjs /absolute/brief.json /absolute/project
python3 scripts/sound.py /absolute/project
npx hyperframes@0.8.30 render /absolute/project --output /absolute/picture.mp4 --fps 30 --quality high --strict --workers 1
ffmpeg -i /absolute/picture.mp4 -i /absolute/project/mix.wav -c:v copy -c:a aac -b:a 192k -shortest /absolute/film.mp4
```

The HTML owns a paused GSAP timeline registered in `window.__timelines`. HyperFrames seeks it during rendering. For interactive review, call `playFilm()` from the browser console. Do not use wall-clock timers to drive export motion.

## Brief fields

Provide `heading`, `operation`, `outcome`, and `destination` as nonempty strings. Their character limits are 58, 30, 58, and 54 respectively. Headings and outcomes fit down to 24 px for long content. Use 3–7 `fragments`, each with a `caption` up to 26 characters and an optional `symbol`: `message`, `drop`, `leaf`, `book`, `clock`, `access`, or `filter`. Unknown symbols use a message outline. Optional `footnotes` holds up to three strings of 25 characters. `look` is `linen` or `tidal`.

```json
{
  "heading": "A neighborhood signal",
  "fragments": [
    {"caption": "Street survey", "symbol": "message"},
    {"caption": "Park visit", "symbol": "leaf"},
    {"caption": "Open meeting", "symbol": "clock"}
  ],
  "operation": "Combine observations",
  "outcome": "A shared improvement plan",
  "destination": "For the next community meeting",
  "footnotes": ["Access", "Shade", "Seating"],
  "look": "linen"
}
```

## Direction and editing

See [motion guidance](references/direction.md). Chinese text uses an installed Noto Sans SC fallback. Keep captions short and test dense CJK content. Inputs are functional vector marks, not photographs. For photographic storytelling, extend the runtime with explicitly licensed local media and test that new material separately.

Edit the generated `brief.json` and rerun the composer for content changes. Edit `soundtrack.json` to change event times, pitches, duration or gain; rerun `sound.py` and remux. The result is original procedural sound, with a quiet tonal bed and action cues. A cue list alone is not a soundtrack: confirm `mix.wav` and the final audio stream exist.

## Review before delivery

Render actual MP4s, inspect every state change, test out-of-order seeks and play at normal speed. Check 1920×1080, 30 fps, an eight-second duration, readable text and complete decoding. Probe audio separately; measure loudness and peaks, then listen. Keep video-only output when silence is preferred. Human visual and audio approval remain separate from automated checks.

Set `SIGNAL_FUNNEL_CACHE` to choose the external installation directory. Run `node scripts/install-runtime.mjs --offline` to verify cached resources without network. Installation preserves required notices with the cached files and editable projects. Resource URLs, versions and hashes are in `references/runtime.json`.

Each fragment can include `image`, a local PNG, JPEG or WebP path resolved beside the brief. The image is copied into the editable project and absorbed with its caption. Use licensed topic-relevant photographs for photographic fragments.
