Record screen workflows and generate SKILL.md files via LLM analysis.
- Node.js 20+
- Python 3.10+ (for PII redaction sidecar)
- Tesseract OCR (optional, for text detection in screenshots)
# Install Node dependencies
npm install
# Start development
npm run devcd sidecar
python3 -m venv .venv
source .venv/bin/activate
pip install -e ".[dev]"
# or use the helper script:
# ../scripts/dev-sidecar.sh| Command | Description |
|---|---|
npm run dev |
Start Electron app in development mode |
npm run build |
Build all processes (main, preload, renderer) |
npm run typecheck |
Run TypeScript type checking |
npm test |
Run unit tests with Vitest |
npm run test:e2e |
Run E2E tests with Playwright |
npm run pack |
Package app (unpacked) |
npm run dist |
Build distributable |
vid2skill/
├── src/
│ ├── main/ # Electron main process
│ │ ├── index.ts # App entry, window creation
│ │ ├── ipc-handlers.ts # IPC channel handlers
│ │ ├── recorder/ # Screen capture & recording
│ │ ├── processing/ # Frame extraction, dedup, compression
│ │ ├── redaction/ # PII detection sidecar integration
│ │ ├── llm/ # LLM provider abstraction
│ │ ├── skill/ # SKILL.md generation & validation
│ │ └── storage/ # Settings, keychain, temp files
│ ├── preload/ # Context bridge (typed IPC)
│ ├── renderer/ # React UI
│ │ └── src/
│ │ ├── components/ # Wizard steps & shared components
│ │ ├── hooks/ # useRecorder, useRedaction, useLLM
│ │ └── store/ # Zustand session store
│ └── shared/ # Types shared across processes
├── sidecar/ # Python FastAPI (PII redaction)
├── tests/ # Unit & E2E tests
└── scripts/ # Dev & build helper scripts
- Electron 34 + electron-vite 5 (Vite 6)
- React 19 + TypeScript 5.7
- Tailwind CSS v4
- Zustand 5 (state management)
- ffmpeg-static + fluent-ffmpeg (video processing)
- OpenAI / Anthropic / Google LLM SDKs
- Python FastAPI + Presidio + Tesseract (PII redaction)
- Vitest 3 (unit tests), Playwright (E2E)
MIT