Registration & Onboarding

Designed the complete registration, sign-up, and enrollment experience from scratch — covering public sign-up, in-app segment registration with billing, invite flows, and guardian onboarding.

TimelineOctober 2025 – April 2026

Team1 Designer (me), 1 PM, 2–3 Engineers

ToolsFigma, Jira

DisciplinesInteraction Design, UX Design, Product Strategy, Prototyping

INTRODUCTION

What is Courtside?

Courtside is a sports management platform for coaches, academies, and organizations. It supports multiple user types — coaches/admins who run organizations, athletes who participate, and parents/guardians who manage their children's activities.

Registration is a critical funnel: new users sign up publicly, existing users enroll in specific programs (segments/batches), and guardians go through a distinct flow that connects them to their child's organization. Each path has different requirements, different information needs, and different payment considerations.

THE PROBLEM

There was no cohesive registration experience. Public sign-up, in-app enrollment, and guardian onboarding were either missing or cobbled together from generic patterns.

Granular Design Problems

No public sign-up flow — New users arriving at the landing page had no guided path to create an account and join an organization.

No in-app registration for segments — Users inside the app couldn't enroll in a new segment/batch with integrated billing.

Guardian onboarding gap — Parents needed a distinct path — they're not the athlete, they're managing someone else's participation. No flow existed for this.

Invite flow confusion — The system supported invites, but the experience for receiving and accepting invites was unclear.

No payment integration in registration — Billing and checkout needed to be part of the enrollment flow, not a separate step.

GOAL

Design registration flows that get each user type — new public users, existing users enrolling in programs, and guardians — from intent to fully enrolled with payment, in as few steps as possible while handling the complexity of multiple organization types and billing configurations.

PROCESS & RESEARCH

Scoping with PM

Discussed scope directly with Luqman early on — shaping the decision to design for the full flow including billing, rather than just the sign-up form.

Flow Mapping

Mapped out the different user paths: public sign-up → organization selection → segment enrollment → payment. Created flow diagrams for each user type to identify complexity and handoff points.

DESIGN EXPLORATION

Public Sign-Up Flow

Designed the entry point for new users arriving from the landing page. Created interactive prototypes for the full sign-up sequence covering landing page → sign up form → organization selection → onboarding.

In-App Segment Registration with Billing (CUI-233)

The most complex flow — an existing user inside the app enrolling in a new segment/batch, with integrated payment.

User Journey

1. User sees available segments/programs

2. Selects a segment to enroll in

3. Reviews segment details and schedule

4. Proceeds to checkout/payment

5. Completes payment

6. Receives confirmation and is enrolled

Invite Flows — New vs Existing Guardian (CUI-239, CUI-241)

Designed distinct paths for:

New guardian receiving an invite — Needs to create an account, then accept the invite and connect to their child's organization.

Existing guardian receiving an invite — Already has an account, just needs to accept and select the organization.

Checkout & Payment Page (CUI-115)

Designed the checkout page UI that sits at the end of the registration flow with pricing breakdown and payment confirmation.

RESPONSIVE DESIGN

Designed for both web and mobile:

Web: Full registration flow with side-by-side layouts for organization selection, expanded billing details on checkout.

Mobile: Streamlined step-by-step flow, optimized for thumb-reach on form inputs.

DEVELOPER HANDOFF

Created Figma pages with spacing guidelines and auto-layout screens. Tracked features via Jira tickets (CUI-117, CUI-233, CUI-239, CUI-241, CUI-115). Connected with devs to review implementation on feature builds.

IMPACT & LEARNINGS

Impact

Billing integrated into onboarding — Users can now register and pay in a single flow instead of separate steps.

Multiple user types supported — Single design system handles public sign-up, in-app enrollment, and guardian onboarding.

What I'd Do More Of

- More user testing of the invite acceptance flow

- Deeper exploration of edge cases around multi-child guardian scenarios