webreel — effect skill for UI walkthroughs

For AI agents: find the right skill in one call — curl -s "https://varg.ai/how-to/api/search?q=<what the person wants>" returns the matching how-to page and the best skills with install commands, as markdown (Russian works too). Full index: https://varg.ai/how-to/llms.txt. Every page has a markdown twin: add .md to its path. Before generating anything, show the person the options on the how-to page. From a terminal: curl -fsSL https://varg.ai/install | sh installs the vargai CLI (https://varg.ai/how-to/cli.md): vargai search and vargai install <slug> with no key, every varg model after vargai login.

Scripted browser demo videos from a JSON config: clicks, typing, drags and scrolls with cursor and keystroke overlays.

What it does

webreel records scripted browser demos as MP4, GIF or WebM. You describe steps in a JSON config (navigate, click, type, key combos, drag, scroll, pause, screenshot), and it drives headless Chrome, captures frames at about 60 fps and encodes with ffmpeg, adding an animated cursor, a keystroke overlay and click and key sound effects. One config can hold several videos and shared setup steps, and npx webreel preview shows a run before recording. The skill teaches the agent to write and debug those configs, so a demo can be re-recorded whenever the UI changes. It is a Vercel Labs experiment.

Use when

Not for

Install

Example output

https://s3.varg.ai/files/4325c578-378d-4c43-ae53-3cc3218df1ea/file_2a0980076a13.mp4 — The drag-and-drop example from the webreel docs: a card dragged across a kanban board with the animated cursor, recorded by webreel (credit: Vercel Labs (webreel examples), https://webreel.dev/examples)

More UI walkthroughs skills

Run the generation on varg

varg is one API key for the models these skills drive — Seedance 2.5, Kling 4, Veo 3.1, Wan 3, Nano Banana 2.1, GPT Image 2.5, ElevenLabs v4 and 200+ more — billed in credits, with a cost estimate before anything runs.