Back to all posts

Today we published @appvideostudio/sdk to npm. It gives AI coding agents like Claude Code and Codex the structured tooling they need to build, preview, and iterate on video compositions from inside your project.

npm install @appvideostudio/sdk

Why an SDK for AI Agents

We built AppVideoStudio skills for Claude Code and Codex. When you install the skill in your IDE and ask it to make a video about your product, the agent doesn't just hand you a template. It runs a full production workflow: it defines a creative brief, audits your codebase for usable assets, plans scenes, picks components from our catalog, assembles a valid video document, and shows you a preview you can iterate on before exporting.

That workflow needs infrastructure. The agent needs a document format it can write to, a player it can embed to show you the result, and a test harness it can use to screenshot frames and verify the output. That's what the SDK provides.

Your Repo Already Has the Assets

This is the part that surprised us most during development. When the skill audits your project, it usually finds most of what it needs already sitting in your repo or local codebase: app icons, logos, wordmarks, screenshots, product photos, demo videos, screencasts, brand colors, and marketing copy. The assets you've been using for your README, landing page, and app store listing are exactly the assets a polished product video needs.

The agent maps these to component slots automatically. A logo becomes a brand intro. Screenshots become a feature walkthrough. An existing screencast becomes the hero footage in a device frame. Instead of asking you to go gather assets, the agent proposes a scene plan using what's already there and flags anything that's missing.

How the Skill Works

The skill follows a deliberate order of operations, and it won't skip ahead.

  1. Define the brief. What's the video for? App store preview, landing page hero, social ad, feature announcement? What's the tone, the target platform, the runtime?
  2. Audit assets. The agent offers to search your repo for logos, screenshots, videos, and brand files before asking you to provide anything manually.
  3. Plan scenes. It writes a compact production plan with a scene-by-scene outline, chosen components, and asset mappings. You review this before anything gets built.
  4. Build the first draft. The agent assembles a video document, validates it, and loads it into the player so you can see the result immediately.
  5. Iterate. You give feedback, the agent revises. Timing, colors, copy, component choices, scene order. It keeps iterating until you're happy.
  6. Export. Only after you approve the draft.

The skill picks from our full component catalog: brand intros, device frames, screenshot overlays, feature lists, testimonial quotes, stat counters, CTA banners, end cards, 3D worlds, and more. It fetches the catalog metadata to understand each component's controls, asset slots, and default parameters, then makes informed choices based on your brief.

What's in the SDK

The package has three entry points:

  • Document helpers (@appvideostudio/sdk): Create, validate, and manipulate video documents as plain JSON. A video is just a JSON object with layers, assets, and a timeline of components. Works in Node and the browser.
  • Player web component (@appvideostudio/sdk/player): The <avs-player> element embeds a live preview of any video document. Load a document, hit play, and see the result. The player also exposes a full API for managing assets, layers, and timeline components programmatically.
  • Playwright test harness (@appvideostudio/sdk/test-harness): Spin up the player in a test, seek to any frame, and take screenshots. Built for visual regression testing so agents can verify their output without a human watching the screen.

The document model is the same one used by the full editor at create.appvideostudio.com. Anything built with the SDK can be opened in the editor, and vice versa.

Why npm

Package registries are where developer tools and LLMs look first. A well-documented npm package with TypeScript types, clear entry points, and working examples is the most discoverable format we could ship. When an agent sees @appvideostudio/sdk in your dependencies, it knows exactly what's available and how to use it.

AI agents are already great at reasoning about composition, timing, and layout. What they've been missing is structured tooling that lets them reach into video creation the same way they work with code. A JSON document model, a player to preview the result, and a test harness to verify the output. That's what the SDK provides.

Open Source, Clear Boundaries

The SDK is MIT-licensed and the source is on GitHub. The editor, template source code, and server-side export pipeline remain proprietary. The SDK gives you the document format and player interface. The rendering engine lives in the hosted runtime.

Get Started

Install the SDK, add the skill to Claude Code or Codex, and ask it to make a video about your product. It'll take it from there.


Questions or feedback? Open an issue on GitHub or reach us at [email protected].