Editorial content on autopilot

The demo

The system

Signal

🔔A verified factwith a real source, no fluff

↓if the fact doesn't hold, the piece dies here

Brief

✍️Copywriterhook, beats and format

✋Editorgate: can send the copy back

↓the editor actually filters, not just approves

Render

🖥️HTML + Chromethe browser is the designer

🎬ffmpegbuilds the reels, zero credits

Whispertranscribes for the subtitles

↓the design gets baked without opening an editor

Quality control

🎯Head of designgate: stops an ugly piece even if it's done

↓nothing passes without a human eye

Draft

Publerposts and reels, one account per brand

TypefullyX threads and LinkedIn carousels

The tools

Claude Codethe director

The copilot that orchestrates the engine: reads the signal, writes the brief and coordinates the roles. The brand is configuration, not code.

Learn more ↗

🖥️

Chrome headlessthe designer

Renders the HTML cards to PNG without opening an editor. The browser is what draws.

🎬

ffmpegvideo editor

Builds the reels: joins clips, subtitles and overlays. Runs locally, no credits.

Docs ↗

whispersubtitles

Transcribes the clips' audio before burning in the subtitles. I fix the typical errors by hand.

Docs ↗

Publerdistribution

Where the post and reel drafts land, one account per brand. I review and publish.

Try it ↗

Typefullythreads and carousels

The X and LinkedIn drafts, ready to review before they go out.

Try it ↗

Replicate it step by step

The code, the connections and the mistakes I already made for you.

1. 1

   Write the brand profile once

   The factory is a generic engine; the brand is configuration. All the voice, palette, keywords and target account get written once into a profile, and the engine stays untouched. Adding a new brand means writing another profile, not reprogramming anything. This is the skeleton I fill:

   checklist · brand profileCopy

   BRAND PROFILE (written once, the engine stays untouched):
   - Voice: first person, direct, no fluff. What sounds like the brand and what doesn't.
   - Palette and type: the hex colors and the font of the cards.
   - Keywords: the terms the brand always uses (and the forbidden ones).
   - Transcription fixes: typical errors and their correct form.
   - Target account: where the drafts land (one network per brand).
   - Cover rule: where the title goes and the safe zone of the crop.
   Adding a new brand = writing another profile. Never touch the engine.

2. 2

   Let a signal trigger the brief

   The piece doesn't start in the tool, it starts in a fact. A signal is a verified fact with a source, not a random idea. If the fact doesn't hold, it stops right there: publishing fluff costs more than not publishing. When the signal passes, it becomes a brief:

   prompt · brief from the signalCopy

   Take this signal (a verified fact, with a source) and build the brief:
   1. Exact 3-second hook (read as-is).
   2. 3 or 4 beats to develop (one per idea, no filler).
   3. The format the signal calls for (4:5 post, carousel or reel).
   4. The source, so we don't publish fluff.
   5. CTA and open loop toward the next piece.
   If the fact doesn't hold up with a real source, stop here.

3. 3

   Render with the browser as the designer

   The cards and posts get laid out in HTML with the brand's CSS, and Chrome headless captures them to PNG. No design editor to open, no credits to spend: the browser draws. A 4:5 post comes out at 1080x1350, a vertical reel at 1080x1920.

   shell · an HTML card becomes a PNGCopy

   # render.sh · the browser plays designer
   # HTML + brand CSS inside, headless capture outside.
   "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" \
     --headless=new --disable-gpu --hide-scrollbars \
     --force-device-scale-factor=2 --window-size=1080,1350 \
     --virtual-time-budget=8000 \
     --screenshot=out.png card.html
   # 1080x1350 = 4:5 post. For a vertical reel: 1080x1920.
   # --virtual-time-budget lets fonts and data load before the shot.

4. 4

   Reels: subtitles that actually get read

   The reel gets composited with ffmpeg: clips, burned-in subtitles and overlays. The part that makes or breaks the piece is the subtitles, and the rule there is counterintuitive: static and clean beats word-by-word karaoke. And everything respects Instagram's safe zone, so it doesn't sit under the buttons.

   checklist · reel subtitles (9:16, 1080x1920)Copy

   SUBTITLES THAT ACTUALLY GET READ:
   - Static and clean: white bold, black outline, ~3 words per line.
     Word-by-word karaoke looks busier, but it reads worse.
   - Safe zone: text lives around y≈880 (~69% of the height) and under ~620px
     wide, to clear Instagram's buttons on the right.
   - Cards enter from y≈150, never glued to the edge or the profile up top.
   - Motion (spring-in entrances, progress bar, emoji bursts) adds to it;
     readable subtitles rule.

5. 5

   Set the human gates: editor and head of design

   This is where directing and letting go part ways. Before the render, an editor reviews the copy and can send it back. After the render, a head of design reviews the visual and can stop a piece even if it's already done. Each gate has to be able to say no, not just approve. A gate that always says yes isn't a gate.

6. 6

   Deliver as a draft, never auto-post

   The last step is the most important: the factory leaves everything in draft, in Publer and Typefully, with its caption and its source. The final OK is human, always. Automating production is not automating judgment. Want to do this live, with your own business, and walk out with 30 days of content done? That's exactly the byTHELAB School workshop.

Keep going with these