<aside> 💬

This is an SOP to create email campaigns that my “SOP Master” Claude project outputted from 4 simple Loom transcripts

</aside>

Email Campaign SOP: Design to Send

This SOP covers the full process of producing and sending a branded email campaign for the [CLIENT] store. It runs across four stages: orienting to the Figma design system, designing the email in Figma, optimizing images for email, and configuring and sending the campaign in MailChimp. A campaign with a pre-approved brief and no major revision rounds takes 3 to 5 hours from start to send. Add time if the design goes through multiple review rounds or if images need significant resizing.

Stage 1: Figma Design System Orientation

Loom embed — Figma Design System Orientation

If you have already worked in the [CLIENT] Figma file, skim this stage. If this is your first time, read it fully before starting Stage 2. Everything here applies directly to how emails are built.

The design system has four brands: [CLIENT], [CLIENT], [BRAND], and [BRAND]. Components always default to [CLIENT] styling. You change a component's look by applying a variable mode to the section it sits inside. The component inherits the section's brand automatically.

• [ ] Open the [CLIENT] Figma file and navigate to the Design System page.
• [ ] Click Assets in the top-left panel to browse available components.
• [ ] Search for the component you need (e.g., "button," "bubble," "widget") and click Insert Instance. It will appear with [CLIENT] styling by default. Done: the component is on the canvas.
• [ ] Create a frame or section to contain components for a given brand.
• [ ] With the section selected, open the right panel and click Apply Variable Mode. Apply all three:
  • [ ] Under Color States, select the target brand.
  • [ ] Under Type Scale, select the target brand.
  • [ ] Under Rounding, select the target brand. ([CLIENT] and [CLIENT] share the same rounding, so this one may not change.)
• [ ] Move the component into the branded section. Done: the component visually reflects the target brand's colors, fonts, and rounding.

Decision: [BRAND] styles are not fully mapped in this Figma file. If you are designing for [BRAND], contact [PERSON] at [REDACTED EMAIL]@[REDACTED DOMAIN] before continuing.

Stage 2: Email Design in Figma

Loom embed — Email Design in Figma