WRAPTORHelp & Docs

WrapStudio Design — vector wrap design, from concept to cut file

Who it's for

Designers live here: it is a full vector design application in the browser, purpose-built for wrap production. Owners and managers use it to keep design in-house instead of paying for Illustrator seats and template subscriptions, and to move a design straight onto the job's quote and proof without exporting anything.

Where it fits

WrapStudio Design opens from the Studio hub → the design app (/studio/design). It sits between winning the job and printing it: design the wrap, get the customer's sign-off through the proof link, price the material on the quote, then hand production the print PDF and cut files. See workflow-map.md.

Overview

The design app is a layered vector editor working at true physical scale — a van-side artboard knows it is 220 real inches wide (drawn at 1:10), so every export, panel, and quote line is dimensionally honest. Everything a wrap design needs lives in one surface: drawing tools, typography with warps, print-grade export, panelization, AI generation, and the job loop.

Screens & navigation

  • The canvas — artboards with rulers, guides, snap lines, zoom/pan. Multiple artboards per design (vehicle views: sides, rear, hood).
  • Toolbar — Select, Distort, Rectangle/Ellipse/Line/Polygon, Text, Pen, Pencil, Node editor, Eyedropper, Scissors, Measure.
  • Left panel — Layers list and the Brand kit (fonts).
  • Right panel — properties for the selection: paints, strokes, typography, effects, transforms, Pathfinder, panels.
  • Top bar — design name, AI, Find & replace, History (versions), Export, undo/redo, zoom.

Capabilities

Drawing & editing

  • Pen tool with bezier handles; Pencil freehand (auto-smoothed); node editing (corner/smooth, broken handles); Scissors to cut paths open; Simplify; Round corners; Offset path; Outline stroke.
  • Pathfinder: Unite, Minus, Intersect, Exclude, plus Divide (split into faces — per-color plot pieces), Minus Back, and Crop. Make/Release compound path for donut shapes.
  • Flip horizontal/vertical, numeric Scale with fit-to-artboard, Step & repeat grids (sticker sheets), align/distribute with key-object alignment, isolation mode for groups, clipping masks and opacity masks.

Typography

  • 14 curated font families plus your uploaded brand fonts; per-word styled spans; letter spacing, baseline shift, justify.
  • Warps: Arc, Wave, Flag, Rise (the truck-lettering looks) and text on a path.
  • Area text: fixed frames with vertical alignment and an overflow badge. Convert to outlines for cut work.

Color & paints

  • Solid, linear/radial gradients (edit stops on-canvas), pattern fills with an AI seamless-pattern generator, ~165 real 3M 2080 and Avery SW900 film swatches, named spot colors that export as separations, document swatches.
  • Eyedropper copies styles between layers or samples a pixel color from any photo.

Production output

  • Print PDF — vector output with true CutContour spot separations (RIPs auto-detect), vector gradients, named spots, per-side bleed, trim/bleed boxes, auto-scale for oversize boards.
  • Panelization — auto-split to your media roll width with draggable seams, overlap bands, a labeled install map page, per-panel print pages at panel-local resolution, and lap lines printed exactly where the neighboring panel's edge lands.
  • Cut files — SVG and EPS with the CutContour custom color, per-panel when panelized.
  • Production pack — one ZIP: print PDF, panels PDF, cut files, preview, README.
  • Preflight — automatic checks before export: image resolution at print size, open cut paths, missing bleed, panels over media, raster fallbacks.
  • Also: PNG at chosen PPI, TIFF, editable SVG, a client Proof PDF (one labeled page per artboard), and Fleet series (a {N} token becomes numbered unit pages).

AI

  • Full design composer — describe the design and get an editable layered layout (shapes, gradients, real text), never a flat image.
  • Prompt-to-vector generation with auto-trace; trace any photo/logo to editable paths; whole-design AI recolor (cut lines never change); AI restyle and background removal on image layers, in place; photorealistic photo mockups on the customer's own vehicle.
  • Start from vehicle photo — a straight-on side shot becomes a locked, scale-calibrated design template. No template subscription required.

The job loop

  • Link a design to a job, then from the export dialog: attach renders to the job's files, create a proof (the customer approval link is copied for you), and add a quote line priced from the design's square footage. Material deducts from inventory rolls. Version history with restore.

Step-by-step tasks

  1. Design a van side from the customer's photo

    1. New design → Start from vehicle photo → upload a straight-on side shot.
    2. Artboard settings → Calibrate scale → click both ends of the wheelbase, type its real inches.
    3. Design over the locked photo; use film swatches and brand fonts.
    4. Export → Photo mockup to show the customer; Create proof for sign-off.

  2. Take a design to production

    1. Select the art → Create cut line from selection (one united CutContour path).
    2. Artboard settings → Panels → media width + overlap → Auto-panelize; drag seams if needed.
    3. Export → check Preflight, then Production pack (ZIP).

  3. Let AI draft the layout

    1. AI button → check Full design → brief it like a client ("plumbing company, FLOW PROS, 555-0100, navy + lime, bold").
    2. The layout lands as editable layers — recolor, re-warp, rearrange, then export as usual.

Limits worth knowing

Pattern fills, opacity masks, drop shadows, and brand-font text print via high-resolution raster inside the PDF (everything else stays vector). Spanned text edits in the inspector rather than on-canvas. EPS files can't be imported directly — use the .ai or .pdf from the same template download.