Design Studio

The Design Studio: an AI-native creative editor

The Design Studio is Mass's visual editor for everything that needs to look designed — ad creative, social graphics, thumbnails, and full video sales letters. It pairs a real layered canvas with an AI panel and a chat assistant, stays on-brand through brand kits, and round-trips with the funnel builder so creative never lives in a silo.

18 min read · The complete Design Studio guide

What the Design Studio is

A multi-page, layer-based canvas with AI built into every panel — not a separate plugin.

Under the hood the Design Studio is a true design canvas: each document holds one or more pages (artboards), and every page is a stack of layers — image, text, and shape — you can move, transform, group, and restyle. It behaves like the design tools you already know (drag, snap, align, zoom, pan), but with generation, editing, resizing, and voiceover wired directly into the workspace.

Because it's part of Mass, the Studio shares your brand kit and your offer context, so a graphic you make here already knows your colors, fonts, and product. And because assets carry a source reference back to where they came from, a banner you generated for a funnel can be opened, refined, and pushed straight back — no exporting and re-uploading.

  • Pages & layersmulti-artboard documents with image, text, and shape layers; group, reorder, lock, and restyle anything on the canvas.
  • Precision editingdrag-and-transform with smart guides and snapping, zoom/pan, an inspector for exact values, and keyboard shortcuts throughout.
  • AI everywherean AI panel and a chat assistant sit beside the canvas for generation, editing, layout, resizing, and voiceover.
  • Connectedbrand kits keep it on-brand, and source references let assets round-trip with the funnel builder, emails, and hubs.

One canvas, many outputs

The same editor produces a single ad image, a multi-page carousel, a set of resized variants for every platform, and a fully narrated VSL — all from the same layers and brand.

Image editing & the canvas

Everything you expect from a layer editor — layers, text, shapes, transforms, filters, and crop.

Build a composition by stacking layers. Image layers hold photos, uploads, or AI-generated art; text layers carry rich type with presets, gradients, and effects; shape layers add rectangles, ellipses, and lines for backgrounds, frames, and accents. Select any layer to move, scale, rotate, or restyle it, with smart guides snapping it into alignment as you drag.

Cropping and transforming are handled on-canvas: resize from the handles, crop an image to a region, and apply image filters for tone and color. The inspector gives you exact position, size, rotation, opacity, and style values when you need pixel precision rather than eyeballing it.

  • Layer typesimage, text, and shape layers, each with its own inspector controls and styling.
  • Transform & cropmove, scale, rotate, and crop from on-canvas handles; nudge and align with smart guides and snapping.
  • Type systemtext presets, font controls, gradients, and effects for headline-grade typography.
  • Filters & fillsimage filters plus solid, gradient, and image backgrounds per page.
  • Uploads & assetsbring in your own images, browse photo and icon panels, and drop elements straight onto the canvas.

Resizing & cropping

Reformat a design for every channel in one move — Magic Resize, social presets, and bulk resize.

Designing one asset and needing it in ten sizes is the most common creative chore, so the Studio automates it. Magic Resize takes a page and re-fits it to a new artboard size, scaling and repositioning layers to fit the new aspect ratio instead of stretching them. Pick from built-in social presets (story, square, portrait, landscape, and the common ad sizes) or enter custom dimensions.

When you need the whole project reformatted at once, bulk resize runs every page through the same re-fit and reports a per-page fit score so you can spot the few that need a manual tweak. Cropping handles the inverse — trimming an image down to the region that matters for a given placement.

  • Magic Resizere-fit a page to a new size; layers scale and reposition to the new aspect ratio rather than distorting.
  • Social presetsone-click targets for stories, square, portrait, landscape, and standard ad formats.
  • Bulk resizereformat every page in a project at once, with a fit score flagging pages that need review.
  • Croptrim images to the exact region a placement needs without leaving the canvas.

AI image generation & editing

Generate, edit, extend, and clean up imagery without leaving the canvas.

The AI panel turns the canvas into a generation surface. Describe what you want and it produces an image you can drop straight onto the page; select an existing image and it can edit it from a prompt, paint a mask to change only part of it, extend it beyond its original frame, or spin up a grid of variations to choose from. Utility actions handle the unglamorous-but-essential work — remove a background, upscale for print or retina, and auto-write alt text for accessibility and SEO.

You can also work at the composition level: snapshot the active page and ask for AI variations of the whole design, turn a prompt into a ready-to-edit template, or generate template variations to explore directions fast. Every AI action is credit-aware and rate-limited, so you always know what an operation costs before you run it.

  • Generatecreate new images from a text prompt and place them directly on the canvas.
  • Edit & inpaintprompt-edit an image, or brush a mask to regenerate just the masked region.
  • Variationsproduce a grid of alternatives for an image or a full page snapshot, then add the winners as pages.
  • Outpaintextend an image beyond its original borders to fill a larger or different aspect ratio.
  • Background removalstrip a subject from its background in a click for clean cut-outs and product shots.
  • Upscale & alt textincrease resolution for crisp output, and auto-generate descriptive alt text.
  • Prompt → templateturn a prompt into an editable, layered template — and generate variations of it.

On-brand by default

AI generation can pull from your brand kit so colors and fonts match your identity — the same context that keeps the rest of your funnel congruent applies to the imagery, too.

The AI design assistant

Describe the change in plain language and let the assistant apply it.

Alongside the panel actions, a chat assistant lets you drive the design conversationally — describe how you'd like a layout or page changed and it works on it for you, so you don't have to hunt for the right control. For targeted tweaks, inline edit applies a small, surgical change to a selected element rather than regenerating the whole composition.

