# Quickstart

> Connect your agent and create your first editable design.

THE DEVELOPER WORKSPACE

## One design. Every way to work.

Give your agent the same canvas, assets, and revision history you use in the studio.

Structured document Targeted edits Real output

## From a brief to a saved design

01

### Connect your agent

Sign in to the studio, create an API key, and inject it into your agent environment.

[Manage API keys](https://beta.studio.agentkit.best/?settings=agents)

02

### Choose a starting point

Inspect templates, themes, and the document schema. Use existing page and node IDs.

[Explore the CLI](https://beta.studio.agentkit.best/docs/cli)

03

### Edit, inspect, export

Make focused changes, save against the revision you read, and inspect the actual artifact.

[Understand revisions](https://beta.studio.agentkit.best/docs/revisions)

```
npm install -g https://github.com/bestagentkits/design-studio-ai/releases/download/v0.3.0/bestagentkits-design-studio-ai-0.3.0.tgz

# Inject DESIGN_STUDIO_API_KEY using your secret manager.
export DESIGN_STUDIO_URL=https://beta.studio.agentkit.best
dsa health
dsa templates list
dsa schema
dsa projects list
```

```
dsa projects create --name "Product story" --template product-deck

# Use the ID and revision returned by the server.
dsa projects get PROJECT_ID
dsa projects export PROJECT_ID --format png --revision OBSERVED_REVISION --output preview.png
```

**Bring your own provider, when you need one** Templates and direct edits do not need an AI-provider key. Text or media generation uses your configured BYOK connection and can incur provider charges. A proposal is never silently saved over your project.

[Live template & theme catalog](https://beta.studio.agentkit.best/api/catalog)[Installable agent skill](https://github.com/bestagentkits/design-studio-ai/releases/download/v0.3.0/design-studio-ai-skill.zip)[Live document, operation & interview schemas](https://beta.studio.agentkit.best/api/schema)[Create your API key](https://beta.studio.agentkit.best/?settings=agents)