webreel

Quick Start

Install

npm install webreel

Initialize

npx webreel init

This creates a webreel.config.json:

{
  "$schema": "https://webreel.dev/schema/v1.json",
  "videos": {
    "my-video": {
      "url": "https://example.com",
      "viewport": { "width": 1080, "height": 1080 },
      "steps": [
        { "action": "pause", "ms": 500 },
        { "action": "click", "text": "Get Started" },
        { "action": "key", "key": "cmd+a" },
        { "action": "pause", "ms": 1000 }
      ]
    }
  }
}
  • url is the page to open.
  • viewport sets the video resolution.
  • steps is the list of actions to perform.

Record

npx webreel record

Output is written to videos/my-video.mp4. Set the output field to use .gif or .webm instead.

Prerequisites

Chrome and ffmpeg are auto-downloaded to ~/.webreel on first use, or you can set CHROME_PATH, CHROME_HEADLESS_PATH, and FFMPEG_PATH.

Next steps