This is the same philosophy as the rest of the platform: AI isn't a separate mode you switch into, it's a faster way to do what the manual tools already do — and you can always drop back to the canvas to fine-tune by hand.

  • Conversational editingtell the assistant what to change and it updates the design, narrating what it did.
  • Inline editsapply a precise, surgical change to one selected element without touching the rest.
  • Hand-off both waysstart with AI and finish by hand, or design manually and ask AI for the finishing pass.

Script → VSL: video sales letters

Paste a sales script and get a finished, narrated video sales letter built page by page.

The Studio's standout AI flow turns a written script into a complete VSL. Paste your script (optionally with a creative brief), and the system splits it into beats, then for each beat generates a background image, narrates the line with text-to-speech in a voice you choose, and aligns the audio word-by-word so the on-screen captions animate in sync with the voiceover.

Each beat becomes a page in your document — background image plus a kinetic caption bound to the voiceover — and the whole batch drops in as a single undo entry at your canvas's current dimensions, so it slots in cleanly. From there it's just a design: restyle captions, swap a background, re-record a line, or reorder beats like any other multi-page project.

  • Script splittingan LLM breaks your script into the right number of beats based on length (or a count you set).
  • Per-beat generationeach beat gets a background image and a TTS voiceover, produced in parallel.
  • Word-synced captionsaudio is aligned word-by-word so kinetic captions animate in time with the narration.
  • Editable outputevery beat is a normal page — restyle, swap, re-record, and reorder after generation.

Voiceover & motion

Narration, word-level timing, and kinetic captions bring static pages to life.

Voiceover isn't limited to the VSL flow — you can generate narration for any page from a catalog of voices, and the editor stores the audio with word-level timings. Text layers can be bound to that voiceover so each word highlights or animates exactly when it's spoken, the effect that makes short-form captions feel alive.

Beyond captions, layers can carry entrance and emphasis animations from a preset library, and a present mode plays the document through page by page. It's enough motion to ship scroll-stopping social video without opening a separate video editor — though the full video editor is there when you need timeline-level control.

  • Voice cataloggenerate narration for any page in a choice of voices and TTS quality levels.
  • Word syncbind captions to the voiceover so text animates word-by-word in time with the audio.
  • Animation presetsapply entrance and emphasis animations to layers from a preset library.
  • Present modeplay the document through page by page to preview the finished motion.

Brand kits, smart objects & context

Lock in your identity once, then reuse it everywhere — and keep every variant in sync.

Brand kits hold your palette and fonts so every new design starts on-brand instead of blank. Smart objects (instances) take that further: define a master layer or component once, place instances of it across pages, and override per-instance details (the headline, the photo) while structure and styling stay linked — change the master and every instance updates.

Fields turn a design into a template you can fill programmatically: mark the parts that change (name, price, headline, image) and the same artwork can be rendered hundreds of times with different values. That's what powers data-driven creative — and the design SDK exposes it as a render API so an external system can request a finished image by passing values.

  • Brand kitsstore palette and fonts so every design and AI generation starts on-brand.
  • Smart objects / instancesreuse a master across pages with per-instance overrides that stay linked to the original.
  • Fields & templatesmark the parts that change, then render the same design at scale with different values.
  • Render SDK & bulk renderproduce many finished images at once, or call the render API from outside the app.

Collaboration & versioning

Design with your team in the same document, with history and sharing built in.

The Studio is multiplayer: live presence shows teammates' cursors and avatars on the canvas, and comments let you leave feedback pinned to the artwork. Version history keeps a trail of changes so you can review or roll back, and auto-save means you're never one crash away from losing work.

When a design is ready, share it for review, send it onward, or publish it where it's needed — including straight into a learning hub — without exporting and re-uploading by hand.

  • Live presencesee teammates' cursors and avatars as they work in the same document.
  • Commentspin feedback to the canvas so review happens in context.
  • Version history & autosavereview and roll back changes; work is saved continuously.
  • Share & publishshare for review, send onward, or publish directly — including to a hub.

How it connects to the funnel builder & checklist

Creative isn't a silo — it round-trips with funnels, emails, campaigns, and your launch checklist.

When Mass builds a funnel, an image-generation pass produces the visuals each section needs. Any of those images — and assets from emails, course emails, and campaign steps — can be opened in the Design Studio for a proper edit: the asset carries a source reference, so when you're done you push it back with Sync to Funnel and the funnel updates in place. No download, no re-upload, no broken links.

That makes the Studio the creative step of your launch. As you work the Fast Launch checklist, the system generates the funnel and ad creative; the Studio is where you refine that creative, resize it for every ad platform, and produce the VSL — then sync everything back so the live funnel always reflects your latest design.

  • Edit in Design Studioopen a funnel, email, or campaign asset in the Studio with one click — it remembers where it came from.
  • Sync to Funnelpush edited pages back to the originating funnel (pick which pages) so it updates in place.
  • Funnel image passthe funnel build generates section imagery the Studio can then refine and replace.
  • Checklist creativethe Studio is where launch-checklist ad creative and VSLs get polished and reformatted before go-live.

One brand, end to end

Because the Studio, the funnel builder, and the Context Engine share the same brand and offer facts, the creative you refine here stays congruent with the copy on the page and the message in the ads.

Exporting & delivering

Get finished assets out — one at a time, in bulk, or via API.

Export a page as an image when you just need the file, run a bulk render to produce a whole set at once (every page, or every value-set of a template), or drive the design SDK's render endpoint to generate finished images from outside the app. Combined with fields and brand kits, that turns one design into a production line for on-brand creative.

  • Single exportdownload any page as an image for immediate use.
  • Bulk renderproduce many images in one pass — ideal for variant sets and data-driven creative.
  • Render APIrequest finished images programmatically by passing values to the design SDK.