---
title: "Claude pair: writing the v6 onboarding overlay"
url: https://memory.wiki/igQZHNzq
updated: 2026-05-14T18:15:49.480Z
hub: https://memory.wiki/hub/demo
concept_count: 9
source: "memory.wiki"
---
# Claude pair: writing the v6 onboarding overlay

> Working session pulling the 5-slide welcome design that ships with v6.

## What I came in with

A blank `WelcomeOverlay.tsx` and a one-line brief: "five slides, dismissible, has to convince a first-time visitor that mdfy is the deploy-to-any-AI thing in under 30 seconds."

## The decisions that mattered

**One CTA per slide.** Claude pushed back hard on my first draft, which had Next + Skip + a link-out to /docs/integrate on every slide. Its argument: "you're testing two competing actions on the same screen. The link-out wins by default because it's the most specific." We ran a quick dogfood test with three people on the team — 0/3 made it to slide 5 because they all clicked the inline link on slide 2. Removed the links. Completion went to 3/3.

**The brand badge belongs on slide 1 only.** I'd put `Personal knowledge hub for the AI era` on every slide as a header band. Claude flagged it as "the same hook firing five times — by slide 3 the reader's brain skips it." Moved the badge to slide 1 only. Slides 2-5 lead with the step number badge instead (`STEP 02`, etc).

**Surfaces grid, not surfaces list.** Slide 4 originally read as a wall of text describing every AI tool we integrate with. We replaced it with a 2-column grid with a tiny color dot per surface (Claude Code orange, Cursor amber, Codex green, …). The page weight is the same but it scans in 1.5s instead of 5.

## What I'd keep

- The "one CTA per slide" rule. It survived contact with three users.
- The five-step arc: hook → capture → hub → deploy → surfaces. Each slide answers one question.
- Dismissible at any point. The badge state is persisted to localStorage so it never shows twice.

## What I'd revisit

Slide 3 ("Paste the URL. Any AI reads it.") still tries to convey two things — that we're URL-shaped, AND that ?compact / llms.txt keep cost low. The "cost low" part is the wrong altitude for an overlay; it belongs on /docs/integrate. Will trim next pass.


---

## Concepts in this document
- **mdfy** _(entity)_
  A tool that stores project context and decision history, integrated into Cursor via custom rules.
- **One CTA per slide** _(concept)_
  Design principle that eliminates competing actions to improve conversion; validated through user testing.
- **Brand badge placement** _(concept)_
  Moving the tagline to slide 1 only prevents cognitive habituation and preserves attention across remaining slides.
- **Five-step arc** _(concept)_
  Narrative structure (hook → capture → hub → deploy → surfaces) where each slide answers a single distinct question.
- **WelcomeOverlay.tsx** _(entity)_
  The component being designed—a five-slide dismissible onboarding sequence for mdfy v6.
- **Visual grid layout** _(concept)_
  Two-column grid with color dots for AI integrations reduces scanning time from 5s to 1.5s while preserving information density.
- **Dogfooding validation** _(concept)_
  Quick internal user testing (3 team members) that confirmed competing CTAs harm completion rate.
- **Message altitude** _(concept)_
  Contextual appropriateness of content depth; overlay-level messaging differs from documentation-level detail.
- **localStorage persistence** _(entity)_
  Technical mechanism ensuring the welcome overlay never repeats for the same user.

## Concept relations (within this doc's concepts)
- **Brand badge placement** supports narrative flow in **Five-step arc**
- **Visual grid layout** showcases integrations for **mdfy**
- **WelcomeOverlay.tsx** implements dismissal via **localStorage persistence**
- **One CTA per slide** validated by **Dogfooding validation**
- **Message altitude** informs slide-level scope in **Five-step arc**

_Hub canonical:_ https://memory.wiki/hub/demo
_Concept digest:_ https://memory.wiki/raw/hub/demo?digest=1&compact=1