Self-hosted · early access

Paste a URL. Get the ad.

MotionTyped turns a product website into a finished 60–95 second kinetic-typography ad. The copy comes from your own site, the cuts land on the beat, and one storyboard renders to 4:5, 9:16, 1:1 and 16:9. It runs in Docker on your machine, with your keys.

  • 15 scene types
  • 4 formats from one storyboard
  • 0 invented claims
Real output. Rendered from examples/storyboard.json for a fictional product, Acme Inbox.

One command: adforge generate https://your-product.com

Out: 4x5.mp4 9x16.mp4 1x1.mp4 16x9.mp4 storyboard.json qa_report.json

What comes out

One storyboard, four formats.

The same 20 scenes, laid out again for each platform. No voiceover: the on-screen text is the narration. Safe areas keep it clear of the Reels and TikTok interface in 9:16, and headlines shrink before they wrap and never clip.

How it works

Six stages, one run folder.

Every stage is a pure function with its own CLI entry. Everything it produces lands in runs/<id>/ as files you can open, diff and edit.

  1. 01

    Ingest

    Firecrawl or Playwright reads the site, takes 2× screenshots and pulls brand colours, font hints and the logo. Features, pain points and social proof are extracted with a source URL and a verbatim quote each.

    product.json · scrape.json · screenshots/
  2. 02

    Brand

    Site colours and logo go over the house typography and motion. Gradients are tinted to the palette; text colour is picked per scene for contrast.

    brand.json
  3. 03

    Storyboard

    Claude writes 24–28 scenes as JSON: hook, meet, feature tour, payoff, CTA. Strict schema, 48-character headlines, no scene type twice in a row. Invalid output is sent back with the exact errors, up to three times. Every cut is snapped to a beat.

    storyboard.json
  4. 04

    Assets

    Screenshots are framed into cards, the logo is normalised, avatars and illustrations come from a CC0 library, and illustrative UI content is tagged illustrative: true.

    assets/
  5. 05

    Render

    Remotion renders each scene once into a cache keyed by its content. Clips are concatenated and the music bed muxed with ffmpeg. Same storyboard, same frames, every time.

    4x5.mp4 · 9x16.mp4 · 1x1.mp4 · 16x9.mp4
  6. 06

    QA

    ffmpeg builds a contact sheet and mid-scene stills; structural checks run always, and Claude vision checks each scene against its qa_notes. A failing scene fails the run and is named.

    qa/<aspect>/qa_report.json

Why it is different

Grounded. Finished. Yours.

Grounded, not generated

Every feature and quote in the ad must appear verbatim on the page it was taken from. If it does not, it is sent back to the model and then dropped. Your brand colours and logo come from your own site.

Provenance validator in packages/ingest

Finished, not a draft

Fifteen scene types, word-by-word serif headlines, iOS-style bubbles, post cards, a cursor that clicks on action beats, a music bed, and cuts on the beat. Four aspect ratios with platform-aware safe areas.

Scene library in packages/render, limits in packages/schema

Yours to run and change

Docker on CPU, your Anthropic key or Claude Code login, output as plain MP4 plus a JSON storyboard. Change one word and only that scene re-renders. Regenerate a scene with an instruction. Compare two runs.

Per-scene cache, regenerate-scene, compare

Try the scene engine

Type a headline. Watch it render.

This is the headline scene from the library, rebuilt for the browser: the 48-character limit, auto-fit type, accent words, the grain gradient and the safe area of each format. The JSON on the right is what the renderer receives.

Background
Aspect

scene · headline


            

Scene library

Fifteen scene types, one visual system.

The storyboard model chooses a type per beat: moderation becomes an action beat, replies become a chat bubble, analytics become a typed stats block. Stills below are frames from the sample render.

  • Headline scene: 'Meet Acme Inbox' on a blue and orange gradientheadline
  • Calendar bookend scene: two date cards, Friday 24 to Monday 28calendar_bookend
  • Comment cluster scene: floating customer comment bubbles around a headlinecomment_cluster
  • Post mockup cards scene: three social post framespost_mockup_cards
  • Classification grid scene: a grid of labelled comment cardsclassification_grid
  • Chat reply scene: a customer question and a branded reply bubblechat_reply
  • Action beat scene: flagged, hidden and deleted icons under a spam commentaction_beat
  • Emoji burst scene: emoji arcing around a headlineemoji_burst
  • Glow orbs scene: three glowing channel iconsglow_orbs
  • Profile card scene: a customer card with an intent tag and factsprofile_card
  • Input bar scene: a typed question with an Ask buttoninput_bar_click
  • Stats block scene: report lines typing in on a cardstats_block_typing
  • Illustration beat scene: a flat sunset illustration over a gradientillustration_beat
  • Checklist stack scene: a stack of resolved actionschecklist_stack
  • End card scene: a Book a demo pill with a cursor and the logoend_card_cta

For developers and agents

CLI, HTTP, or an MCP tool.

One pipeline behind three doors. Run it from a terminal, queue it over HTTP, or let Claude Code call generate as a tool. A single Docker image does all of it on CPU.

  • Node 22, TypeScript, pnpm workspaces, Remotion, Hono, zod
  • Works without an API key: template storyboard and structural QA
  • Prefers your Claude Code login when there is no key
  • Self-hosted Firecrawl is vendored; Playwright is the fallback
  • Deterministic frames, tested; per-scene render cache
# full pipeline
adforge generate https://example.com \
  --brief "AI inbox for ecommerce brands" \
  --aspects 4:5,9:16

# edit copy, re-render the one scene you changed
adforge render runs/<id>/storyboard.json

# re-prompt a single scene
adforge regenerate-scene --run <id> --scene s05 \
  --instruction "lead with the pricing feature"

Questions

Before you ask.

What do I need to run it?

Docker, or Node 22 and pnpm. An Anthropic API key or a Claude Code login powers the storyboard and vision QA. Without either, the pipeline still produces a video from a deterministic template storyboard with structural QA. Rendering is CPU-only.

How long does a run take?

On a 20-core machine one 4:5 render takes about 81 seconds including bundling, and all four aspect ratios about 5 minutes. A complete run with the LLM storyboard and vision QA took 5 to 7 minutes per site in our tests. Numbers will differ on your hardware.

Does it invent features?

No. Every feature, pain point and quote must appear verbatim in the scraped text of the page it cites. Claims that fail that check go back to the model with the error, and are dropped if they still fail. Illustrative UI content (sample comments, stats) is tagged as illustrative in the storyboard.

Can I edit the result?

The storyboard is JSON with a strict schema. Change a word and re-render; only that scene is rendered again. Regenerate one scene with an instruction, re-run QA, or compare two runs scene by scene in the local web UI.

What about music, fonts and licences?

Fonts are Instrument Serif and DM Sans under the SIL Open Font License. The bundled music bed is a synthesized placeholder: supply your own licensed track and the beat mapper times the cuts to it. Rendering uses Remotion, which is free for individuals and teams of up to three and requires a company licence above that. The site you point it at owns its copy and logo; publishing the video is on you.

Which sites work?

Product and SaaS marketing sites with readable feature copy. It needs four to eight features it can quote; a single-page site with three bullet points will produce a shorter, thinner ad. In our own tests it completed full runs with vision QA on public developer-tool and SaaS sites such as cal.com, resend.com, linear.app and hono.dev. Those runs are not published; the sites own their copy.

Give your product an ad.

MotionTyped is in early access. Leave your email and the site you would run it on. We reply with a sample cut for your URL and access when your slot opens.