How to design, publish, and sell your seating chart

Step 1

Draw the room

Open the designer, or practice in the live demo above. The canvas starts with a sample layout you can edit or clear. Add tables with the three buttons above the canvas, then drag them where they belong.

• Round table and long table seat guests around the edge; row of seats is for theater-style seating.
• Click a table to select it. The panel beside the canvas edits its label, seat count, and price tier.
• Add a grid lays out rows and columns of identical tables in one step, already lined up. On a phone this is the easiest way to build a room.
• Tables snap to the grid as you drag, and a dashed guide appears when one lines up with a neighbor's row or column, so rooms stay tidy without fuss.
• Select several tables at once by dragging a box over them or shift-clicking, then drag the whole group together.
• Rotate a selected table with the R key or the rotation stepper in the panel.
• Everything autosaves in your browser as you work, and undo (Ctrl+Z) walks back your last hundred changes.
• Import and Export in the toolbar save and load a design as a JSON file; dropping a file onto the canvas imports it too.
• Photo to chart reads a photo of your real floor plan and builds the tables for you; you then adjust seats and prices. It appears when the server has photo conversion set up.

Step 2

Price the seats

Price tiers live in the panel next to the canvas. Make as many as you need, in the spirit of Standard, Premium, and VIP, each with its own price and color. Assign any table to a tier and the seats inherit its price. The room summary at the bottom of the panel keeps a running total of what the room is worth if every seat sells.

Step 3

Publish it

Publishing needs a free account, so your charts and orders have somewhere to live, and a verified email address if the server sends mail. Press Publish & preview in the designer and you get a booking link like seat-layer.com/book?chart=chart-xxxxx. Republishing the same chart updates it in place; seats already sold stay sold.

Step 4

Share the booking link

Send that link to your guests, put it in the invitation, post it anywhere. Guests who open it see your room exactly as you drew it: they tap a table, pick their exact seats, and pay. The plan works with a mouse, a finger, or a keyboard, and it updates live: when a seat is taken it grays out for everyone else, and two guests can never buy the same seat.

You can watch sales land on your account page: every published chart lists its orders, references, and totals as they come in.

Step 5

Get paid

Out of the box the checkout runs in demo mode: seats reserve and orders record, but no money moves. Connect Stripe, PayPal, or Square on the server and the same checkout takes real cards; guests get a plain-text email confirmation with their seats and reference. Prices are always recomputed on the server from your published chart, so nobody can tamper with a total in their browser.

Extra

Put the seat picker on your own website

If you have your own site, you can embed the live seat picker instead of sending guests away. Two lines of script:

<div id="seats"></div>
<script src="https://seat-layer.com/seatlayer-sdk.js"></script>
<script>SeatLayer.mount("#seats", { chartId: "chart-xxxxx" });</script>

The server operator has to allow your site's address first (the PARTERRE_ALLOWED_ORIGINS setting). The full reference, including theming and events, is in the SDK documentation in the repository's sdk/ folder.