Inspiration

Nowadays, everyone can build and ship software in a weekend. With modern AI coding tools, writing code is no longer the bottleneck. The real bottleneck is distribution.

Once you launch a new web app, static screenshots and walls of text just don't convert. People want to see the product in action before they sign up. Sure, there are modern screen recording tools out there today, but they make your computer lag, spin up fans, and still require you to be "the director." You still have to rehearse the flow, manually click around, record retakes when your cursor wobbles or you make a typo, edit pauses, add subtitles, and figure out Google Video schema. It takes hours or days and drags down your shipping momentum.

When you're racing against the clock to get an MVP out the door, like for a hackathon submission like this one I almost forgot about or a quick weekend launch, you don't have hours to spend directing a screencast. You just need a high-converting demo fast. I would

So I built DemoDominator. For myself, and for all my fellow builders. What if you could just paste a live URL, and an autonomous AI agent in the cloud acts as your director, voice actor, camera operator, and SEO specialist in one go; generating a studio-grade product walkthrough in under 25 seconds with zero local overhead? Yeah, the future is here.

What it does

DemoDominator takes any live web application or URL and turns it into a complete video demo and distribution package in about 20 to 25 seconds:

  1. DOM Discovery: It launches a headless browser, crawls the page, and identifies the main interactive buttons, inputs, and navigation elements.
  2. 3-Act Scripting: Gemini 3.7 Flash analyzes the app and writes a narrative script structured into Hook, Core Feature, and CTA.
  3. Voiceover & Kinetic Directing: It synthesizes a voiceover, calculates exact millisecond durations, and directs a smooth cursor across the browser to click and scroll in sync with the audio.
  4. Video Assembly: It records the 30 FPS walkthrough and burns in subtitles for silent social feeds.
  5. 6-Pillar Video SEO Package: Beyond the video, it outputs Google VideoObject JSON-LD schema with key moments, a lightweight dwell-time embed widget, an XML video sitemap, and ready-to-post copy for Twitter and LinkedIn.

How me, Antigravity & Gemini 3.7 Flash built it (real fast!)

  • Reasoning Core: Google Gemini 3.7 Flash handles the DOM analysis, narrative storyboard planning, and structured JSON-LD schema generation with strict Pydantic schemas.
  • Directing Engine: Node.js with Puppeteer and the Chrome DevTools Protocol (CDP) to smoothly control the browser, simulate realistic cursor physics, and capture frames.
  • Audio Synthesis: Google Cloud Text-to-Speech and ElevenLabs to generate voiceover tracks with precise duration measurements.
  • Video & Media Pipeline: FFmpeg with custom filtergraphs to multiplex audio, video, and burned-in subtitles, as well as generate 3:2 looping GIF previews.
  • Backend & Serverless Infrastructure: Python and FastAPI deployed on Google Cloud Run in us-central1 with automatic zero-idle scaling.

Challenges I ran into

  • Syncing actions to audio duration: In normal video editing, you cut or stretch video to match voiceover. Here, the agent has to measure the speech duration first, then calibrate cursor speeds, bezier easing curves, and hover dwell times so the click happens exactly when the voice mentions that feature.
  • DOM noise on complex apps: Modern web apps are packed with nested wrapper divs, tracking pixels, and hidden elements. Getting the crawler to reliably identify the primary interactive elements without getting confused took a lot of prompt engineering and selector filtering.
  • FFmpeg in serverless containers: Compiling multi-layer video streams, subtitle styling, and custom GIF palettes inside a Cloud Run container without running out of memory or slowing down execution required careful tuning.

What makes me proud

  • The speed: Going from a raw URL to a full 30 FPS video walkthrough with audio, subtitles, and structured Google schema in under 25 seconds is wild to watch in real time.
  • Honest proof of concept: While this is still an early prototype and far from polished on complex dynamic SPAs, the speed of what it creates is unseen and very telling for what the future of software marketing will look like.
  • Full-stack distribution toolkit: It does not just stop at giving you a video file. It generates the exact schema, sitemaps, and embed codes founders need to actually get indexed by Google.

What I learned

  • Gemini 3.7 Flash is remarkably capable of understanding visual UI context and value propositions from raw DOM trees and turning them into clean marketing copy (and it does so fast!).
  • Combining headless browser protocols with audio timestamping makes autonomous video directing completely viable.
  • Building tools is easy today, but tools that solve the distribution problem are what founders actually need most.

DemoDominator's bright future

  • Multi-page flows & authenticated sessions: Allowing founders to pass test credentials so the agent can demo features behind a login or show full checkout flows.
  • Interactive timeline editor: Giving creators a quick slider UI to tweak a line of script or re-record a single scene without having to redo the entire walkthrough.
  • Direct 1-click publishing: Automatically pushing the generated video, captions, and schema directly to YouTube and social platforms via API.

Built With

  • chrome-devtools-protocol
  • docker
  • elevenlabs
  • fastapi
  • ffmpeg
  • gemini-3.7-flash
  • google-antigravity
  • google-cloud
  • google-cloud-run
  • google-cloud-tts
  • html5-video
  • javascript
  • json-ld
  • node.js
  • playwright
  • puppeteer
  • pydantic
  • python
  • rest-api
  • schema-org
  • server-sent-events
  • tailwindcss
  • uvicorn
  • video-seo
  • webvtt
Share this project:

Updates

Submission history