How to use Claude to automate React video generation
Outscal constrained agent tools and supplied context upfront after inconsistent Claude Code runs, then moved its React video pipeline to the Claude Agent SDK and launched an automated web version.
news.ycombinator.com
Prompt to try
Editorial adaptation, not the source author’s exact prompt. Replace bracketed inputs and review tool permissions first.
Create [video] from [script] in [supported style]. Divide work into scene direction, narration audio, SVG assets, scene design, and React components. Give each agent only [required tools] and supply [task context] upfront. Produce [deployment target].
Reach people exploring AI agents
See placements →What happened
The author reports immediate quality improvement after restricting tools and pre-feeding context, followed by a live, fully automated web version.
Reported by mayankkgrover on Hacker NewsHow the agent did it
- Built the initial React video generator with Claude Code.
- Removed unnecessary agent tools and supplied context ahead of execution.
- Moved to the Claude Agent SDK while retaining the same constraints.
Where a person stepped in
The team withheld the web launch until behavior was solid; the post does not describe a formal review process for individual videos.
A person set the goal and reviewed the result.
Outscal described a video generator that turns text scripts into animated React/TSX components. Users choose a pencil-sketch or neon style and enter a script of up to 2,000 characters. The reported pipeline moves through scene direction, ElevenLabs audio, SVG assets, scene design, React components, and a deployed video.
The team built its first version on Claude Code. Even with a person triggering commands, agents with file tools wandered into unrelated files and tangents, making output inconsistent. The team responded by reducing each agent's tools to those needed for its task and supplying context beforehand instead of letting agents fetch it themselves. The author said quality improved immediately.
They delayed launching the web version until that behavior was solid, then moved to the Claude Agent SDK while keeping the same constraints. The post describes the resulting workflow as fully automated and announces that the website is live. It gives no quantitative quality comparison or detailed account of output review. Who it's for: teams creating scripted motion graphics that want to divide an automated generation pipeline into narrowly equipped agents.
Prompt
Suggested prompt (written by Agents In Use, not the author's)
Source: Hacker News · mayankkgrover
Frequently asked questions
What changed when agents went off-script?
The team removed tools each agent did not need and pre-fed context instead of letting agents fetch it. The author reports an immediate quality improvement.
What does the video pipeline generate?
The post lists scene direction, ElevenLabs audio, SVG assets, scene design, React components, and deployed video. Users choose pencil-sketch or neon styling.
More details
Remaining steps
- Launched the website with the pipeline fully automated.
About this account
The initial version had human-triggered commands; the later Claude Agent SDK pipeline is described as fully automated.
Platform: Hacker News. Attribution: https://news.ycombinator.com/item?id=46592740. Prompt: Suggested (written by Agents In Use, not the author's). Sourced by the Agents In Use pipeline.
Credit: mayankkgrover on Hacker News
Source published 12 Jan 2026
Source checked 14 Oct 2026
Tools and topics
Claude Code · Claude Agent SDK · ElevenLabs · React · SVG
Video · React · Agent tools
Editorial completeness: 100/100. Measures documented fields, not agent performance or verified outcomes.