New Member Onboarding Screen
Component Detail
Description
A lightweight in-app screen (or deep-link landing page) that receives the referred new member after they follow the referral link. Captures basic registration intent and passes the referral token to the backend for attribution.
new-member-onboarding-screen
Summaries
The New Member Onboarding Screen is the first impression a prospective member receives after following a peer mentor's referral link — making it a critical conversion touchpoint. A seamless, branded onboarding experience directly reduces drop-off rates between a referral click and a completed registration, translating each mentor's outreach effort into measurable membership growth. By surfacing the referring mentor's name and the organisation's branding, this screen builds immediate trust and social proof, which research consistently shows increases conversion rates. Every percentage point of improvement here compounds across the entire referral network, delivering outsized ROI on recruitment investment without additional acquisition spend.
This component sits at the very start of the referral conversion funnel, making it a delivery dependency for the entire peer recruitment feature. It requires coordination between the mobile team (deep link handling, UI), the backend team (referral token validation, attribution service), and any brand/design assets supplied per organisation. Medium complexity overall, but the deep-link parsing logic must be tested across iOS and Android to handle edge cases like expired tokens or cold-start app launches. QA must cover both warm-start (app already open) and cold-start (app not running) deep-link flows.
Delays here will block end-to-end referral testing, so it should be prioritised early in the sprint cycle.
The component integrates with two key dependencies: `deep-link-handler` for URI parsing and `referral-attribution-service` for token submission. On mount, `handleDeepLink(uri)` extracts the referral token from the incoming URI scheme and passes it downstream before any UI renders. `showOrganisationBranding(orgId)` performs an async fetch to resolve org-specific assets, so loading states must be handled gracefully to avoid a flash of unstyled content. `onSubmitRegistration(formData)` must call the attribution service before handing off to the membership registration system to ensure the token is recorded even if the downstream registration fails.
Token persistence across app restarts (e.g., via shared preferences or secure storage) is required to handle interrupted onboarding sessions.
Responsibilities
- Parse and validate referral token from deep link
- Display organisation branding and welcome message
- Collect new member contact details for registration handoff
- Submit referral attribution before redirecting to membership system
Interfaces
build(context)
handleDeepLink(uri)
onSubmitRegistration(formData)
showOrganisationBranding(orgId)
displayWelcomeMessage(referrerName)
onRegistrationComplete()
Relationships
Dependencies (2)
Components this component depends on