> Create your first LiveDemo in four steps: install the Chrome extension, capture a workflow, edit it and share or embed it.

Canonical: https://livedemo.ai/docs/getting-started/quickstart/

# Quick Start

Your first LiveDemo in about 5 minutes. You need Google Chrome and a free [LiveDemo account](https://app.livedemo.ai/register).

## 1. Install the Chrome extension

1. Open the [LiveDemo Chrome extension](https://chrome.google.com/webstore/detail/livedemo-app/dnlnaeifccbhdnbppjjgleapjadjklbe) page.
2. Click **Add to Chrome**, then **Add extension**.
3. Pin it from Chrome's puzzle icon so it's one click away.

Designing in Figma? Use the [Figma plugin](https://livedemo.ai/docs/getting-started/install-figma-plugin/) instead.

## 2. Capture a workflow

1. Open the web app you want to demo (any `http://` or `https://` page).
2. Open the LiveDemo extension, enter a **Name** and pick **Screenshots + Video Recording**.
3. Click **Start recording** and click through the workflow, slowly. Every click becomes a step.
4. Stop the recording from the extension. Your demo opens in the editor.

More options: [How to capture a LiveDemo](https://livedemo.ai/docs/capture-a-livedemo/how-to-capture-a-livedemo/).

## 3. Edit it

In the editor:

- Rewrite the text of each step so it says *why* the click matters, not just *where* to click. See [Steps](https://livedemo.ai/docs/edit-a-livedemo/steps/).
- Add an intro [popup](https://livedemo.ai/docs/edit-a-livedemo/popup/) as the first step.
- End with a [call-to-action popup](https://livedemo.ai/docs/edit-a-livedemo/popup/#buttons), such as "Book a demo".
- Set your colors and logo in **Custom → Theme**. See [Design](https://livedemo.ai/docs/edit-a-livedemo/design/).

Changes save automatically.

## 4. Share it

1. Click **Share** and turn on **Public access**.
2. Click **Copy link** to send it, or open **Share → Embed** and copy the **Website** code to put it on your site.

See [Share your public LiveDemo](https://livedemo.ai/docs/share/share-your-public-livedemo/) and [Embed on website](https://livedemo.ai/docs/share/embed-on-website/).

## What's next

- Watch how viewers use it in [Analytics](https://livedemo.ai/docs/capture-a-livedemo/analytics/).
- Pick a recipe for your goal in [Use cases](https://livedemo.ai/docs/getting-started/what-can-i-use-livedemo-for/).
- Let an [AI Demo Agent](https://livedemo.ai/docs/ai-demo-agent/create-an-ai-demo-agent/) give the demo for you (Growth plan).

Stuck? See [Troubleshooting](https://livedemo.ai/docs/resources/troubleshooting/).

---

Next: [Use cases](https://livedemo.ai/docs/getting-started/what-can-i-use-livedemo-for/)