home / skills / yonatangross / orchestkit / video-pacing

video-pacing skill

/plugins/ork/skills/video-pacing

This skill helps you optimize video pacing for maximum engagement by applying platform-specific cut rates, rhythm patterns, and hook timing.

npx playbooks add skill yonatangross/orchestkit --skill video-pacing

Review the files below or copy the command above to add this skill to your agents.

Files (4)
SKILL.md
13.4 KB
---
name: video-pacing
description: Video rhythm and timing rules for maximum engagement - cut frequency, attention curves, and platform-specific pacing patterns
tags: [video, pacing, rhythm, editing, attention, engagement]
user-invocable: false
version: 1.0.0
---

# Video Pacing

Comprehensive guide to video rhythm, timing, and pacing for maximum viewer engagement across platforms.

## Core Principle

**Pacing = Information Density x Visual Change Rate**

The optimal pace balances cognitive load with visual stimulation. Too fast overwhelms; too slow loses attention.

## Attention Curve Theory

```
Engagement
    |
100%|●━━━━━━━━━━●
    |          ╲
 80%|           ╲━━━━━━━━━━━━━━●
    |                          ╲
 60%|                           ╲━━━━━━●
    |                                  ╲
 40%|                                   ╲━━━━━━●
    |                                          ╲
 20%|                                           ╲━━━●
    |
  0%└────────────────────────────────────────────────▶
    0s   3s   10s   30s   60s   90s   120s   180s
              Time in Video

■ Critical retention points:
  • 0-3s: Hook (lose 33% without strong hook)
  • 10s: First major drop-off
  • 30s: Platform algorithm threshold
  • 60s: Half-time engagement check
```

## Platform-Specific Pacing Rules

| Platform | Optimal Cut Rate | Avg. Shot Duration | Hook Window | Sweet Spot Length |
|----------|------------------|-------------------|-------------|-------------------|
| TikTok   | 20-40 cuts/min   | 1.5-3 seconds     | 0.5 seconds | 15-30 seconds     |
| Reels    | 15-30 cuts/min   | 2-4 seconds       | 1 second    | 30-60 seconds     |
| YouTube Shorts | 15-25 cuts/min | 2-4 seconds    | 1.5 seconds | 30-60 seconds     |
| YouTube Long | 8-15 cuts/min  | 4-8 seconds       | 5 seconds   | 8-15 minutes      |
| LinkedIn | 5-10 cuts/min    | 6-12 seconds      | 3 seconds   | 60-90 seconds     |
| Twitter/X | 15-25 cuts/min  | 2-4 seconds       | 1 second    | 15-45 seconds     |

## Cut Frequency Patterns

### High-Energy Pattern (TikTok, Reels)
```
Time:    |0s     |1.5s   |3s     |4.5s   |6s     |7.5s   |9s
Cuts:    ●━━━━━━━●━━━━━━━●━━━━━━━●━━━━━━━●━━━━━━━●━━━━━━━●
Energy:  [HIGH]  [HIGH]  [PEAK]  [HIGH]  [PEAK]  [HIGH]  [END]
```

### Building Tension Pattern
```
Time:    |0s       |4s       |7s      |9s     |10s   |10.5s |11s
Cuts:    ●━━━━━━━━━●━━━━━━━━━●━━━━━━━●━━━━━━●━━━━━●━━━━━●━━━▶
Speed:   [SLOW]    [MEDIUM]  [FAST]  [FASTER] [RAPID] [PEAK]
```

### Breathe Pattern (Documentary/Educational)
```
Time:    |0s       |8s       |16s       |20s     |28s      |36s
Cuts:    ●━━━━━━━━━●━━━━━━━━━●━━━━━━━━━━●━━━━━━━●━━━━━━━━━●
Rhythm:  [INTRO]   [DEVELOP]  [BREATHE]  [BUILD] [DEVELOP] [LAND]
```

## The 3-Second Rule

Every 3 seconds, provide ONE of:
- New visual information (cut, motion, transition)
- New audio information (voice change, sound effect, music shift)
- New text information (caption, graphic, lower third)

```
0s        3s        6s        9s        12s
|━━━━━━━━━|━━━━━━━━━|━━━━━━━━━|━━━━━━━━━|
[CUT]     [TEXT]    [SFX]     [CUT]     [MUSIC]
```

## Rhythm Patterns

