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

# Booth Map Designer

> Create and manage your market's interactive booth layout

## Overview

The Booth Map Designer is a drag-and-drop canvas where you create your market's layout. Place booths, add landmarks, upload a background image of your venue, and assign vendors to specific booth spaces. The finished map appears in the Digital Market Guide for shoppers.

## Accessing the Designer

Open your market's management page and click the **Booth Map** card.

<Frame caption="Market Management Page - Click the 'Booth Map' card to open the designer">
  <img src="https://mintcdn.com/seenmarkets/ni9Mp_eyW6VHysrG/images/market-management-page.png?fit=max&auto=format&n=ni9Mp_eyW6VHysrG&q=85&s=163c7b464111ec967921b0e25f4b5338" alt="Market Management Dashboard" width="2220" height="1148" data-path="images/market-management-page.png" />
</Frame>

## Creating Your Layout

When you first open the designer, you'll see an empty canvas:

<Frame caption="Empty Booth Map Designer">
  <img src="https://mintcdn.com/seenmarkets/ni9Mp_eyW6VHysrG/images/empty-booth-map.png?fit=max&auto=format&n=ni9Mp_eyW6VHysrG&q=85&s=166497a28b3589c392e48bfbc830c332" alt="Empty Booth Map Designer" width="2796" height="1262" data-path="images/empty-booth-map.png" />
</Frame>

### Upload a Background Image

Upload a floor plan, aerial photo, or venue diagram to use as a reference layer behind your booths:

1. Click the **Background** option in the designer toolbar.
2. Upload your image.
3. Position, resize, and adjust the **opacity** so booths are easy to see on top.

<Frame caption="Empty Booth Map Designer">
  <img src="https://mintcdn.com/seenmarkets/SKKYF5G7SdMUYKad/images/booth-map-designer.png?fit=max&auto=format&n=SKKYF5G7SdMUYKad&q=85&s=2ae7d85c273d345bd86f6d00ebf52871" alt="Booth Map with background, booths, and landmarks" width="2866" height="1392" data-path="images/booth-map-designer.png" />
</Frame>

This helps you match your digital layout to the real-world venue.

### Import an Existing Layout

If you've already designed a layout for a previous market:

1. Click **Import Layout**.
2. Select the market to copy from.
3. Booths, landmarks, and the background image transfer to your current market.

### Adding Booths

<Steps>
  <Step title="Create Booths">
    Click **Add Booths** to open the booth creation dialog:

    <Frame caption="Add Booths Dialog">
      <img src="https://mintcdn.com/seenmarkets/ni9Mp_eyW6VHysrG/images/add-booths.png?fit=max&auto=format&n=ni9Mp_eyW6VHysrG&q=85&s=f34cf2ea5771efe0973f3006a1fef8ba" alt="Add Booths Dialog" width="1126" height="950" data-path="images/add-booths.png" />
    </Frame>
  </Step>

  <Step title="Specify Details">
    Enter:

    * **Width** and **height** (in feet)
    * **Number of booths** to create
    * Optional: **price per booth**
  </Step>

  <Step title="Place Booths">
    Booths appear on the canvas. Drag and drop them to position. You can:

    * **Rename** each booth (e.g. "A1", "B3")
    * **Rotate** booths to match your venue
    * **Resize** individual booths
    * **Duplicate** a booth
    * **Set or change the price**
    * **Remove** a booth
  </Step>
</Steps>

### Adding Landmarks

Use landmarks to mark important locations:

1. Click **Add Landmark**.
2. Choose a type: Entrance, Exit, Bathrooms, Doors, Power outlets, Food, Parking, or Custom (your own label).
3. Place the landmark on the canvas.

### Scale

Adjust the **scale** setting (`boothPixelsPerFoot`, range 2–30) to control how booth dimensions translate to the canvas. This lets you fit your layout to the actual size of your venue.

## Assigning Vendors to Booths

Click any booth on the canvas to see management options:

