ClipYourSaaS

Overview

ClipYourSaaS turns a live web app into a narrated product demo video. An AI browser agent explores the customer’s app, writes and voices a script, records the walkthrough, and renders landscape, square and vertical cuts for docs and social media. It is a self-serve SaaS with a public API and an MCP server, so AI assistants can request demos directly. The customer signs in to a demo account inside a secure browser, and only an encrypted session is kept, never the password.

The hard part is not the video. It is running an autonomous browser against arbitrary third-party sites safely, keeping per-video cost low enough for usage-based pricing, and keeping a multi-stage pipeline reliable in production.

My Role

I founded ClipYourSaaS and own it end to end: architecture, security model, billing, deployment and production operations. I built it by directing AI coding agents through design, implementation and adversarial review, while I made the architecture, tradeoff and production decisions myself. Every change goes through a spec, a plan, an implementation and an independent review gate.

Architecture

A TypeScript monorepo with a Next.js 16 app and Postgres. A pg-boss job queue distributes work across a pool of workers. Each video moves through these stages:

• Browser agent: a Playwright agent drives sandboxed Chromium through the customer’s app.
• Scripting: an LLM writes the narration script from what the agent saw.
• Narration: ElevenLabs voices the script.
• Rendering: Remotion renders the final cuts.
• QA gate: an automated check re-films scenes when the narration and the screen disagree.

Workers and browsers run as separate containers on a self-hosted Docker and Dokploy farm.

Key Engineering Decisions

• Benchmark before choosing a model. I built a model-benchmark harness, judged output quality blind, and moved production to the winning model and tuning profile. The decision rests on measured quality and cost, not preference.
• Deliver landscape first, render the rest asynchronously. Customers get a usable video sooner, and the square and vertical cuts no longer block the first result.
• Automated QA gate with re-filming. Narration and on-screen action can drift apart in an agent-driven recording. The gate detects mismatches and re-films the affected scenes instead of shipping them.
• Isolate the browser from everything with value. The agent runs untrusted customer sites, so the browser lives in its own pool of locked-down, secret-free containers, separate from the workers (details below).
• Idempotent billing that tolerates out-of-order events. Stripe webhooks can arrive late, twice, or out of sequence, so processing is idempotent and order-tolerant, backed by a daily reconciliation job.
• Staged rollouts with one-setting rollback. Changes reach production in stages, and rolling one back is a single setting.

Reliability & Security

The system runs untrusted customer sites in a headless browser, so isolation is layered:

• Sandboxed Chromium runs in a pool of locked-down containers with no secrets, a custom seccomp profile and all privileges dropped.
• Each container serves one session for its lifetime, so no state carries between customers.
• Outbound traffic goes through an SSRF-safe proxy.
• The worker-to-browser link is HMAC-authenticated.
• View-only and limited-write modes are enforced inside the browser, not just in the agent’s instructions.
• Prompt-injection guardrails and output moderation cover the LLM stages.

Billing is usage-based: prepaid credit packs plus monthly subscriptions with a rollover cap and prorated upgrades. It includes refund and dispute handling and referral rewards. I closed an upgrade-arbitrage exploit before launch.

Operationally, I traced a production out-of-memory failure to the renderer’s frame cache sizing itself from host memory, and resized the worker containers as part of the time-to-video work.

Results

• AI cost per video down ~77%, from $0.67 to $0.155.
• Time-to-video cut roughly in half, from ~7m40s to ~3m40s.
• ~1,900 automated tests plus a 156-case end-to-end suite.
• Live in production with a public API, an MCP server, and a free tier of 3 videos with no card required.