JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 567
  • Score
    100M100P100Q103867F
  • License MIT

Record narrated tutorials via the Vorec Recorder macOS app — CLI for AI coding agents

Package Exports

    This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@vorec/cli) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

    Readme

    @vorec/cli

    Turn any web app into a narrated tutorial video. Record your screen, track user actions, and let AI generate professional voice-over narration automatically.

    What It Does

    • Records your web app in 1080p using Playwright
    • Tracks every click, keystroke, and navigation with precise coordinates
    • Converts to MP4 and uploads to Vorec
    • AI analyzes the video and writes natural narration
    • Generates voice-over audio in multiple languages and styles
    • Returns an editor URL to preview, adjust, and export

    Quick Start

    npx @vorec/cli@latest init
npx @vorec/cli@latest run vorec.json --auto

    Requirements

    • Node.js 18+
    • Playwright — npm install playwright && npx playwright install chromium
    • FFmpeg — brew install ffmpeg (macOS) or apt install ffmpeg (Linux)
    • Vorec API key — create one at vorec.ai → Settings → API Keys

    Manifest Format

    Create a vorec.json file describing the actions to record:

    {
  "title": "How to create a project",
  "url": "http://localhost:3000/dashboard",
  "viewport": { "width": 1920, "height": 1080 },
  "language": "en",
  "narrationStyle": "tutorial",
  "actions": [
    { "type": "click", "selector": "button.new-project", "description": "Open the create dialog" },
    { "type": "type", "selector": "#name", "text": "My Project", "description": "Enter the project name" },
    { "type": "click", "selector": "button[type=submit]", "description": "Save the project" }
  ]
}

    Commands

    Command What it does
    vorec init Save your API key
    vorec run <manifest> Record, upload, and generate narrated tutorial
    vorec run <manifest> --skip-record --video <file> Use existing video instead of recording
    vorec upload <video> Upload a video file directly
    vorec status Check project status

    Narration Styles

    Style Tone
    tutorial Step-by-step, clear, helpful
    professional Polished, enterprise-ready
    conversational Casual, like explaining to a colleague
    storytelling Engaging, narrative-driven
    concise Minimal, just the essentials
    exact Neutral, factual, technical

    Claude Code Plugin

    For the best experience, install the Vorec plugin for Claude Code. Your AI agent will research the codebase, generate the manifest, and run the CLI automatically.

    1. In Claude Code, run /plugin
2. Go to Marketplaces → Add Marketplace
3. Enter: MustaphaSteph/vorec-plugins
4. Select record-tutorial and install it
5. Enable auto-update

    Then just say: "record a tutorial showing how to create a project"