> ## Documentation Index
> Fetch the complete documentation index at: https://hyperframes-codex-docs-human-first-refactor.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Add captions or repackage talking-head footage

> Add captions, add designed overlays, or change the spoken edit.

export const FootagePathChooser = () => {
  const paths = [{
    id: "captions",
    label: "Add captions",
    note: "The original clip and audio stay untouched.",
    prompt: `/hyperframes Add captions to interview.mp4.

Keep the footage and audio untouched. Make names and product terms easy to verify, and choose a caption treatment that fits the clip.`
  }, {
    id: "overlays",
    label: "Add designed overlays",
    note: "The original clip plays underneath the graphics.",
    prompt: `/hyperframes Package podcast-clip.mp4 with designed overlays.

Keep the footage and audio untouched. Use the transcript to add a speaker title, two useful pull quotes, and a data callout.`
  }, {
    id: "edit",
    label: "Change the footage",
    note: "Use General Video when the spoken edit itself must change.",
    prompt: `/hyperframes Recut interview.mp4 into a concise 45-second video.

Remove pauses and repetition, choose the strongest parts, and reorder them when it improves the explanation.`
  }];
  const [selectedId, setSelectedId] = useState("captions");
  const selected = paths.find(path => path.id === selectedId) || paths[0];
  return <div style={{
    margin: "1rem 0 1.5rem"
  }}>
      <div role="group" aria-label="Choose what should change" style={{
    display: "flex",
    flexWrap: "wrap",
    gap: "0.5rem",
    marginBottom: "0.75rem"
  }}>
        {paths.map(path => {
    const active = path.id === selected.id;
    return <button key={path.id} type="button" aria-pressed={active} onClick={() => setSelectedId(path.id)} style={{
      border: "1px solid currentColor",
      borderRadius: "999px",
      padding: "0.4rem 0.75rem",
      background: active ? "#d8ff5f" : "transparent",
      color: "inherit",
      cursor: "pointer",
      opacity: active ? 1 : 0.7
    }}>
              <span style={{
      color: active ? "#111111" : "inherit",
      fontSize: "0.8125rem",
      fontWeight: 600
    }}>
                {path.label}
              </span>
            </button>;
  })}
      </div>

      <p aria-live="polite" style={{
    margin: "0 0 0.75rem",
    fontSize: "0.875rem",
    opacity: 0.72
  }}>
        {selected.note}
      </p>

      <pre style={{
    margin: 0,
    whiteSpace: "pre-wrap",
    overflowWrap: "anywhere"
  }}>
        <code style={{
    display: "block",
    maxWidth: "100%",
    whiteSpace: "inherit",
    overflowWrap: "anywhere",
    wordBreak: "break-word"
  }}>
          {selected.prompt}
        </code>
      </pre>
    </div>;
};

<Frame caption="One shoot, three vertical cuts, each with its own kinetic captions. The footage underneath is untouched.">
  <video className="aspect-video w-full object-cover bg-zinc-100 dark:bg-zinc-900" src="https://static.heygen.ai/hyperframes-oss/docs/images/showcase/full-variables.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/showcase/wfv2-captions.jpg" controls playsInline preload="metadata" />
</Frame>

## What should change?

<FootagePathChooser />

Captions and designed overlays work best on a clear, single-subject clip with audible speech. Both keep the original footage and audio intact.

If you need to remove pauses, choose different moments, or reorder the speech, use [General Video](/guides/general-video).

## Before it builds

Confirm:

* **Captions:** the intended format and any names or terms the transcript may miss. HyperFrames can recommend a visual treatment after it sees the clip.
* **Designed overlays:** the format, layout, visual style, and how often a title, quote, statistic, or side panel should appear.
* **Either path:** where the speaker, existing text, and important action leave safe room for graphics.

## Review what matters

* Names, product terms, and numbers are correct.
* Captions follow the spoken words.
* Graphics avoid faces and important parts of the footage.
* The video works with sound and muted.
* The final caption or graphic clears before the video ends.

Use [Captions in Studio](/studio/captions) to correct words, timing, and visual treatment.

<Card title="Edit captions in Studio" icon="closed-captioning" href="/studio/captions">
  Correct words, timing, and visual treatment.
</Card>