How I use Strands Agents to make Waco3 tutorials
A reviewed script becomes a screen recording, local narration, and an edited walkthrough. The workflow, review boundaries, and TypeScript scaffold.
I have been building a video workflow for Waco3: write a tutorial, record the product, generate a voiceover, and assemble a walkthrough. I review the scripts before production. Agents handle the repeatable work around that decision.
My motion and editing background makes this an interesting engineering problem. A useful tutorial needs accurate screen actions, clear narration, and timing that lets someone follow along. Generating those pieces separately is easy. Keeping them consistent is the work.
Give each worker a job
I use the TypeScript version of Strands Agents, the open-source agent framework introduced by AWS. It gives me the agent loop, model connections, and tools to build the surrounding workflow. AWS’s TypeScript announcement explains that foundation.
I have connected agents to local and subscription-backed model setups. The model connection is configurable; the production steps should keep the same inputs and responsibilities when that connection changes.
For video, those responsibilities are concrete:
| Stage | Responsibility |
|---|---|
| Script | Turn the feature and task into screen actions paired with narration. |
| My review | Correct the sequence, wording, and product claims before production. |
| Capture | Perform the reviewed steps in a test environment and record the screen. |
| Narration | Generate speech from the approved words using Kokoro.js. |
| Composition | Assemble footage, voice, and timing with HyperFrames or Remotion. |
| Validation | Inspect outputs, flag mismatches, and leave a video I can review. |
- 01 · Script agentDraft the walkthrough
Steps, screen actions, and narration.
Human decisionI review the scriptApprove the exact version to produce.
- 02 · Independent workers · Run in parallelCapture workerRecord the product
Approved steps in a test environment.
Narration workerGenerate the voiceKokoro.js reads the approved narration.
- 03 · CompositionAssemble the video
HyperFrames or Remotion combines the recording, voice, and timing.
- 04 · ValidationCheck the artifacts
Media checks and an agent review of the report.
Human decisionI watch and reviewA passed check leaves publication to me.
A failure stops dependent stages. Keep completed artifacts and fix the affected step.
The capture layer drives the actual application. HyperFrames and Remotion handle video composition and rendering; recording browser interactions is a separate responsibility in the workflow. HyperFrames uses HTML compositions, while Remotion uses React. I use both in this work; a particular render can use either. HyperFrames and Remotion’s rendering API document those roles.
For voice, Kokoro.js runs the Kokoro TTS model locally. Its documented model has 82 million parameters. That makes local narration practical for this workflow without sending every line to a hosted voice service. Kokoro.js usage covers the JavaScript API and runtime options.
Connect agents through explicit contracts
Here is a simplified scaffold of the pattern, rather than a copy of Waco3’s production code. Strands supplies the agents; TypeScript owns the sequence and review gates.
A worker gets a specific prompt and a narrow tool. The callback closes over the reviewed input, so the model does not rewrite the script through tool arguments:
import {Agent, tool, type Model} from '@strands-agents/sdk';
import {z} from 'zod';
function captureAgent(model: Model, recordApprovedSteps: () => Promise<string>) {
const record = tool({
name: 'record_approved_steps',
description: 'Record the reviewed steps in the test app.',
inputSchema: z.object({}),
callback: recordApprovedSteps,
});
return new Agent({
model,
tools: [record],
systemPrompt: 'Capture the approved tutorial. Call the recording tool; do not invent a recording.',
});
}
In the complete scaffold, the script is schema-validated and given a revision hash. Human approval comes before the two independent media workers:
if (!await io.approveScript(job())) {
return {status: 'awaiting-script-review'};
}
const results = await Promise.allSettled([
mediaWorker('capture worker', captureInstructions,
createModel, () => io.capture(job())),
mediaWorker('narration worker', narrationInstructions,
createModel, () => io.narrate(job())),
]);
The shared model factory is an integration point for the provider I configure. Strands supports custom model connections; this example does not assume that a consumer subscription itself exposes an API. Its agent and tool APIs follow the TypeScript quickstart.
Failure needs a place to go
The scaffold checks the artifact returned by the tool callback. An agent saying “recorded” cannot stand in for an actual capture result. Repeated calls inside one worker share one attempt, so a tool-call loop does not start duplicate recordings.
allSettled lets a successful narration finish even if capture fails. Composition waits for both. A failed media check stops the workflow; a separate review agent examines the script and inspection report. A file path alone does not let that agent see or hear the video.
The result is awaiting human review, even when checks pass. I still need to watch the walkthrough, hear the narration, and decide whether it teaches the task clearly.
Durable checkpoints and resuming only the failed stage are integration work called out in the scaffold. The download includes adapter contracts for browser capture, Kokoro.js, composition, and inspection. It has been type-checked against Strands SDK 1.24.0; it does not include Waco3’s private drivers or a rendered demo.
This is a workflow I am actively developing and using for Waco3 help videos. I am not publishing a measured time-saving result. The useful change is that the script, recording, narration, and review can be managed as one repeatable production process.
Download the TypeScript scaffold · How I build with AI · Waco3 case study