I am building a web app in my evenings. (Yes, of course its AI powered – isn’t everything these days?) I was asking some friends for feedback and realized they might needs some tutorials on how to use it. But I keep changing the UI! How to avoid re-recording onboarding videos over and over again? Claude Code + Playwright is taking a lot of the sting out of it.
The cool part is that I have just been saying “I want a video to show how to do X” and Claude Code works out how a user would achieve the goal, writes a talk-track, uses Text-to-Speech libraries to convert to audio files, creates a Playwright automation script to perform the operations, then screen records running the Playwright script with Playwright support for incorporating audio annotations.
Is this Claude Code specific? No – I am sure the other good AI coding tools can do it too. Is there some super advanced secret coding agent approach I used to build all this? Sign up to my Patreon and for a small fee I will reveal all my secrets? Umm, sorry, but no! I told Claude Code to use Playwright, the text to speech library and voice to use, and it did the rest! Yes, it took a few iterations to get it right, but it was a few hours of minimal supervision and is working fine now.
Specifically, I am using this for short videos to introduce new capabilities for users. Are they the best videos? No! But they are useful, and they now take minimal effort to create. And more importantly, every time I change the UI of my app, it just reruns the Playwright scripts and I have a new, up to date video. Since I am trying to get feedback on my app and improve it, this saves me a lot of time. Friend 1 gives me feedback, I update the UI, ask Claude to check the Playwright scripts in case the UI has changed, and regenerate. Friend 2 then gets screen recordings that match the updated code. Amazing! (You can decide for yourself whether “amazing” refers to the auto-generated training videos, or that I have two friends…)
Would I use this for a full training course? No. I want to record some personal recordings as well, not just screencasts, to add a bit of variety and give it some life. The screen recordings server a functional purpose, but are more impersonal. But the time savings have been real. Just another one of those little AI life hacks for developers to deliver better results for users for proportionally minimal effort.
Examples embedded in documentation pages:
Alan Kent's Blog 