> ## Documentation Index
> Fetch the complete documentation index at: https://vlyai-1c28d863.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Describing your app

> The structure of a good first prompt. The five-layer method, applied to project initialization, with worked examples.

export const PromptBlock = ({children, variant}) => <div className={`vly-prompt ${variant || ""}`}>{children}</div>;

The first prompt of a new project is the most important one — it sets the schema, the auth model, the page structure, and the overall shape. Get it close, and the next 50 prompts go fast. Get it wrong, and you'll fight the foundation for hours.

## The four things to include

<Steps>
  <Step title="What it is" icon="target">
    A user-facing one-line summary. "A team task tracker." Not "an internal tool with multiple roles and complex permissions."
  </Step>

  <Step title="Who uses it" icon="users">
    Roles and how they differ. "Admins invite members; members create tasks; everyone sees their team's tasks."
  </Step>

  <Step title="What it stores" icon="database">
    The nouns. Names matter. "Users have a team. Teams have tasks. Tasks have a title, due date, priority, and assignee."
  </Step>

  <Step title="What's special" icon="sparkles">
    Anything not obvious. "Real-time", "needs to scale to 10k users", "must work offline", "uses Stripe Connect."
  </Step>
</Steps>

## Worked examples

<PromptBlock>
  **A team task tracker.**

  Users sign up (email or Google) and create or join a team using a short invite code. Everyone on the team sees the team's tasks; nobody sees other teams' tasks.

  Tasks have: title, optional due date, priority (low / medium / high), and an assignee (someone on the team). Anyone on the team can create, edit, or delete tasks.

  The home page shows the team's tasks grouped by status (open / done). Mark tasks done with a checkbox.

  Real-time: when someone else on the team adds or edits a task, I see it without refreshing.
</PromptBlock>

This prompt nails all four things. Plan mode produces a clean foundation in seconds.

<PromptBlock>
  **A marketplace for selling vintage cameras.**

  Sellers list cameras for sale. Buyers browse, filter by camera brand, year, and price range, and click "Buy" to purchase via Stripe.

  Sellers earn 90% of each sale; the platform takes 10%. Use Stripe Connect for seller payouts.

  Buyers and sellers are both signed-up users; sellers complete Stripe Connect onboarding to start selling.

  The marketplace homepage shows recent listings. Each listing has photos (multiple), title, description, price, brand, year, and seller info.
</PromptBlock>

Same structure: what, who, data, what's special (Stripe Connect).

## When to use Plan mode for the first prompt

**Always.** The first prompt is where misreads are most expensive. Plan mode catches them before any code is written. See [Plan mode](/building/plan-mode).

## What to leave out

<CardGroup cols={2}>
  <Card title="❌ Implementation details" icon="x-circle">
    "Use TanStack Query for caching." vly already has the right patterns; let it pick.
  </Card>

  <Card title="❌ Color schemes and exact spacing" icon="x-circle">
    "Use #6D28D9 violet on the buttons." Defer this to a later prompt; first prompt is about structure.
  </Card>

  <Card title="❌ Edge cases up front" icon="x-circle">
    "What if the same user tries to invite themselves twice?" Worry about it later. Get the happy path right first.
  </Card>

  <Card title="❌ Optimization" icon="x-circle">
    "Pre-fetch the next page of results." Iterate on this once you have a working app.
  </Card>
</CardGroup>

## Common shapes worth knowing

<Tabs>
  <Tab title="CRUD app">
    "A list of \{things}. Each \{thing} has \{fields}. Users can create, edit, delete. Filter by \{field}."
  </Tab>

  <Tab title="Multi-tenant SaaS">
    "Multi-tenant. Users belong to workspaces. Workspaces have \{entities}. Roles: owner / admin / member."
  </Tab>

  <Tab title="Marketplace">
    "Two-sided. Sellers list \{items}. Buyers browse and purchase via Stripe. \{fee structure}."
  </Tab>

  <Tab title="Chat / collaboration">
    "Real-time chat. Channels with members; messages with reactions and replies; presence."
  </Tab>

  <Tab title="Dashboard">
    "Dashboard for \{metric type}. Filter by \{dimensions}. Charts: \{types}. Updates in real time as data arrives."
  </Tab>
</Tabs>

For full prompts of each shape, see the [Cookbook](/recipes/overview).

## Related

<CardGroup cols={3}>
  <Card title="Five-layer method" icon="layers" href="/prompting/the-five-layer-method">
    The framework, applied beyond first prompts.
  </Card>

  <Card title="Prompt library" icon="library" href="/prompting/prompt-library">
    30+ tested templates.
  </Card>

  <Card title="Plan mode" icon="workflow" href="/building/plan-mode">
    Always use it for first prompts.
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.