# Introduction

URL: /docs

pro-visu turns a website into marketing assets — scroll reels, screenshots, media walls, and specimens — from a single config.

**pro-visu** — a portable CLI that turns the sites you build into marketing/showcase assets:
scroll reels, responsive screenshots, looping media walls, font/colour specimens — all from one
`pro-visu/pro-visu.config.ts`.

Install into a repo, point assets at a URL, run `pro-visu generate`. Everything lives in a
`pro-visu/` folder: the config, and gitignored output in `pro-visu/output/` (+ a `manifest.json`).

## The mental model

Three pieces:

1. **Config** — `pro-visu/pro-visu.config.ts`: `settings` (repo-level CLI behaviour) + `assets` (what to
   generate).
2. **Generators** — each asset names a `generator`. Options merge `settings.defaults["<generator>"]`
   under the asset's own `options`.
3. **Manifest** — every run writes `<outDir>/manifest.json` (id, generator, file, dimensions,
   bytes, durationMs). `pro-visu list` prints it.

Assets can depend on each other → a small DAG (e.g. a [wall](/docs/generators/wall) of tiles
produced by other assets). Deps are derived from the options, never hand-authored.

## Generators at a glance

| Generator                                       | Output                  | What it's for                                                                                     |
| ----------------------------------------------- | ----------------------- | ------------------------------------------------------------------------------------------------- |
| [`scroll-reel`](/docs/generators/scroll-reel)   | mp4 (+ gif/webp/poster) | Deterministic frame-stepped recordings — scroll reels, choreographed section pans, social formats |
| [`interaction`](/docs/generators/interaction)   | mp4                     | Scripted realtime demos with a synthetic cursor, or clips cropped to one component                |
| [`screenshots`](/docs/generators/screenshots)   | png / jpeg              | Responsive full-page and element captures per breakpoint                                          |
| [`wall`](/docs/generators/wall)                 | mp4                     | A seamless-looping media wall of your assets (and local files), each column scrolling on its own  |
| [`specimen`](/docs/generators/specimen)         | mp4                     | A looping type specimen from a font file                                                          |
| [`palette`](/docs/generators/palette)           | png                     | A still colour-palette image                                                                      |
| [`palette-reel`](/docs/generators/palette-reel) | mp4                     | A looping colour-palette reveal video                                                             |

New asset types slot in via a plugin contract — no core changes.

## Quick start

Dev-dependency (recommended — typed config, version pinned for reproducible builds):

```bash
pnpm add -D pro-visu
npx pro-visu init       # scaffold config, gitignore output, ensure a browser
npx pro-visu generate   # capture the assets
```

No install (npx/global, JSON config):

```bash
npx pro-visu init --json
npx pro-visu generate
```