### 1. Heartbeat Rhythm
Mimics natural pulse: strong-weak-strong-weak
```
Beat:     |●     |○     |●     |○     |●     |○
Timing:   |0s    |0.5s  |1s    |1.5s  |2s    |2.5s
Action:   |CUT   |hold  |CUT   |hold  |CUT   |hold
```

### 2. Escalation Rhythm
Progressive intensity increase
```
Phase 1:  ●━━━━━━━━━●━━━━━━━━━●  (4s intervals)
Phase 2:  ●━━━━━●━━━━━●━━━━━●    (2.5s intervals)
Phase 3:  ●━━●━━●━━●━━●━━●       (1s intervals)
Climax:   ●●●●●●●●●●●            (rapid cuts)
```

### 3. Wave Rhythm
Tension and release cycles
```
Tension:  ████████
          ███████░
          ██████░░
          █████░░░░
Release:  ██░░░░░░░
          ████░░░░░
Build:    ██████░░░
          ████████░
Peak:     ██████████
```

## Cut Types and When to Use Them

| Cut Type | Duration | Use Case | Energy Level |
|----------|----------|----------|--------------|
| Hard Cut | 0 frames | Action, emphasis, rhythm | High |
| J-Cut | Audio leads 0.5-1s | Conversation, anticipation | Medium |
| L-Cut | Video leads 0.5-1s | Continuation, smooth flow | Medium |
| Jump Cut | 0 frames, same subject | Compression, energy | High |
| Match Cut | 0 frames, matched motion | Transitions, storytelling | Medium |
| Smash Cut | 0 frames, contrast | Shock, comedy, drama | Very High |
| Fade | 0.5-2s | Endings, time passage | Low |
| Dissolve | 0.5-1.5s | Dream, memory, soft transition | Low |

## Music-Driven Pacing

### Beat Synchronization
```
Music:    |♩       |♩       |♩       |♩       |
BPM:      |120     |        |        |        |
Time:     |0ms     |500ms   |1000ms  |1500ms  |
Cut:      |●       |        |●       |        |   (half-time)
Cut:      |●       |●       |●       |●       |   (on-beat)
Cut:      |●   ●   |●   ●   |●   ●   |●   ●   |   (double-time)
```

### BPM to Cuts/Minute Conversion
```
BPM 60  → 60 potential cuts/min  (1 per second)
BPM 90  → 90 potential cuts/min  (1.5 per second)
BPM 120 → 120 potential cuts/min (2 per second)
BPM 140 → 140 potential cuts/min (2.3 per second)

Practical application: Cut on every 2nd or 4th beat
BPM 120 on every 2nd beat = 60 cuts/min
BPM 120 on every 4th beat = 30 cuts/min
```

## Information Density vs Pace Tradeoff

```
                    Information Density
                    Low         Medium        High
              ┌─────────────┬─────────────┬─────────────┐
        Fast  │ Music Video │ TikTok      │ OVERWHELM   │
              │ Pure vibes  │ Entertainment│ Avoid!      │
Pace    ──────┼─────────────┼─────────────┼─────────────┤
        Med   │ Aesthetic   │ YouTube     │ Documentary │
              │ B-roll      │ Essays      │ Explainers  │
        ──────┼─────────────┼─────────────┼─────────────┤
        Slow  │ BORING      │ Corporate   │ Educational │
              │ Avoid!      │ LinkedIn    │ Tutorials   │
              └─────────────┴─────────────┴─────────────┘
```

### Cognitive Load Zones
```
Optimal Zone: 3-5 new concepts per minute
Warning Zone: 6-8 concepts (reduce pace or simplify)
Overload:     9+ concepts (viewers will drop off)
```

## Hook Formulas by Platform

### TikTok/Reels Hook (0.5-1s)
```
Frame 1 (0-0.3s): Visual shock or question
Frame 2 (0.3-0.7s): Promise of value
Frame 3 (0.7-1s): Begin delivery
```

### YouTube Hook (0-5s)
```
0-1s: Pattern interrupt (visual/audio)
1-3s: State the transformation/outcome
3-5s: Credibility or intrigue
5s+:  Begin content
```

### LinkedIn Hook (0-3s)
```
0-1s: Professional context
1-2s: Contrarian take or insight
2-3s: Why it matters to viewer
```

## Pacing by Content Type

