Claude Opus 5.5 Built Me a Pipeline That Turns Every Build Into a 4K Demo and an X Draft
When a post goes up on AI for Mortals, the pipeline records each build in 4K, writes the X post, and saves it as a draft.
I build something for almost every YouTube video I make, and each one goes up on AI for Mortals with a live link and the exact prompt I used to make it. What I almost never do is post those builds to X, because I forget, and on the days I do remember, posting them one at a time feels like a chore I can put off.
So I asked Claude Opus 5.5, working in Claude Code, to build me a pipeline that handles it. When a post goes up on AI for Mortals, it finds every build in the post and records a 4K demo video of each one.
Then it writes a plain X post, plus a reply with the live link and a link straight to the prompt on the blog, saves the thread to my X drafts, and pings me. I read it and fix the wording before I post it myself, so nothing goes out without me. The video below is one it made on its own.
Why my old screen recordings looked bad
About a year ago I tried recording my sites with Playwright, a tool that lets a script drive a real browser, and the results were bad enough that I gave up on the idea. The text came out soft, the scrolling was choppy, and anything in 3D stuttered. The reason is written up in a Playwright GitHub issue: its built-in recorder is hardcoded to an older video format, VP8, at roughly one megabit per second, which is a low setting for a page full of fine type and moving 3D.
The pipeline Opus 5.5 built takes screenshots and assembles them into a video afterward. It freezes the web page's clock, meaning the timers and animation loops a site uses to move things, then pushes that clock forward by exactly one frame, takes a 4K screenshot, and repeats until the demo is done. At the end, FFmpeg stitches the frames together into a movie. Since the page only ever sees time advance in perfect one-frame steps, it can't tell it's being recorded, and the video comes out perfectly smooth at 60 frames per second no matter how long any single screenshot takes.
Making it look like a person is using the site
A smooth video still looks strange when a robot is doing the scrolling, and the first version scrolled far too fast. I asked it to slow down, and then I asked a second time before I approved it. It now scrolls the way a hand on a trackpad does, in slow, overlapping pushes that ease in and coast to a stop.
There's a cursor on screen too, which the pipeline draws itself and moves along curved, human-looking paths using the open-source library ghost-cursor. Because the cursor sends real mouse events to the page, hover effects fire as it passes over them, and 3D objects spin when it drags them. It can play games too, and in a RollerCoaster Tycoon clone that Opus 5.5 built, it opens the build menu, lays down a coaster piece by piece, and sends it around for a test lap.
The finished video puts the site in a rounded window on a dark wallpaper, with no titles or captions anywhere on it. I have one rule for these videos, and it's that the video is just the site, not some fancy, try-hard HyperFrames demo or anything like that (no offense, HyperFrames).
Okay, so here's the part that makes this truly agentic, and honestly so cool that it exists nowadays.
Saving drafts with no way to publish
The pipeline opens X in a Chrome browser on my Mac mini that is logged in to my account, and drives it with Chrome's built-in remote-control protocol, CDP. It uploads the video and types the post and the reply, then saves the thread as a draft. The script also blocks the request X uses to publish a post, so even if something went wrong in that browser, it would have no way to put anything live.
All of the recording and rendering happens on the Mac mini as well, which means no browser windows pop up on the computer I'm working on while it runs.
What happens when a post goes up
The whole thing runs on its own: a script on the Mac mini checks AI for Mortals every 30 minutes, and when a new post has builds in it, it records each one. My agent writes the captions from each build's own notes, and once the drafts are saved, it pings me. The captions come out plain and matter-of-fact, along the lines of "Here's Opus 5.5 cloning an Awwwards Site of the Day."
Checking the captions against the build notes has already caught me once. I remembered the drink can in the MANA brand-site clone, another Opus 5.5 build, as a Blender model, but the notes said it was built in code with three.js, a library for drawing 3D in the browser, and the notes were right.
Every build I publish now lands in my X drafts with a finished video and a post that only says what the build's own notes say. The one part still on my plate is reading it and deciding whether it goes out, and that's the part I wanted to keep.
The prompt to build your own
If you want the same thing for your own site, this is the prompt I'd start from. Paste it into Claude Code in an empty folder and it builds the pipeline, then stops after the first video so you can tune the scroll speed and the look before it records the rest.
Build me a pipeline that turns my web builds into demo videos for X. 1. Watch my blog's feed (RSS or a JSON API) for new posts. When one appears, pull out every link to a live build. 2. Record each build with Playwright driving real Chrome. Don't use Playwright's built-in video recorder. Instead, inject a script that freezes the page's clock (requestAnimationFrame, timers, performance.now, Date.now and CSS animations) and steps it forward exactly one frame at a time. Screenshot every frame and pipe the frames into ffmpeg at 60fps. Capture at 2x device pixel ratio or higher so text stays sharp. 3. Make it look like a person is using the site. Scroll slowly, in overlapping trackpad-style pushes that ease in and coast out. Draw a visible cursor and move it with the ghost-cursor library so hover effects fire. Start moving within a fraction of a second, and always scroll to the bottom of the page. 4. Use ffmpeg to put the video in a rounded window with a soft shadow on a wallpaper image. No titles or captions. Export a 4K master and a 1080p copy for X. 5. Write a short, plain X post about each build using only facts from the page, plus a reply with the live link. 6. Save each post to my X drafts using a Chrome window I'm logged in to, controlled over CDP. Never click Post, and block X's CreateTweet request so it can't publish by accident. Show me the first video before you record the rest.
Comments
Sign in to join the conversation.