# Getting started

> Create a workspace, publish a prototype, share it, collect comments and connect your coding agent.

Source: https://critlab.app/docs/getting-started

This page walks through the whole loop once: sign up, publish a prototype, share it, collect comments, and let your coding agent pick them up.

## Create your workspace

Open `/signup` on your critlab instance and enter your work email. critlab has no passwords: it emails you a six-digit code, and the account is created when you enter it. Your first workspace is created with the account, and a short onboarding checklist walks you through the rest of this page.

> **Self-hosted and no email yet?**
>
> If the instance has no mail transport configured, the code is printed to the web server's log instead of sent. See [Email](/docs/self-hosting/email).

## Publish a prototype

A prototype is any static build: a folder or zip with an `index.html`, or a single `.html` file. critlab hosts the files your build produces and does not build your project, so build a React, Angular or other framework project first and publish its output folder: [What you can publish](/docs/what-you-can-publish).

- **In the browser:** choose **New prototype** and drop the file or folder onto the drop zone. The name is taken from the page's `<title>` (then `package.json`, then the first heading, then the file name); you can rename it later.
- **From the command line:** install the CLI, sign in with an API key, and publish a build directory.

```bash
npm install -g @critlab/cli
crit login --api https://critlab.example.com
crit publish ./dist
```

Publishing again to the same prototype creates a new version. Comments stay with the version they were left on, and every version shows how many threads are still open.

## Share it

Every prototype has a share link. Pick who can open it:

| Access | Who can open the link |
| --- | --- |
| Link | Anyone with the URL. No account needed. |
| Password | Anyone with the URL and the prototype's password. |
| Members | Signed-in members of your workspace only (Team and Enterprise). |

Prototypes are never indexed by search engines, whichever mode you pick.

## Collect comments

Reviewers open the link, press <kbd>C</kbd> (or the comment button), click any element and type. Each thread's first comment captures a screenshot of the viewport and a crop of the element, plus the element's selectors, text and the browser environment, so whoever fixes it sees exactly what the reviewer saw. Reviewers can also record voice notes, mention teammates with @, attach up to four images (picked, pasted or dropped onto the comment box; a visitor with the link can too) and react to comments.

Every comment has its own link. Hover a comment (or tab to it) and press the link button beside the reaction button to copy it: anyone who can open the prototype lands on that thread with the comment in the middle of the card, highlighted for a moment. The link itself carries no password and no access, so it opens only what the prototype's own access setting already lets that person see. The notification and email for a reply or a mention open the exact comment the same way.

Resolve a thread when it is fixed. Resolved threads stay on the version they belong to.

## Connect your coding agent

Create an API key in **Settings → API keys & agents**, then add critlab as an MCP server. For Claude Code:

```bash
claude mcp add critlab -e CRITLAB_TOKEN=<your key> -e CRITLAB_API=https://critlab.example.com -- npx -y @critlab/cli mcp
```

`CRITLAB_API` is your instance's address. The onboarding checklist's agent step prints this command with your key filled in, plus the equivalents for other agents. Your agent can then list open threads, pull a thread with its screenshots and selectors, publish a fixed version, and resolve the thread: that is the default `core` tool group. Everything you can do in the app is available to the agent too — folders, access, members and settings included — in the groups you choose to load (`CRITLAB_MCP_TOOLS=core,workspace`) or through the `crit` CLI: [Choose your tools](/docs/agents/tools).

When an agent publishes a prototype with more than one screen or any designed state, it writes `critlab.canvas.json` next to `index.html`, so the canvas shows every screen with the right name: [The canvas manifest](/docs/agents/canvas).

## Next steps

- Organise prototypes in folders and invite teammates or guests: [Roles and guest access](/docs/enterprise/roles).
- Running critlab yourself: start with [Architecture and trust boundaries](/docs/self-hosting/architecture).