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

# Flows and frames

> Organize screens into labeled frames so you can keep multiple flows tidy and compare them.

A flow is a user journey, and on the canvas each flow lives inside a **frame**. Frames keep multiple flows organized in one project and make side-by-side comparison easy.

## Why frames

When you capture a URL, the resulting screens are grouped into a frame. If you [compare multiple URLs](/capture/compare-urls), each one gets its own frame, so you can line up products and compare them at a glance.

<CardGroup cols={2}>
  <Card title="Stay organized" icon="object-group">
    Keep several flows in one project without them getting tangled.
  </Card>

  <Card title="Compare side by side" icon="layer-group">
    Place frames next to each other for benchmarking.
  </Card>
</CardGroup>

## Working with frames

* **Start a new flow**: use the new flow tool in the [toolbar](/canvas/tools), or the shortcut next to your existing flows.
* **Move screens between frames**: drag a screen from one frame to another to reorganize.
* **Add to a frame**: drop an uploaded image inside a frame to add it to that flow. See [Add screens manually](/capture/add-screens).
* **Label**: frames are labeled so you can tell flows apart at a glance.

## Build comparisons

The most common pattern for benchmarking:

<Steps>
  <Step title="Capture or add your first flow">
    Start with one product or journey in its own frame.
  </Step>

  <Step title="Add more flows">
    Capture additional URLs, start a new flow, or import more screens. Each becomes its own frame.
  </Step>

  <Step title="Arrange for comparison">
    Position frames next to each other and zoom out to see the whole picture.
  </Step>

  <Step title="Annotate and analyze">
    Add [comments](/collaborate/comments) and ask [Flow chat](/ai/flow-chat) to compare.
  </Step>
</Steps>

<Tip>
  Use the frame options menu (or [slash commands](/ai/slash-commands)) to group by page type or URL, apply a layout, or capture screenshots for every screen in the frame.
</Tip>