### Tutorial Content
```
Intro:     Fast (hook + overview)     2-3s shots
Demo:      Slow (show process)        6-12s shots
Summary:   Medium (recap)             4-6s shots
```

### Story Content
```
Setup:     Medium (establish)         4-6s shots
Build:     Accelerating              4s → 2s shots
Climax:    Fast                      1-2s shots
Resolution: Slow                     6-8s shots
```

### Product Content
```
Hook:      Fast (attention grab)      1-2s shots
Features:  Medium (demonstrate)       3-5s shots
Benefits:  Slow (emotional)           5-8s shots
CTA:       Fast (urgency)             2-3s shots
```

## Retention Optimization Checkpoints

```
Checkpoint    Action if Dropping
──────────────────────────────────────────
0-3s          Strengthen hook visual
3-10s         Add pattern interrupt
10-30s        Restate value proposition
30-60s        Introduce new element
60-90s        Provide payoff/proof
90-120s       Build to climax
120s+         Maintain with variety
```

## Quick Reference: Pacing Cheat Sheet

```
Platform     | Cuts/Min | Shot Avg | Hook    | Music BPM
─────────────┼──────────┼──────────┼─────────┼──────────
TikTok       | 20-40    | 1.5-3s   | 0.5s    | 120-140
Reels        | 15-30    | 2-4s     | 1s      | 100-130
YT Shorts    | 15-25    | 2-4s     | 1.5s    | 100-120
YT Long      | 8-15     | 4-8s     | 5s      | 80-120
LinkedIn     | 5-10     | 6-12s    | 3s      | 60-90
```

## Remotion-Specific Pacing

### Frame Calculation Formulas

```typescript
// Core formula: frames = fps * seconds
const fps = 30;
const SCENE_END = fps * 5;     // 5 seconds = 150 frames
const FADE_START = fps * 4.5;  // 4.5 seconds = 135 frames

// Sequence timing
<Sequence from={0} durationInFrames={fps * 5}>        {/* 0-5s */}
<Sequence from={fps * 5} durationInFrames={fps * 3}>  {/* 5-8s */}
<Sequence from={fps * 8}>                              {/* 8s onwards */}
```

### Animation Utilities (Underutilized)

```typescript
import {
  interpolate,
  interpolateColors,      // Color transitions
  spring,
  measureSpring,          // Know spring duration
  Easing,                 // Custom curves
} from "remotion";

import {
  makeTransform,          // Clean transform composition
  interpolateStyles,      // Smooth style transitions
} from "@remotion/animation-utils";

// Example: makeTransform for cleaner code
const transform = makeTransform([
  ["translateY", `${(1 - progress) * 20}px`],
  ["scale", scale],
  ["rotate", `${rotation}deg`],
]);

// Example: interpolateColors for gradients
const color = interpolateColors(
  frame,
  [0, 30, 60],
  ["#ef4444", "#f59e0b", "#22c55e"]
);

// Example: measureSpring for precise timing
const duration = measureSpring({ fps, config: { damping: 15, stiffness: 150 } });
console.log(`Spring takes ${duration} frames`);
```

### Spring Presets

```typescript
// Snappy (UI elements, buttons)
const SPRING_SNAPPY = { damping: 15, stiffness: 180 };

// Smooth (containers, panels)
const SPRING_SMOOTH = { damping: 12, stiffness: 120 };

// Bouncy (attention, celebration)
const SPRING_BOUNCY = { damping: 8, stiffness: 200 };

// Slow (dramatic reveals)
const SPRING_SLOW = { damping: 20, stiffness: 80 };

// Usage
const scale = spring({ frame, fps, config: SPRING_SNAPPY });
```

### Bundler Caching Gotchas

```bash
# PROBLEM: Asset changes not reflected in render
# Remotion bundles aggressively - old assets may persist

# SOLUTION 1: Kill and re-render
pkill -f "remotion"
npx remotion render CompositionName output.mp4

# SOLUTION 2: Clear bundler cache
rm -rf node_modules/.cache
npx remotion render ...

# SOLUTION 3: Use unique filenames for assets during dev
public/logo-v2.png  # Instead of overwriting logo.png
```

### staticFile vs Inline Assets

