Record a Website Demo Video from a URL with AI

Turn a URL into a Product Demo

Paste a link, describe the clicks, review the edit. Creating an account and uploading are free. Editing requires a subscription.

Watch a Real Capture

Recorded September 9, 2026 from a four-step script on Valmera’s public docs: wait, click the Captions link in the sidebar, scroll, hold. The pointer glides to the link, the Captions page opens and scrolls. This is the raw capture before any editing: 1920×1080, 30 fps, 10.8 seconds, silent.

Open the watch page · See it edited into a finished demo · Download the capture · Requests and event data (JSON)

What You Can Script

Describe the walkthrough in chat and the agent writes the script; MCP clients pass the same step objects to record_website_demo. Add seconds to any step to hold longer after it. Keep it to 4–10 steps that tell one story: a demo that clicks everything shows nothing.

For a simple product-page pan, record_website opens the page, holds the top, smooth-scrolls to the bottom and holds: 4 to 30 seconds (12 by default), no clicks. It makes good b-roll for a promo.

The Event Track: Why the Zooms Land on the Button

Alongside the video, the recorder returns an event track: every click, scroll, keystroke run and page change, timed against the video, with clicks positioned as fractions of the frame. This is what the capture above returned:

showcase_demo reads that track to cut the capture like a product video. It pushes in a beat before each click, travels between clicks that come close together, and eases out after the last one; a page change starts a new move, so the new page is seen whole first. Zoom strength defaults to 0.4 because screen text needs a real push to read. Click sounds are opt-in: each click gets a click, each page change a soft pop and each scroll a swipe, timed to the track.

Finish the Demo

• Frame it: a floating window with rounded corners and a soft shadow on a solid or gradient background.
• Label it: title cards between scenes and on-screen text over the action (“Step 1: connect your store”).
• Narrate it: upload your voiceover and ask for the music to sit low underneath it.
• Score it: your own track, uploaded or linked, or a specific song you name.
• Pace it: trim the start or end of the capture, or play it faster (up to 4×).
• Go vertical: record the same steps in portrait for a 9:16 cut; the page reflows to a 1080×1920 window instead of shrinking into it.

The recorder draws its own crisp pointer, a white arrow with a dark outline, so a capture needs no cursor fix. For screen recordings you make yourself, the screen recording editor makes the cursor bigger and steadier with enhance_cursor.

Tip: Target the Visible Element

A click goes to the first element that matches its label or selector. On Valmera’s docs, the first link named Captions sits in a hidden mobile menu, so the first two attempts recorded the page and reported the click as skipped. Scoping the selector to the visible sidebar fixed it. If the recorder reports a skipped step, re-run it with a sharper selector.

Download the first attempt to see a skipped click for yourself.

{
  "project_id": "YOUR_PROJECT_ID",
  "url": "https://valmera.io/docs/getting-started",
  "orientation": "landscape",
  "steps": [
    {
      "do": "wait",
      "seconds": 1.5
    },
    {
      "do": "click",
      "selector": ".docs-sidebar a[href='/docs/captions']",
      "seconds": 2
    },
    {
      "do": "scroll",
      "by": 350,
      "seconds": 2
    },
    {
      "do": "wait",
      "seconds": 1.5
    }
  ]
}

Limits

• Public pages only. The recorder doesn’t inherit your login and won’t type into password or payment fields. For a signed-in app, record your screen with demo data and upload it to the screen recording editor.
• Captures are silent. Sound comes from your voiceover, music and sound effects.
• The output is an MP4 video. There is no interactive HTML demo export.
• No direct publishing to YouTube, TikTok or LinkedIn. Download the MP4 and post it.

Part of a Product Demo Workflow

A website capture is often one scene in a longer launch video. See the SaaS demo guide for the full story arc, zoom effects for punch-ins on a talking head, and add a voiceover for narration and ducking.

Using Claude, ChatGPT or Cursor? The same record_website_demo, record_website and showcase_demo tools are available through Valmera’s MCP server.

Frequently Asked Questions

Made with Valmera: real exports

Record Your Website Demo

Paste a URL, describe the steps, review the edit, export an MP4. Creating an account and uploading are free. Editing requires a subscription.