Signup to paywall

2023–2026 · Design and frontend

How a new Sourcetable user got from signing up to a first real result, and later to paying.

Figma, React, Google Identity Services, OAuth, Stripe

Sourcetable’s workspace had an empty box at the top asking “What would you like to do?”, and the onboarding I built sent a new user’s first message for them. The signup and onboarding screens were mine in Figma. I built them too, along with the trial and its paywall, down to a password-reset message that read the same whether or not an email had an account.

Sourcetable's Tutorials page on a free trial account, with the trial card at the bottom of the sidebar
Bottom left, the trial card: “Credits: 959/1,000”, “Your free trial ends in 5 days” and an Upgrade Plan button.

The trial was gated by message credits, and that card’s copy changed with where you were in it. Many new users found Sourcetable through search, on pages the rendering engine generated. Onboarding went through five versions between October 2023 and July 2026, among them a product tour and a nine-slide one that shipped in 10 locales. The last, an experiment, touched signup, sign-in, a new workbook’s first load, the chat and billing at once.

The first message sends itself

A new user picked a starting point, such as a sample dataset, a source to connect or a file to upload. The onboarding then sent a prompt chosen for where they were headed.

Google sign-in hung on the first click

It happened when a new user tried to connect a source through Google’s sign-in. I hooked into a real readiness signal from Google Identity Services and opened the popup earlier.

Make the trial gate survive a refresh

In 2026 I built a version of the trial that required a card, entered through Stripe as a step inside onboarding. It came with a trial billing screen and paths to cancel or downgrade. Six account states interacted behind the gate (trial, a free plan, paid, past due, incomplete and out of credits) across the chat, the dialogs, the header and onboarding. A past-due account, for one, got a banner that switched off purchases. The gate had to survive a refresh and a cancellation, and I wrote Jest tests for the trial logic. The trial’s length went from 7 days to 2 and back to 7. I set the marketing site up to read it from one place. Billing took 264 changes. That’s money code, and you don’t get to be sloppy there.

A survey right before the wall

In another version of the trial, the wall was a forced credit-card modal that also opened inside the chat. I built the survey in front of that modal as a snap-scroll carousel.

The design archive lists the Figma files for signup and onboarding, among them a March 2025 flow map that wires dozens of app screenshots into phases labeled “START HERE”, “Hooking the user” and “Post user education”. There’s no activation rate to report for any of onboarding’s five versions.