explaingit

new-xp/ultrademo

Analysis updated 2026-05-18

15JavaScriptAudience · developerComplexity · 3/5Setup · moderate

TLDR

Ultrademo is a Claude Code skill that turns a web app into a narrated demo video, running the capture and rendering locally.

Mindmap

mindmap
  root((Ultrademo))
    What it does
      Scripts a demo
      Captures with Playwright
      Renders with Remotion
    Tech stack
      JavaScript
      Playwright
      Remotion
    Use cases
      Generate demo video
      Make README GIF
      Export editor stems
    Audience
      Developers

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Generate a narrated demo video of a web app automatically through an AI coding agent

USE CASE 2

Produce a GIF, vertical video, or editor-ready stems from one captured demo

USE CASE 3

Re-render a demo video after editing a single narration line, without recapturing footage

What is it built with?

JavaScriptPlaywrightRemotionNode.js

How does it compare?

new-xp/ultrademoadindazu/fextractoranonymousraid/osint-mapping-tool
Stars151515
LanguageJavaScriptJavaScriptJavaScript
Setup difficultymoderatehardeasy
Complexity3/51/52/5
Audiencedevelopergeneralresearcher

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · moderate Time to first run · 30min

Needs Node.js, ffmpeg, and Playwright's Chromium browser installed.

No license information is stated in the README excerpt.

In plain English

Ultrademo is a tool that turns a web app into a narrated demo video automatically, driven by an AI coding assistant like Claude Code. Everything, including the browser automation, the video rendering, and any credentials used to log into your app, runs on the user's own machine rather than being sent to a hosted service. The way it works is that a person describes what they want demoed, and the AI agent drafts a script for the video, which the user reviews and approves. That script becomes a flow file that drives Playwright, a browser automation tool, through the actual web app, capturing screenshots, real screen recording clips, and cursor movement into a structured file called a storyboard. Text to speech then narrates each line, using ElevenLabs for higher quality voices if an API key is provided, falling back to a free offline tool called Piper, or a basic built in voice on Mac as a last resort. Finally, a video rendering tool called Remotion combines all of this into a finished video with zoom effects, a simulated mouse cursor, and captions. The main output is a finished 16 by 9 video file with narration and captions baked in, but the same captured storyboard can also be rendered again as a vertical video for phone sized screens, a short animated GIF suitable for a README file, or as separate editing files, meaning a clean video, a narration audio file, and a subtitle file, for someone who wants to do further editing themselves in a video editor. The recommended way to install it is as a skill for an AI coding agent, using a command line installer that lets the user pick which agent they use, since choosing the wrong option can cause the skill to install somewhere the agent does not actually look. Once installed, opening the target project in the agent and asking for a demo video causes the tool to set up its own workspace automatically, including installing dependencies and a headless browser, before it starts drafting a script. The project requires a recent version of Node.js and the ffmpeg video tool to be installed as well.

Copy-paste prompts

Prompt 1
Help me install the ultrademo skill for Claude Code and generate a demo video of my app
Prompt 2
Walk me through writing a flow file so Playwright can capture a custom demo scene
Prompt 3
Explain how ultrademo turns a storyboard into a vertical or GIF version of a demo video

Frequently asked questions

What is ultrademo?

Ultrademo is a Claude Code skill that turns a web app into a narrated demo video, running the capture and rendering locally.

What language is ultrademo written in?

Mainly JavaScript. The stack also includes JavaScript, Playwright, Remotion.

What license does ultrademo use?

No license information is stated in the README excerpt.

How hard is ultrademo to set up?

Setup difficulty is rated moderate, with roughly 30min to a first successful run.

Who is ultrademo for?

Mainly developer.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.