<Frame caption="Booth Management Options">
  <img src="https://mintcdn.com/seenmarkets/ni9Mp_eyW6VHysrG/images/booth-assign-vendor.png?fit=max&auto=format&n=ni9Mp_eyW6VHysrG&q=85&s=b1ccf2fefd3bf41cf53a231344344df5" alt="Booth Management Options" width="362" height="518" data-path="images/booth-assign-vendor.png" />
</Frame>

* **Assign vendor** — select from your approved vendors. The vendor's name appears on the booth.
* **Rotate** — change booth orientation.
* **Remove** — delete the booth.

<Note>
  Assigned booths appear green in the designer to help you track which spaces
  are taken. This color is only visible in the designer, not in the public
  Digital Market Guide.
</Note>

You can also assign booths from the **Vendor management** table on the market page — expand a vendor row and assign a booth from there.

## Booth Pricing

Set a **price on individual booths** when you create them or by editing an existing booth. Prices are used when vendor booth self-selection is enabled (see below).

## Vendor Booth Self-Selection

Let approved vendors **pick their own booth** instead of assigning them manually:

1. On your market's management page, click **Vendor Self Assign** button in the top right.
2. Enable booth self-selection.

### How it works for vendors

* Approved vendors see the booth map and available booths.
* **Free booths:** vendor selects → confirms → booth is assigned.
* **Paid booths:** vendor selects → goes to Stripe checkout → booth is assigned after payment.
* If a vendor doesn't complete checkout within the hold time, the reservation expires and the booth becomes available again.

## Best Practices

<AccordionGroup>
  <Accordion icon="ruler" title="Layout Planning">
    * Upload a background image of your venue first so you can match the digital layout to reality.
    * Start with landmarks to establish reference points.
    * Group similar booth sizes together.
    * Leave adequate space for foot traffic.
  </Accordion>

  <Accordion icon="arrows-to-dot" title="Booth Organization">
    * Use consistent naming (A1, A2, B1, B2…) so vendors know where to go.
    * Create clear aisles and pathways.
    * Place similar vendors near each other.
    * Consider power outlet access when placing booths.
  </Accordion>

  <Accordion icon="pen-to-square" title="Design Tips">
    * Check booth dimensions match vendor needs.
    * Verify vendor assignments before publishing.
    * Review the layout from the shopper's perspective in the Digital Market Guide preview.
    * Use Import Layout to reuse your design for recurring dates.
  </Accordion>
</AccordionGroup>

## Frequently Asked Questions

<AccordionGroup>
  <Accordion icon="arrows-rotate" title="Can I modify the layout after creating it?">
    Yes. Add, remove, or move booths and landmarks at any time. Changes
    automatically update in the Digital Market Guide.
  </Accordion>

  <Accordion icon="copy" title="Can I reuse layouts?">
    Yes. Use **Import Layout** to copy from another market. If you use **Add
    another date** (duplicate market), the booth map is copied automatically.
  </Accordion>

  <Accordion icon="users" title="How do vendors see their booth?">
    Vendors see their assigned booth in the vendor portal, the mobile app, and
    the Digital Market Guide. If booth self-selection is enabled, they can pick
    their own booth from the map.
  </Accordion>

  <Accordion icon="credit-card" title="How do booth fees work?">
    Set a price on a booth. When self-selection is enabled, vendors pay via
    Stripe at checkout. You can also manually request payment from the vendor
    management table.
  </Accordion>
</AccordionGroup>

## Next Steps

<CardGroup>
  <Card title="Digital Market Guide" icon="qrcode" href="/essentials/digital-market-guide">
    Preview how shoppers will see your layout
  </Card>

  <Card title="Vendor Management" icon="users" href="/essentials/vendor-management">
    Manage vendor booth assignments
  </Card>

  <Card title="Print Shop" icon="print" href="/services/print-shop">
    Order booth number signs and market maps
  </Card>
</CardGroup>
