Get Started

First Steps Checklist — Ecommerce

A bold, dark ecommerce onboarding email with a blob-hero layout (amber halo + sparkle on dark gradient), four checklist cards, and an amber pill CTA.

Welcome & Onboarding ecommercedarkboldonboardingherocta

Updated Jul 10, 2026

The prompt

Paste the brief below into ChatGPT or Claude with Temway's MCP enabled — the agent builds the email step by step. Or adapt it for your own brand and copy.

  • An email is a top-to-bottom stack of blocks — the recipe follows that order.
  • A [layout] step becomes a single image (great for heroes); everything else stays live text and links.
  • Theme the footer to match — the recipe's last step does exactly that.

Want this exact email? Tell your agent to clone the Temway share TH7c3Z3Yz1I9YL0YKbDpP, then rebrand it. For the full model, point it at get_concept — email-structure, layouts-vs-emails, design-recipes.

The onboarding email that turns a new store owner’s first session into a game. A bold dark blob-hero glows amber up top, then four numbered checklist steps walk them from logo to first sale, closing on a bright amber pill button. Energetic, modern, and satisfying to knock out.

Snapshot

  • Goal: get a new store owner through the four setup steps that make their store sell-ready.
  • Audience & tone: new ecommerce store owners. Bold, gamified, modern — “here’s your checklist, knock these out, you’re ready to sell.” Energetic but practical.
  • Palette: page #0f172a · container #0f172a (edge-to-edge dark) · text #f1f5f9 / #94a3b8 (muted) · accent amber #f59e0b
  • Font: "Trebuchet MS", sans-serif
  • Artwork: one blob-hero layout hero (a single rasterized image). Everything below it is native, selectable, clickable.

Build recipe

Each step is one block in the flat stack, top to bottom. [native] = a real email block. [layout] = a free-form layout embedded as a single image.

  1. [layout] Blob hero — apply the blob-hero layout template; recolor the band to a dark gradient (#1e293b → #0f172a) with an amber #f59e0b halo glow and a gold sparkle accent. Overlay copy: eyebrow “YOUR STARTER CHECKLIST”, heading “Let’s get you started” (white, subtle text shadow). Text-only artwork — the working CTA is the native button in the last content step.
  2. [native] Intro copy — text. “Welcome to Shopwave! You’re four quick steps away from your first sale. Knock these out and your store is ready to go live.” fontSize: 16, color #cbd5e1, center, line-height: 1.6.
  3. [native] Step 1 — text. “1. Add your logo and brand colors” fontSize: 16, fontWeight: 700, color #f1f5f9, left, amber #f59e0b lead number.
  4. [native] Step 1 detail — text. “Make your store unmistakably yours in under a minute.” fontSize: 14, color #94a3b8, left, tight top padding.
  5. [native] Divider — hairline #1e293b, generous vertical padding. This replaces the “card” separation — the flat model stacks and divides, it does not box.
  6. [native] Step 2 — text. “2. Add your first 3 products” fontSize: 16, fontWeight: 700, color #f1f5f9, left, amber lead number.
  7. [native] Step 2 detail — text. “Photos, price, description — three is enough to launch.” fontSize: 14, color #94a3b8, left, tight top padding.
  8. [native] Divider — hairline #1e293b, generous vertical padding.
  9. [native] Step 3 — text. “3. Connect your payment method” fontSize: 16, fontWeight: 700, color #f1f5f9, left, amber lead number.
  10. [native] Step 3 detail — text. “So you can actually get paid when the orders roll in.” fontSize: 14, color #94a3b8, left, tight top padding.
  11. [native] Divider — hairline #1e293b, generous vertical padding.
  12. [native] Step 4 — text. “4. Set up shipping zones” fontSize: 16, fontWeight: 700, color #f1f5f9, left, amber lead number.
  13. [native] Step 4 detail — text. “Tell us where you ship and what it costs.” fontSize: 14, color #94a3b8, left, tight top padding.
  14. [native] CTA button — button. Label “Complete your profile”, amber #f59e0b fill, dark #0f172a text, pill (fully rounded) corners, center.
  15. [native] Footer — social + address, recolored to the palette: social.color = #64748b, address.color = #475569, address.fontFamily = "Trebuchet MS", sans-serif. Without this they fall back to a generic brand-blue that clashes with the dark/amber scheme.

Make it yours

  1. Swap “Shopwave” and the four steps for your platform name and your real activation milestones.
  2. Reorder the steps by what actually blocks a first sale for your merchants.
  3. Recolor the amber accent to your brand — keep the dark canvas and one bright accent for contrast.
Use this template