Visual email template builder
A Stripo / Beefree / Mailchimp-style designer cockpit for the Mufflermen workshop. The block palette, drop canvas, style inspector, and preview controls compose the build surface; preheader, footer, spam check, HTML output, theme picker, saved templates and the click heatmap fill out the operational rails. No real send pipeline — these primitives design emails, they don't ship them.
Visual email template builder is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.
Visual email template builder: A Stripo / Beefree / Mailchimp-style designer cockpit for the Mufflermen workshop. The block palette, drop canvas, style inspector, and preview controls compose the build surface; preheader, footer, spam check, HTML output, theme picker, saved templates and the click heatmap fill out the operational rails. No real send pipeline — these primitives design emails, they don't ship them.
Email canvas
Centre 600px column with drop zones between rows and an inbox-style chrome header.
Block library palette
Left rail of drag-from blocks — heading, image, button, columns, social row, footer, HTML, token.
Style inspector pane
Right inspector — colour, font, padding + margin sliders, and alignment chip row.
Mobile preview toggle
Device chips for mobile + desktop, scale toggle, and a dark-mode preview switch.
Inline image upload
Drop zone or library picker with alt-text input, link target, and a retina @2x toggle.
Personalisation token picker
Searchable list of {{first_name}}, {{vehicle.rego}}, {{quote.total}}, {{workshop.bay}} with sample preview.
Send test email card
Multi-recipient input, A/B/C variant chips, and a send CTA with sent-status indicator.
Preheader editor
Subject + preheader inputs with character counters and live spam-trigger chips.
Footer assembler
Address, unsubscribe label, legal-link chips, and a social row toggle with live preview.
Spam score check
0–10 deliverability gauge tone-shifted, plus a warnings list with ignore + restore controls.
HTML output viewer
Tabbed source — HTML, inlined CSS, plain text — rendered via the CodeBlock primitive.
Email theme picker
Six pre-built themes — Workshop Dark / Heritage Cream / Cinematic / Newsletter / Receipt / Minimal.
Saved template list
Sortable data table — thumb, name, last-edited, send count, open/duplicate/archive actions.
Click heat map
Tone-coded hotspots over the preview canvas, with a daily-clicks calendar in the side rail.
Full email builder scene
Palette + canvas + inspector, preview toggle, preheader, send test, theme picker, saved list, spam check, HTML output, heatmap, image upload, token picker, footer.