Signup and upsell
An email starts a free account. The same card then names the workspace and offers the paid plan.
- Problem
- A free signup and the paid offer lived on different pages.
- Role
- UI and frontend
- Built
- An email signup that continues into the upsell
- Tracking
- The address stays on the page
- Result
- Sample
Signup and upsell
A work email starts a free account. The same card then offers the team plan.
Case study
Context: The Team plan on the Pulse landing page. The email field is the 2-step-button form. A valid address starts a free account, and the next screens are the workspace, the invites, and the paid plan.
The decision
The address is the account. The person does not leave the card for a second form. A team of 2–5 can invite people. A larger team skips the invites and sees the paid plan. Buying does not charge a card. Go to my free account ends the sample on the page.
What I owned
- The email step. The button opens one field, and a valid address starts the free account.
- The workspace step. Team size sets the workspace count, and the name has to be at least 3 characters.
- The invite step for a small team. The signup address is the admin. Added names use a sample domain, and the list stops at 4.
- The upsell. The price follows the team size and the billing period. The free account is still one click away.
How someone else reuses it
Pass a label and a list of team sizes. The email, workspace, invite, and upsell steps stay in that order. Nothing is stored or charged.
In React
SignupUpsell holds the whole path. A valid email records a completed free signup. Reaching the paid plan, choosing it, or leaving for the free account records a later step. The same path is on the Pulse pricing card.