```typescript
// ✅ GOOD - External assets via staticFile
import { staticFile, Img } from "remotion";
<Img src={staticFile("claude-logo.png")} />

// ❌ BAD - Inline SVG when you need actual logo
<svg>...</svg>  // Only for generated graphics

// ✅ GOOD - Audio via staticFile
<Audio src={staticFile("audio/snap-attack.mp3")} volume={0.35} />
```

### Easing Functions

```typescript
import { Easing } from "remotion";

// Built-in easings
const opacity = interpolate(frame, [0, 30], [0, 1], {
  easing: Easing.bezier(0.25, 0.1, 0.25, 1),  // ease
  // easing: Easing.inOut(Easing.ease),       // ease-in-out
  // easing: Easing.out(Easing.cubic),        // ease-out-cubic
});

// Common presets
const EASE_OUT_EXPO = Easing.bezier(0.16, 1, 0.3, 1);
const EASE_IN_OUT_QUART = Easing.bezier(0.76, 0, 0.24, 1);
```

## Related Skills

- `remotion-composer`: Programmatic video generation with Remotion
- `video-storyboarding`: Pre-production planning and scene structure
- `motion-animation-patterns`: Animation timing curves
- `core-web-vitals`: Performance timing principles
- `thumbnail-first-frame`: First frame visibility gotchas

## References

- [Platform Pacing Rules](./references/platform-pacing-rules.md) - Detailed platform requirements
- [Rhythm Patterns](./references/rhythm-patterns.md) - Advanced rhythm techniques
- [Attention Curves](./references/attention-curves.md) - Viewer retention research
- [Remotion spring() docs](https://www.remotion.dev/docs/spring) - Spring animation API
- [Remotion makeTransform()](https://www.remotion.dev/docs/animation-utils/make-transform) - Transform composition
- [Remotion interpolateStyles()](https://www.remotion.dev/docs/animation-utils/interpolate-styles) - Style interpolation

Overview

This skill codifies video rhythm, timing, and platform-specific pacing rules to maximize viewer engagement. It translates attention-curve theory into concrete cut rates, shot durations, hook windows, and rhythm patterns for short-form and long-form formats. Use it to tune cuts, music synchronization, and scene timing for platform algorithms and human attention.

How this skill works

The skill inspects target platform constraints and maps them to optimal cuts-per-minute, average shot durations, and hook timing. It provides pattern templates (high-energy, tension build, breathe), the 3-second rule, rhythm presets, and music-to-cuts conversions to align visuals with audio. Practical Remotion utilities and frame formulas are included to convert timing into frames and animation springs for programmatic rendering.

When to use it

  • Designing hooks and first 10 seconds for TikTok, Reels, Shorts, or LinkedIn
  • Planning cut frequency and shot lengths for platform-specific uploads
  • Converting musical BPM into edit timing and sync points
  • Creating tension, escalation, or breathe pacing for storytelling or documentaries
  • Implementing Remotion sequences and animation timing in programmatic video builds

Best practices

  • Apply the 3-second rule: deliver one new visual, audio, or text element every three seconds
  • Match information density to pace—avoid overloading viewers (optimal: 3–5 new concepts/minute)
  • Use platform cheat sheet for initial cut rate and shot length, then A/B test slight tempo changes
  • Sync cuts to musical beats (every 2nd or 4th beat) rather than every beat for cleaner pacing
  • Choose cut types deliberately: hard cuts for energy, J/L-cuts for conversational flow, fades/dissolves for low-energy transitions

Example use cases

  • Build a 0–30s high-energy TikTok sequence: 20–40 cuts/min, 0.5s hook, heartbeat rhythm
  • Structure a tutorial: fast hook, slow demo shots (6–12s), medium recap for retention
  • Assemble a YouTube long-form edit: 8–15 cuts/min, 4–8s shots, 5s hook to secure early retention
  • Programmatic Remotion render: convert seconds to frames, apply spring presets for UI element motion, clear bundler cache during iterative dev
  • Create a product promo: fast hook (1–2s), medium feature demos (3–5s), slow benefit shots (5–8s), quick CTA

FAQ

How do I pick cut frequency when music tempo changes mid-track?

Map local BPM to potential cuts and choose a division (every 2nd or 4th beat) that matches information density; slow scenes use wider divisions, high-energy scenes use tighter divisions.

What if my content has high information density?

Reduce cut rate, simplify visuals, or group concepts so you stay in the optimal zone (3–5 concepts per minute). If necessary, slow the pace and use longer shots with clear on-screen text.