Video

Before Starting

.agents/product-marketing-context.md

.claude/product-marketing-context.md

1. Video Goal

• What type of video? (Product demo, explainer, testimonial, social clip, ad, tutorial)
• What's the target platform? (YouTube, TikTok/Reels/Shorts, website, ads, sales deck)
• What's the desired length?

2. Production Approach

• Do you need a human presenter? (AI avatar vs. voiceover vs. screen recording)
• Do you have existing footage or assets? (Screenshots, logos, product UI)
• Do you need generated footage? (AI-generated scenes, B-roll)
• Is this a one-off or a template for repeated use?

3. Technical Context

• What's your tech stack? (Node.js, Python, etc.)
• Do you have API keys for any video tools?
• Budget constraints? (Some tools charge per minute of video)

Choosing Your Approach

Programmatic Video

Hyperframes (HTML/CSS — recommended for agents)

npm install hyperframes

import { render } from "hyperframes";

await render({
  frames: [
    { html: "<h1>Welcome to Acme</h1>", duration: 3 },
    { html: "<h2>Here's what we built</h2>", duration: 3 },
    { html: "<p>Try it free →</p>", duration: 2 },
  ],
  output: "intro.mp4",
  width: 1080,
  height: 1920, // 9:16 for vertical
});

Remotion (React)

npx create-video@latest

export const ProductDemo: React.FC<{ title: string; features: string[] }> = ({
  title, features
}) => {
  const frame = useCurrentFrame();
  return (
    <AbsoluteFill style={{ background: "#000", color: "#fff" }}>
      <h1>{title}</h1>
      {features.map((f, i) => (
        <Sequence from={i * 30} key={i}>
          <p>{f}</p>
        </Sequence>
      ))}
    </AbsoluteFill>
  );
};

When to Pick Which

AI Video Generation

Model Comparison

Prompting for Video Models

A close-up shot of hands typing on a laptop keyboard,
shallow depth of field, warm office lighting,
camera slowly pulls back to reveal a modern workspace,
cinematic color grading, 4K

• Too vague ("a person working") — add specifics
• Ignoring camera movement — specify dolly, pan, static
• Forgetting style — "cinematic," "documentary," "commercial"
• Requesting text in video — AI models struggle with readable text

When to Use AI Generation vs. Stock

AI Avatars

HeyGen (recommended — has MCP server)

Synthesia

When to Use Avatars vs. Other Approaches

Editing & Repurposing Tools

Repurposing Workflow

Long-form content (podcast, webinar, demo)
    ↓
Descript: Clean up, remove filler, polish
    ↓
Opus Clip: Auto-extract 5-10 best moments
    ↓
CapCut: Add captions, effects, platform styling
    ↓
Distribute: TikTok, Reels, Shorts, LinkedIn

Video Production Workflows

Product Demo Video

1. Script the key features and value props (use copywriting skill)
2. Screen record the product flow
3. Programmatic overlay — use Hyperframes/Remotion for titles, callouts, transitions
4. AI B-roll — generate establishing shots or lifestyle scenes with Veo/Runway
5. Voiceover — record yourself or use AI avatar for narration
6. Export at platform-appropriate specs

Explainer Video

1. Script the problem → solution → CTA arc
2. Choose presenter — AI avatar (HeyGen) or voiceover + visuals
3. Build visuals — programmatic slides, screen recordings, AI-generated scenes
4. Add captions — always, for accessibility and engagement
5. Export — landscape for YouTube/website, vertical for social

Batch Social Clips

1. Create master template in Hyperframes/Remotion
2. Feed data — product features, testimonials, stats
3. Render batch — one template, many variations
4. Add platform-specific captions via CapCut or Captions.ai
5. Schedule across platforms

Agent-Native Video Pipeline

Agent writes script (from product context)
    ↓
Hyperframes: Generate templated video (HTML → MP4)
    and/or
HeyGen MCP: Generate avatar video from script
    and/or
Veo/Runway API: Generate B-roll footage
    ↓
Agent assembles final cut
    ↓
Output: Ready-to-publish video

• Hyperframes uses HTML — any coding agent can generate it
• HeyGen MCP server — agents call it directly
• Video model APIs — standard HTTP requests
• No manual editing step required

Common Mistakes

1. Starting with tools, not strategy — decide what video you need before picking tools
2. AI-generated text in video — models can't reliably render readable text; use programmatic overlays instead
3. Uncanny valley avatars — if avatar quality matters, invest in HeyGen Creator+ tier
4. No captions — 85% of social video is watched without sound
5. Wrong aspect ratio — 9:16 for social, 16:9 for YouTube/website, 1:1 for feeds
6. Over-producing — authentic often outperforms polished, especially on TikTok

Task-Specific Questions

1. What type of video do you need? (Demo, explainer, social clip, ad, tutorial)
2. Do you need a human presenter or can it be voiceover/text?
3. Is this a one-off or a repeatable template?
4. What platform is it for? (This determines aspect ratio and length)
5. Do you have existing assets to work with? (Screenshots, footage, scripts)
6. What's your budget for video tools?

Tool Integrations

Related Skills

• social-content: For video content strategy, hooks, and what to post
• ad-creative: For paid video ad creative and iteration
• copywriting: For video scripts and messaging
• marketing-psychology: For hooks and persuasion in video