Get Started

Getting Started Guide — SaaS

A scannable onboarding guide with three numbered step cards (Connect, Import, Launch), a CTA button, and a support line. Light teal accent on a clean white canvas.

Welcome & Onboarding saasminimalonboardingfeature-gridcta

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 MTi6wq46QCI1FqoviTW-V, then rebrand it. For the full model, point it at get_concept — email-structure, layouts-vs-emails, design-recipes.

The onboarding email that hands a new SaaS user a clear three-step path to their first project. A calm teal gradient hero sets the tone, then Connect → Import → Launch spell out exactly what to do, and one teal button drops them into the app. Scannable, confident, done.

Snapshot

  • Goal: give a new user a clear, instructional path (Connect → Import → Launch) to their first project.
  • Audience & tone: new users who want a direct path to value. Helpful and direct — “here are the three steps, follow them, you’re done.” Scannable and confident.
  • Palette: page #f8fafc · container #ffffff · text #0f172a / #64748b (muted) · accent teal #0d9488 (gradient hero #0d9488 → #14b8a6)
  • Font: Tahoma, Verdana, sans-serif
  • Artwork: one gradient-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] Gradient hero — apply the gradient-hero layout template; recolor the band to a teal gradient (#0d9488 → #14b8a6). Overlay copy: eyebrow “GETTING STARTED”, heading “3 steps to your first project” (white). Text-only artwork — the working CTA is the native button in step 9.
  2. [native] Intro copy — text. “Welcome to Flowbase. Follow these three steps and you’ll have your first project live today.” fontSize: 16, color #64748b, center, line-height: 1.6.
  3. [native] Step 1 label + title — text. “STEP 1 · Connect your data source” fontSize: 16, fontWeight: 700, color #0f172a, left, with the “STEP 1” eyebrow in teal #0d9488.
  4. [native] Step 1 detail — text. “Link the tools you already use — it takes about a minute.” fontSize: 14, color #64748b, left, tight top padding.
  5. [native] Divider — hairline #e2e8f0, generous vertical padding. This replaces the “card” separation — the flat model stacks and divides, it does not box.
  6. [native] Step 2 label + title — text. “STEP 2 · Import your content” fontSize: 16, fontWeight: 700, color #0f172a, left, teal eyebrow.
  7. [native] Step 2 detail — text. “Bring in what you have — we’ll organize it for you.” fontSize: 14, color #64748b, left, tight top padding.
  8. [native] Divider — hairline #e2e8f0, generous vertical padding.
  9. [native] Step 3 label + title — text. “STEP 3 · Launch your project” fontSize: 16, fontWeight: 700, color #0f172a, left, teal eyebrow.
  10. [native] Step 3 detail — text. “Hit go and share it with your team.” fontSize: 14, color #64748b, left, tight top padding.
  11. [native] CTA button — button. Label “Open the app”, teal #0d9488 fill, white text, rounded corners, center.
  12. [native] Support line — text. “Need a hand? Reply to this email or visit our help center.” fontSize: 13, color #64748b, center, link in teal #0d9488.
  13. [native] Footer — social + address, recolored to the palette: social.color = #0d9488, address.color = #94a3b8, address.fontFamily = Tahoma, Verdana, sans-serif. Without this they fall back to a generic brand-blue that clashes with the teal.

Make it yours

  1. Swap “Flowbase” and rename the three steps to match your product’s actual setup flow.
  2. Retune the CTA to your first-run destination (“Open the dashboard”, “Start your project”).
  3. Recolor the teal hero and accents to your brand — keep it to three steps for scannability.
Use this template