Shipping Update — Ecommerce

A warm shipping notification with truck emoji, three-column status row (order / tracking / ETA), shipping address, and a track-shipment CTA.

Transactional ecommerceminimalreceiptherocta

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 oysLneWq3hvmj2UZxmalb, then rebrand it. For the full model, point it at get_conceptemail-structure, layouts-vs-emails, design-recipes.

The email a customer gets the moment their order ships: a warm “On its way” badge up top, the shipping status spelled out (order, carrier, tracking, ETA), and one big Track button. Friendly, but still a clean status update — not a sales pitch.

Snapshot

  • Goal: tell the customer their order shipped, when it arrives, and give them one clear way to track it.
  • Audience & tone: customers whose order just shipped. Warm, functional, slightly excited — one warm accent, not over-the-top.
  • Palette: page #fff8f3 · container #ffffff · text #1e293b / #64748b (muted) · accent orange #ea580c
  • Font: Verdana, sans-serif
  • Artwork: one badge-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. [native] Wordmark — text. “SHOPWAVE”. fontSize: 15, fontWeight: 700, color orange #ea580c, letterSpacing: 2px, center, generous top padding.
  2. [layout] Badge hero — apply the badge-hero layout template; recolor its badge to orange #ea580c over #fff8f3. Overlay copy: eyebrow ”🚚 SHIPPED”, heading “Your order is on the way!”, subline “Your 4 items shipped via UPS Ground.” Text-only artwork — the working Track button is the native button in step 6.
  3. [native] Status heading — text. “Shipment details”. fontSize: 18, fontWeight: 700, color #1e293b, center, generous top padding.
  4. [native] Status rows — text. “Order   #ORD-4821 · Carrier   UPS Ground · Tracking   1Z999AA10123456784 · Arriving   Tue, Jul 16”. fontSize: 15, color #1e293b with labels in #64748b and the ETA line in orange #ea580c bold, center, lineHeight: 1.8. This stacked list replaces the three-column status row — the flat model stacks and divides, it does not lay out columns.
  5. [native] Divider — orange-tinted #fed7aa, generous vertical padding.
  6. [native] CTA button — button. Label “Track shipment”, orange #ea580c fill, white text, rounded corners, center. This is the working track link the rasterized hero can’t carry.
  7. [native] Shipping address — text. “Shipping to — Jordan Lee · 412 Maple Ave, Apt 5 · Portland, OR 97204”. fontSize: 13, color #64748b, center, lineHeight: 1.6.
  8. [native] Footer — social + address. Recolor both to the palette: social.color = #ea580c, address.color = #94a3b8, address.fontFamily = Verdana, sans-serif. Include a support link. Without this they fall back to a generic brand-blue that clashes with the orange.

Make it yours

  1. Swap the order number, carrier, tracking number, ETA, and shipping address for the real shipment.
  2. Point “Track shipment” at the carrier’s live tracking URL.
  3. Recolor the orange accent to your store’s brand — keep the badge hero to one warm color.
Use this template