Split-Screen Gameplay + Pexels (Render Template)

May 2, 2026 ยท View on GitHub

This produces the same style as output/demo-subway-pexels/video.mp4: gameplay on one half, Pexels B-roll on the other, word-highlighted captions, muted gameplay audio.

This is a split-screen Pexels workflow. It is not the reddit-post-over-gameplay archetype. For full-screen gameplay-only Reddit stories, use skills/reddit-post-over-gameplay-short/SKILL.md and do not request Pexels or random B-roll.

Prereqs:

  • .env has OPENAI_API_KEY (keyword extraction) and PEXELS_API_KEY (stock footage).
  • Gameplay clips live in ~/.cm/assets/gameplay/<style>/ (or pass --gameplay <path>).
# 1) Prepare gameplay clips
mkdir -p ~/.cm/assets/gameplay/subway-surfers
cp /path/to/subway.mp4 ~/.cm/assets/gameplay/subway-surfers/

# 2) Generate script
cat <<'JSON' | node --import tsx scripts/harness/brief-to-script.ts
{
  "topic": "Redis vs PostgreSQL for caching",
  "archetype": "versus",
  "outputPath": "output/script.json"
}
JSON

# 3) Generate audio + timestamps
cat <<'JSON' | node --import tsx scripts/harness/script-to-audio.ts
{
  "scriptPath": "output/script.json",
  "audioOutputPath": "output/audio.wav",
  "timestampsOutputPath": "output/timestamps.json",
  "voice": "af_heart"
}
JSON

# 4) Match Pexels visuals + gameplay
cat <<'JSON' | node --import tsx scripts/harness/timestamps-to-visuals.ts
{
  "timestampsPath": "output/timestamps.json",
  "provider": "pexels",
  "orientation": "portrait",
  "gameplay": {
    "style": "subway-surfers",
    "required": true
  },
  "outputPath": "output/demo-subway-pexels/visuals.json"
}
JSON

# 5) Render split-screen (gameplay on top, Pexels on bottom)
cat <<'JSON' | node --import tsx scripts/harness/video-render.ts
{
  "visualsPath": "output/demo-subway-pexels/visuals.json",
  "timestampsPath": "output/timestamps.json",
  "audioPath": "output/audio.wav",
  "outputPath": "output/demo-subway-pexels/video.mp4",
  "compositionId": "SplitScreenGameplay",
  "gameplayPosition": "top",
  "contentPosition": "bottom",
  "downloadAssets": true
}
JSON

Layout options:

  • Swap positions by changing gameplayPosition and contentPosition.
  • Do not use this Pexels workflow to force full-screen gameplay-only Reddit output; use reddit-post-over-gameplay instead.

Troubleshooting:

  • If Remotion fails to decode a gameplay clip, transcode to H.264 baseline:
ffmpeg -y -i input.mp4 -vf "scale=1080:-2" -c:v libx264 -profile:v baseline -level 3.1 \
  -pix_fmt yuv420p -preset veryfast -crf 23 -an -movflags +faststart output.mp4

See also: