> ## Documentation Index
> Fetch the complete documentation index at: https://docs.vibely.sh/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Quick start

> Sign in, type one prompt, get a working app at a live URL — in five minutes.

Vibely is browser-only. No install, no local setup, no env vars to wrangle. The fastest path from "I want to build X" to "X is live at a URL someone else can open" is below.

<Steps>
  <Step title="Sign in">
    Go to [vibely.sh](https://vibely.sh) and pick a sign-in provider — Google, SSO, or email. You'll land in your personal workspace with a starter project ready to clone.
  </Step>

  <Step title="Pick what you're building">
    On the new-project screen, pick the surface that matches your idea. You can switch later.

    <CardGroup cols={3}>
      <Card title="Web app" icon="browser" href="/docs/web-app/overview">
        SaaS, dashboards, CRUD, marketing sites. The default.
      </Card>

      <Card title="Mobile app" icon="mobile-screen" href="/docs/mobile-app/overview">
        iOS + Android from one codebase. Ship to the stores.
      </Card>

      <Card title="Design" icon="palette" href="/docs/design/overview">
        Visualize first, make real with one click. Slides, animations too.
      </Card>
    </CardGroup>
  </Step>

  <Step title="Describe what you want, concretely">
    The more specific your first prompt, the better the first turn. Name the user, the data, and a feel.

    > *"A CRM for solo consultants — contacts, deals with three stages, daily activity feed. Use Supabase auth (email + Google). Calm, professional, lots of whitespace."*

    See [Art of Prompting](/docs/introduction/prompting-best-practices) for the patterns that consistently produce clean first turns.
  </Step>

  <Step title="Answer 3–4 clarifying questions">
    Before writing any code, Vibely asks 3–4 short follow-up questions to pin down the niche, audience, primary user flow, and visual tone. Answer them honestly — even one-line answers dramatically raise the quality of the first turn and help the agent tailor the build to your exact use case instead of a generic template.
  </Step>

  <Step title="Watch it appear">
    Within \~10 seconds of your answers, a live preview URL opens in the right pane. The agent writes files; the preview hot-reloads as each one lands. By the time the agent stops, you have a working app you can click around.
  </Step>

  <Step title="Iterate">
    Keep prompting. Each turn touches only what needs to change — no rebuild from scratch.

    * *"Add a kanban view to deals."*
    * *"Make the sidebar collapsible on mobile."*
    * *"When a deal moves to Won, post to Slack `#wins`."*

    Click any element in the preview to edit it inline ("make this button orange"). For big changes, ask for a plan first: *"plan multi-tenancy before writing code."*
  </Step>

  <Step title="Publish">
    Project menu → **Publish**. You'll get a stable `<your-slug>.vibelyagent.com` URL in seconds. Add a custom domain in two minutes when you're ready. See [Publish](/docs/web-app/publish) for access controls, version rollback, and GitHub export.
  </Step>
</Steps>

## What a good first session looks like

After one focused session (45–60 minutes), most people have:

* A working web app at a `vibelyagent.com` URL
* Auth, a database, and at least one real feature wired
* The first design iteration past "default look" — something that feels like *your* taste
* Project memory pinned with the decisions worth remembering

## If your first attempt looks generic

That's almost always a prompt problem, not a Vibely problem. Two quick fixes:

1. **Restart the prompt with a named user.** "An ops dashboard for a fulfilment team that ships from three warehouses" is night-and-day better than "an ops dashboard."
2. **Name three brand anchors.** "Like Linear meets Notion meets Duolingo" gives the agent a specific aesthetic to aim at.

Both [Art of Prompting](/docs/introduction/prompting-best-practices) and [Tips → Prompting](/docs/tips/prompting) go deeper.

## Next

<CardGroup cols={2}>
  <Card title="Your first week" icon="calendar-days" href="/docs/introduction/your-first-week">
    A one-thing-per-day arc from sign-up to shipping.
  </Card>

  <Card title="Customize Vibely" icon="sliders" href="/docs/customize/overview">
    Five-minute setup that pays back every future session.
  </Card>

  <Card title="Art of Prompting" icon="wand-magic-sparkles" href="/docs/introduction/prompting-best-practices">
    Patterns that produce production-grade output on turn one.
  </Card>

  <Card title="Plans and credits" icon="credit-card" href="/docs/introduction/plans-credits">
    What you'll pay for, and how to keep an eye on usage.
  </Card>
</CardGroup>
