About the appv1.0.3
What this tool does
Template Studio scans a black-and-white stained glass template — anything with closed line work — and identifies every glass piece automatically. You enter the finished dimensions, the tool calibrates the scale, and you can click any piece to see its exact size in inches and centimeters.
Use it to plan a project, estimate how much glass you'll need to order, or sanity-check a complicated pattern before cutting.
Delphi Edition
Plan and order with Delphi Glass
Template Studio — Delphi Edition connects assigned sheet glass and project estimates to the Delphi Glass catalog. Once the Template has finished dimensions and its pieces have assigned exact sheets, open Cart Review to review each order line.
Recommended sizes use piece fit, project area, and the default 20% planning allowance; they support ordering but do not prove a cutting layout. Resolve every assignment, size, and quantity, then choose Continue to Delphi cart to open the complete selection in Delphi’s shopping cart, where Delphi confirms current pricing and availability.
Save and share
Keep the Template or share the complete project
Choose Save to keep a named Template in this browser on this device, then use Load when you want to return to it. Browser saves are useful for your own ongoing work, but they do not move to another device and can be lost if browser data is cleared.
For a durable copy—or to share the project with a collaborator or client—choose Template ⤓ and download a .tstudio.json file. It carries the Template image, dimensions, detected pieces, assignments, imported Palette, and active glass choices; another person can use Import to open that project in Template Studio.
A shared Template file is not an order and does not sync automatically. Review current assignments, sizes, and quantities in Cart Review before continuing to Delphi.
How to use it
- Start or restore My Template. In the My Template card, use Upload or drop artwork for new SVG, PDF, PNG, JPG, or WebP line art; Load saved for a project stored in this browser; or Import .tstudio.json for a Template Studio project downloaded earlier. You can also drag new artwork onto the canvas. SVG provides exact vector pieces without detection. A PDF opens on page 1; if it has more pages, a page picker appears in My Template.
- Enter the finished dimensions. Type the finished Width and Height in inches, centimeters, or millimeters. The padlock between them keeps the aspect ratio matched to your template — leave it locked unless you have a specific reason not to (with it locked, the two stay proportional and either one scales the whole layout). Calibration is keyed to the Width; Height auto-fills from it when you load a new template.
- Click Detect pieces. The tool finds every region in the template, colors them, and auto-ignores the page background, frame margins, and any watermark text it can identify in the page margins.
- Build My Palette, assign, then review. Import a Palette file or browse Delphi sheet glass in My Palette. Select a lettered glass, choose Assign to arm it, then click template pieces. Use Deselect whenever you want piece clicks to inspect without repainting. Open Palette actions for Save, Load, Import, Clear, and Palette. Review and Export contains the order preview and order-sheet download.
Assigning glass to your pieces
After pieces are detected, use My Palette to import a .palette.json file or browse Delphi sheet glass. Template Studio imports only colors with exact sheet-glass selections; non-sheet and color-only rows are omitted. Selecting a product shows its details without changing the canvas.
- Select a glass, then choose Assign. Selection alone is safe: it opens the Active glass card without repainting anything. Choose Assign to arm that glass, then click template pieces to fill them. Choose Deselect to return piece clicks to inspection.
- Each piece is labeled and numbered. Assigned pieces show a readable chip — e.g. 12·A3 — the global piece number (1…N across the whole template, in reading order top-left → bottom-right) followed by the color label (A3 = the 3rd piece of color A). That same id appears in the Selected-piece card, the rollover tooltip, and every export, so a piece is identified the same way everywhere. Toggle the pills off any time with Show piece labels in the Display section to see the glass uncluttered.
- Choose an exact sheet. Use Catalog ↗ to open the current product in Delphi's sheet-glass catalog or replace it. If an imported color has more than one exact sheet choice, use its choices button to select which one is active.
- Track your progress. The stats read “X of Y pieces assigned” and turn green with a ✓ when every piece has glass. Use the target icon in that card to highlight every unassigned piece on the template.
- Correct detection mistakes. Select a region that is decoration, a watermark, or empty background and choose Not a piece. Its assignment is removed and the order preview updates.
For photo-based color extraction and the deepest all-form catalog matching, use Palette. For pattern-first work, build or import the palette here and stay in Template Studio.
Seeing the real glass
Template Studio shows an impression of what your panel will look like with the selected sheets.
- Real glass photos. When a glass has a catalog photo, assigned pieces are filled with the actual sheet — streaks and all — instead of a flat color. Pieces of the same glass share one sheet, so the pattern flows continuously across their seams, the way it would if you cut them from a single sheet. Turn this on or off with Show glass photos in assigned pieces in the Display section. (It's an impression of the finished look, not a color-accurate proof — backlight in a window deepens colors a photo can't capture.)
- Exact product choices. The active exact sheet drives the canvas preview and order sheet. Imported alternatives remain available from the color's choices button.
Detection controls
The guided workspace shows the settings most projects need. Start with Do the outlines look wrong? for one-click fixes when pieces merge, tiny stray regions appear, or faint lines are missed. Advanced detection values remain saved in this browser, but their controls are hidden to keep the everyday workflow focused.
Exporting your order sheet
Once you've assigned pieces and your finished dimensions are set, choose Order sheet at the top of My Palette. It opens the download options for a printable order sheet you can take to your glass supplier.
The export includes four sections: a cover summary with project name, finished dimensions, total area (raw and with breakage), and your breakage allowance; the annotated template with each piece filled in its assigned pick's color and labeled with its piece number — the global piece number plus colour label, e.g. 12·A3; per-pick details showing each piece by that same number with its size, plus the matching glasses with brand, name, SKU, hex, ΔE, and the quantity needed for that pick; and a shopping list grouped by manufacturer for easy ordering.
When you choose Order sheet, a small dialog asks for your breakage allowance — the extra glass to buy to cover cutting waste. Choose Export ↗ when the options are ready. The default is 20%, which is fine for most projects. Tighten to 10–15% if you're confident in your cuts; loosen to 25–30% for intricate work or beginners.
The export opens in a new browser tab. To save it as a PDF, use your browser's File → Print menu, then choose Save as PDF from the destination dropdown.
If a color has no specific glass chosen, the export uses the best available sheet-glass option and tags it suggested so you know it wasn't an explicit choice. To make sure the export reflects exactly the glass you want, choose the exact Delphi sheet in My Palette before exporting.
Saving and resuming work
The small buttons under the Source section manage your work between sessions.
- Clear resets the canvas — removes the template, clears detected pieces and assignments, and restores the dimension fields to defaults. The imported palette stays in the sidebar so you can start a new template with the same picks. If you have unsaved assignments, you'll be asked to confirm before they're lost.
- Save snapshots everything — template image, detected pieces, dimensions, assignments, imported palette, and active glass choices — under a name you choose, in your browser's local storage. Up to 12 saves; older saves get pushed out. These live in this browser on this device only — for backups or another device, use Download file below.
- Download file saves the whole layout (including the template image) as a portable .tstudio.json file on your device — an unlimited, permanent backup you can keep anywhere, email to yourself, or open on another computer. Import file loads one back in. This is the way to move work between devices or keep more than the 12 quick-saves.
- Load ▾ opens a dropdown of saved layouts with thumbnails. Click one to restore it exactly as you left it — no need to re-upload the template or re-run detection. Hover an entry and click the small × to delete it.
- Autosave also keeps a running snapshot of your current template, assignments, and glass choices as you work. If you close or refresh, the next time you open Template Studio a “Restore your last session?” banner offers to bring it back — Restore picks up where you left off, Not now starts fresh. It's separate from the named saves above, and Clear discards it.
If you need a layout to survive a browser-data clear or move to another device, use Download file — the .tstudio.json carries the template image and every assignment, and Import file restores it anywhere. (Re-uploading just the original PDF/PNG would lose your assignments.)
Tips
- Zoom with your trackpad pinch, mouse wheel, or the + / − buttons in the canvas toolbar.
- Pan by clicking and dragging anywhere in the canvas.
- Reset view with Fit to see the whole template, or 100% for actual size.
- Rulers along the top and left edges show your active unit. Switch units with the dropdown next to the dimensions — both fields convert automatically.
- Click an empty area to deselect the current piece, or click the same piece twice to toggle the selection off.
- Undo a mis-assignment, glass change, or ignored-region change with ⌘/Ctrl-Z — up to 30 steps.
- Overlapping pills? When two piece-number labels sit on top of each other, hover the piece to bring its pill to the front (ringed in ember) so you can read the one behind.
- Light/dark theme toggle is in the header next to Help. Your choice persists across reloads.
What gets auto-ignored
The tool tries to filter out anything that isn't a glass piece:
- Page background — the empty space surrounding your design.
- Frame margins — thin strips along the page edge.
- Watermark text in the top or bottom margins (publisher names, copyright lines, URLs).
Ignored regions show as a faint dashed outline. To see them, turn on Show ignored regions in the Display section.
Limitations & known quirks
- Embedded watermarks — text in the middle of a design (not in margins) may be detected as a region. Select it and choose Not a piece.
- Dashed lines are treated as decorative and won't form their own regions.
- Multi-page PDFs open on page 1, with a page picker in the sidebar to switch to a later page (handy when a PDF leads with a colour cover page).
- Very large templates are scaled down so processing stays responsive. Dense or faint scans can take several seconds to detect.
- Calibration needs the finished width to be accurate. If your width and height don't match the template's aspect ratio (within 5%), an amber warning appears in the Selected Piece panel.
Troubleshooting detection
Start with Do the outlines look wrong? near the top of the sidebar. Choose the problem that best matches what you see — merged pieces, tiny stray pieces, faint missed lines, or slow detection — and Template Studio adjusts the relevant saved setting and runs detection again.
- Check ignored regions. Turn on Show ignored regions in Display. Auto-ignored areas appear as faint dashed outlines.
- Remove false pieces. Select decoration, a watermark, or background that was counted as glass, then choose Not a piece.
- Improve the source if needed. A higher-resolution, higher-contrast scan or an SVG usually helps more than repeated correction when the original lines are faint or broken.
My Glass CookbookPractical planning tools for stained-glass artists.
