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

// 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)

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

// 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

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

// ✅ 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

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 - Detailed platform requirements

• Rhythm Patterns - Advanced rhythm techniques

• Attention Curves - Viewer retention research

• Remotion spring() docs - Spring animation API

• Remotion makeTransform() - Transform composition

• Remotion interpolateStyles() - Style interpolation