Most tools advertise "AI reel generation" and ship slideshows. SocialCTL renders real MP4 videos server-side via Remotion — a React-based programmatic video framework. Here's why the distinction matters and how it works under the hood.

The honest definition: what's a "real" video?

A slideshow is a sequence of still images (usually AI-generated) timed to music. The frames don't move within themselves — they swap every 2–3 seconds. Most "AI reel" tools (Pictory, Invideo's basic tier, many TikTok-style apps) produce this.

A real video has motion at 30fps: text animates on, scenes transition with motion blur, characters move within a frame, the camera pans. This is what Reels, TikToks, and YouTube Shorts that actually perform look like.

SocialCTL renders the second kind. Here's how.

Remotion — React for video

Remotion is a Node.js library that lets you author videos in React/TSX. Each "scene" is a React component. You set durations, props, and audio tracks; Remotion renders the timeline frame-by-frame and emits an MP4.

SocialCTL stores every reel as a composition_tsx file (the React source). When you click Generate:

  1. Anthropic Claude (or whichever AI provider you've configured) drafts a composition tailored to your hook, audience, and brand voice
  2. The TSX is sent to the Remotion sidecar
  3. The sidecar compiles, prefetches assets (images, audio), and renders frame-by-frame at 30fps
  4. The MP4 lands in your workspace ready to preview, edit, or publish

This is the same pattern used by ProductHunt's video team, Replicate's blog videos, and a growing number of YC-backed AI video tools.

Why this matters for the user

1. You get a real MP4

Not a .webm slideshow, not a sequence of stills with the Ken Burns effect — a true H.264-encoded MP4 you can upload to Instagram, TikTok, YouTube Shorts, or Facebook with full quality controls.

2. You can edit it visually

SocialCTL embeds the Remotion editor as an iframe inside the piece editor. You get:

  • Scene-level edits — drag a scene, change its duration, swap its props
  • Text replacements — click a headline, type a new one
  • Music & voice-over — upload tracks, set timing
  • Asset swaps — replace a background image, change a logo

Edits sync back to Laravel automatically via postMessage. The studio's "Save" disappears in embed mode because the parent app handles persistence.

3. You can re-render

A single "Re-render video" button at the top of the page. 2 credits. The render is async — the POST returns in ~200ms, the progress bar polls the sidecar every second, and the new MP4 lands in 30 seconds to a few minutes depending on length and asset count.

4. You can describe changes in plain English

The chat-based revision panel runs each instruction through Anthropic Claude with the current TSX as context. Claude returns a patch (text replacements, prop edits, scene operations) which the sidecar applies, recompiles, and previews. 2 credits per accepted patch.

Example: "Replace 'Welcome to Brewline' with 'Sunday slow brew'" → the patch lands in 1.5 seconds, the preview updates, the source is versioned, and you can re-render.

What you can render

  • Reel / Story — 9:16 vertical, up to 60 seconds, audio + voice-over
  • YouTube Short — same 9:16
  • Square — 1:1 for Instagram feed posts
  • Landscape — 16:9 for YouTube long-form snippets or LinkedIn videos
  • UGC-style talking head — synthetic narration via voice-over

Aspect-correct framing is enforced — text never gets cropped on TikTok because the source composition is built at the target aspect ratio.

Try a real one

Generate a sample via /try — pick "Generate a reel" and you'll get a real MP4 in your sample workspace, with editor access. No signup required to see the output.