# Quickstart (https://docs.fuser.studio/docs/apps/quickstart)

This walkthrough takes you from an empty canvas to a published app — one prompt
and a few clicks.

## Add an App node [#add-an-app-node]

Press  (or open the **Add a Node** menu), search for
**App**, and add it. A fresh node shows a glowing **Start an app** invitation.

![An empty App node with the "Start an app" invitation](/app-node-empty.png)

Click the node to open **focus mode** — the full-screen workspace where you'll
build.

## Describe what to build [#describe-what-to-build]

Focus mode opens with a composer and a few starter prompts above it. Type your
own idea, or click a starter to drop it in.

![Focus mode with starter prompts above the composer](/app-node-firstrun-prompts.png)

Keep the first prompt concrete but simple — you'll refine it afterward. For
example: &#x2A;"Build a minimalist Pomodoro timer with a circular progress ring,
start/pause/reset, and a clean dark UI."*

Press  (or click  **Generate**) to start the build.

> [!NOTE] Stays on Free by default
>
> The model chip reads **Free** — the default, no-credit model. Leave it as-is for your first app. See [Generation models](https://docs.fuser.studio/docs/apps/models.md) for when to switch.

## Watch it build [#watch-it-build]

The agent narrates as it works: planning, writing code, then deploying a preview.
A live transcript fills the chat panel on the left, and a  **Stop** button lets you cancel a run in
progress.

![The app building, with a live activity feed and Stop button](/app-node-generation-activity.png)

## Preview and refine [#preview-and-refine]

When the build finishes, your app renders live in the preview. Try it out.

![A finished app rendered in focus mode beside the chat transcript](/app-node-focus-finished.png)

To change anything, describe it in the composer — &#x2A;"make the accent color
teal"&#x2A;, &#x2A;"add a long-break mode"* — and the agent applies it. You can also
[edit content, styles, and code directly](https://docs.fuser.studio/docs/apps/editing.md).

## Publish [#publish]

When you're happy, click  **Publish**. Your app is promoted to a public URL that anyone with the
link can open — no login required. The status pill flips to **Live**, and a share
panel hands you the link and a QR code.

![A published app showing the Live status and share panel](/app-node-published-live.png)

That's the whole loop. Everything else in this section goes deeper on each step.

## What's next [#whats-next]

  - [Building with the agent](https://docs.fuser.studio/docs/apps/building.md): Prompts, crafting, generation activity, and one-click error fixes.

  - [Editing your app](https://docs.fuser.studio/docs/apps/editing.md): Direct edits to content, design, media, and code.

  - [Publishing & versions](https://docs.fuser.studio/docs/apps/publishing.md): Version history, rollback, and what publishing actually does.

  - [Sharing & your audience](https://docs.fuser.studio/docs/apps/sharing.md): Links, QR codes, discovery, and access control.