A couple of evenings ago I sat down to make tutorial videos for the Reel Pipeline Kit. Eight of them, one per part of the app. And I hit the same wall I always do: I don't want to be on camera, and I don't want to hand-narrate eight screen recordings at nine in the evening.
So I didn't. I built a thing that records the app for me.
The wall
The kit has about eight areas a buyer needs to understand: install and keys, fetching an article, the scenario editor, voice, music, animated clips, branding, and the final render. Each one deserves its own short, detailed walkthrough. Faceless, the same look as the demo videos already on the product page.
Doing that by hand is death by a thousand takes. Open the app, click the thing, fumble the mouse, re-record, line up the voiceover, cut the captions. Then do it seven more times. On top of that, my hand shakes on the mouse and my narration drifts out of sync, so the eight videos never quite match each other. I'd rather write the pipeline once and let it run while I make tea.
The shape of it
Here is how it works. A headless Chrome drives the real app on localhost. It clicks through the actual UI, real buttons, not a mock. While it drives, it captures the screen frame by frame. My cloned voice reads a script I wrote. Captions light up word by word underneath. A small Digital Craft Workshop card opens each video with a whoosh.
The obvious route is a desktop screen grabber, OBS or something like it. I tried that first and got a black rectangle. A screen recorder launched over SSH has no desktop to point a camera at: no monitor, no compositor, nothing painted to a screen for it to see. So instead I let Chrome film itself. It streams its own frames over the debugging protocol, one image per repaint, lossless, and ffmpeg stitches them into a 1080p video afterward. The browser is both the thing being recorded and the camera holding still in front of it.
Chrome films its own frames over the debugging protocol, no desktop required. | Generated with Claude
The cursor is fake too. Headless Chrome has no pointer to record, so I draw one on the page myself. It is a small element that slides between the buttons the script is about to press, and it flashes red for the fraction of a second it clicks. Without it the videos felt haunted, buttons depressing on their own with nothing moving toward them. The fake cursor is the cheapest trick in the whole pipeline and it does more for the "a person did this" feeling than anything else.
The voice is ElevenLabs with a clone of mine. When it returns the audio it also hands back the timing of every word, where each one starts and ends in the clip. That timing is what makes the captions land on the beat instead of drifting a syllable behind the whole way down the video.
The fifteen-line map
The first pass looked fine and read wrong. The captions said exactly what I said out loud.
When the voiceover says "localhost three thousand" so my cloned voice pronounces it properly, I don't want the caption to read "localhost three thousand." I want localhost:3000. Same with data/settings.json, which I say as "data settings json," and Node 20. A developer watching a developer tool notices that kind of thing right away, and once they notice it the whole video reads as amateur.
The spoken form maps back to how you would actually write it. | Generated with Claude
So there is a small map. I spell each term out the long way for the voice, and the caption swaps it back to how you would actually write it. That is the whole trick. It is maybe fifteen lines of code, and it is also the difference between something that looks like a tool and something that looks like a toy. The same word-level caption timing I wrote about for the reels earns its keep here too.
If you want this whole machine broken down stage by stage, I wrote it up as a free email series, one part a week: the Reel Pipeline Series.
Don't touch my setup
One more thing I care about. The recorder pokes my live config while it films. It clicks the voice provider, types a key into a field, toggles animation on a scene, opens the branding panel. Those are my real settings on my real machine, and the whole point of filming is to show them being used.
So it puts everything back. It types a fake key, films the moment, clears the field before anything saves. It flips a radio to show the option, then flips it back to what it was. Nothing the recording does survives the recording. A tutorial recording has no business quietly changing my own configuration.
What came out
Eight episodes. One per feature, one to three minutes each, 1080p, my voice, red captions, the DCW mark on the front. They are all up on the Digital Craft Workshop channel:
- Install & API keys
- Fetch the source article
- The scenario editor
- Voice and narration
- Music bed
- Animated clips (Wan i2v)
- Branding
- Render and history
Eight episodes ride the same pipeline; the ninth is barely any work. | Generated with Claude
My favorite part is the ninth episode, the one I haven't made yet. It would barely be work: a script and a short recipe of which buttons to press, run through the same pipeline. The expensive part was building the first one. Everything after that rides rails that are already there.
The honest bit
It isn't spotless. The render episode shows the app producing a real reel, and the same machine is grinding through my production render queue while it films. So the render list is noisy with other jobs, and a thumbnail or two comes up black in headless Chrome. In that episode I play the finished reel from history instead of watching a progress bar crawl for ten minutes. Good enough for a walkthrough. I would rather ship eight honest videos than polish one forever, and that is a trade I keep making on purpose.
The kit is on the bench, the tutorials record themselves now, and I got my evening back.
The reel pipeline behind these tutorials is its own free email series, one part a week: the Reel Pipeline Series.
External Sources
- ElevenLabs — cloned voice with per-word timings
- Chrome DevTools Protocol — headless frame capture
- FFmpeg — stitches frames into video
- Wan 2.2 — image-to-video for animated clips
The kit itself: Reel Pipeline Kit — turn any article into a narrated, captioned 9:16 reel, locally, on your own keys.
Top comments (0)