# Vitrus Website Harness

Vitrus Website Harness gives a coding agent the context, design guidance, and checks to build distinctive websites. It includes a static site compiler, a template library, media tools, and an optional Cloudflare backend for leads, analytics, and owner administration. Each website lives in its own repository.

The package is [`@tryvitris/website-harness`](https://www.npmjs.com/package/@tryvitris/website-harness). Bring your own coding agent and Node.js 24 or newer. Generation normally ends with a verified local preview; Cloudflare launch is a separate, explicit step.

## Create a website

An optional separate business admin is available through `vitris admin setup|status|verify`; new-site `--admin` prepares follow-up instructions. See the [admin integration guide](docs/ADMIN.md) for pinned packages, local plan/apply, backend grants and the separate customer-account Cloudflare rollout.

This checkout targets the published admin runtime and contracts at exact version **1.0.0**. Earlier website-harness releases may retain older pins until a reviewed upgrade. Admin 1.0 includes lead follow-up, interface/color improvements, account lifecycle and optional operational modules; installing it does not update a deployed website backend or activate live booking, email or payments.

```bash
npx --package @tryvitris/website-harness@1.4.0 vitris site create \
  --dir acme --slug acme --name "Acme Shop" \
  --from https://old-site.example --template "Still & Field" \
  --content-file ./acme-notes.md
cd acme
npm install
npx playwright install chromium
```

Replace the example values with your own. Use `--blank` instead of `--from` for a new site. `--template` accepts a catalog ID, name, or hosted preview URL; `--content` accepts supplied text directly. Both are optional. See the [CLI guide](docs/CLI.md) for input and media policies.

Open the **site directory** in your coding agent and ask it to build the site. It follows the site's `AGENTS.md` and the prepare → `agent/CURRENT.md` → work → complete loop until the local preview is ready. To start or resume manually, use `npm run go`; for a later change, use `npm run go -- --change "Describe the change"`.

To browse templates from a harness checkout, run `npm ci`, then `npm run templates:gallery` and open <http://127.0.0.1:4390/>. The gallery loads the hosted catalog. See the [template library guide](agent/refs/template-library.md) for creating and publishing templates.

## Built-in skills

After creation, new sites also include the discoverable `vitris-site-manager` skill and `SITE-MANAGER.md` operational handbook. `vitris manage prepare --site SITE` refreshes the site context and recurring review brief; production publication refreshes the handoff automatically. Reviews cover live health, analytics, harness updates, compatibility, anomalies and consistency with the accepted site design. Findings and fixes stay local for review; connect the owner's cadence and timezone through the agent's actual scheduler to activate recurring reviews. See the [site manager workflow](agent/refs/site-manager.md).

The harness loads stage-specific instructions from [`agent/refs/`](agent/refs/) automatically. These are not installed agent slash commands: describe the work to your agent, and the workflow selects the relevant guidance. The creative workflow also has the following named skills; their prerequisites are included when needed.

| Skill | What it does |
| --- | --- |
| `business-positioning` | Ground the offer and distinguishing value in business evidence. |
| `narrative` | Organize the visitor journey, questions, and supporting proof. |
| `visual-research` | Adapt useful principles from visual references. |
| `art-direction` | Turn the central idea into a coherent visual direction. |
| `typography` | Establish readable, expressive type hierarchy. |
| `composition` | Shape page layout, rhythm, and visual priority. |
| `media-direction` | Select authentic imagery and identify media gaps. |
| `copy-layout` | Develop page copy and layout together. |
| `purposeful-interaction` | Choose interactions that help visitors act or decide. |
| `responsive-design` | Preserve hierarchy and usable controls across screen sizes. |
| `visual-critique` | Identify consequential visual weaknesses in rendered pages. |
| `visitor-journey` | Test whether visitors can complete intended tasks. |
| `motion-direction` | Plan useful movement and quiet intervals. |
| `motion-page` | Compose motion across each page's journey. |
| `motion-statistics` | Present supplied numbers accessibly, with motion where useful. |
| `motion-phrases` | Pace text without hiding essential copy. |
| `motion-choreography` | Coordinate imagery, captions, and process accents. |

For example, ask your agent to “improve the mobile layout,” “review the visitor journey,” or “adapt this template to the business.” The workflow includes additional guidance for template adaptation, copy, accessibility, SEO, browser checks, and launch. See the [workflow guide](agent/WORKFLOW.md) and [creative skill registry](src/agent/creative-skills.ts).

## Develop the harness

Customer sites build and verify locally, then upload the exact finished bundle directly to Cloudflare Pages. Use `npm run deploy:preview` for a hosted preview and `npm run deploy` for explicitly requested production publication. GitHub stores source; hosted deployment automation is opt-in. See [Cloudflare setup](docs/CLOUDFLARE.md) for new sites and migration of existing sites.

```bash
npm ci
npx playwright install chromium
npm run typecheck
npm test
npm run verify:package
```

For a local checkout, run `npm run build:cli` and create a sibling site with `--harness file:../vitris-harness`. See [distribution](docs/DISTRIBUTION.md) for package and upgrade details, and [official testing](docs/OFFICIAL-TEST.md) for frozen baselines.

## More information

- [Active-agent quickstart](docs/QUICKSTART.md) and [workflow guide](agent/WORKFLOW.md)
- [Cloudflare setup](docs/CLOUDFLARE.md), [contact forms](docs/CONTACT-FORMS.md), and [credential safety](docs/SECURITY.md)
- [Stock and customer media](docs/STOCK-MEDIA.md) and [icon guide](agent/refs/icons.md)
- [Evaluation protocol](agent/EVALUATION.md) and [CLI reference](docs/CLI.md)

MIT licensed. Hosted demonstrations and third-party media have their own license records; see [NOTICE](NOTICE).

Optional standard customer booking: see [scheduling](docs/SCHEDULING.md) for the source-only test booking component, compatible admin API, and paired local preview.


## Daily package maintenance

The 1.5.0 candidate integrates `vitris manage updates` into the existing daily care run. It checks actual website and identity-bound separate-admin dependencies against complete stable public releases, then provides pinned preparation/testing plans. It reuses the current scheduler and care lease, preserves authored configuration and follows existing publication permissions. See [package maintenance](agent/refs/package-updates.md).
