Prepared by NextSky Advisors · Designer-facing build reference
This document turns the agreed concept into a screen-by-screen specification: what each screen is for, what it contains, its states, and how it behaves. It is written to brief a UI/UX designer to produce the Figma file, from which the Flutter UAT build can be extracted. It folds in the founder's feedback as locked decisions.
These are settled and should be treated as fixed direction:
Phased for later (not MVP): AI-assisted matching and icebreakers, a status/level system for top connectors, mentor discovery, profile-view tracking, blockchain.
Logo. Intertwined "dd" resolving into an infinity loop; must remain legible at app-icon and favicon sizes. Provide a wordmark lockup and a standalone mark.
Colour. Primary blue / light-blue conveying trust; warm neutral surfaces to avoid a cold corporate feel. A restrained accent for primary actions. Maintain AA contrast.
Typography. A confident, contemporary type system — a humanist sans for the interface; a touch of editorial character (e.g. a serif for headline moments) is welcome to reinforce the "club" feel without becoming formal.
Tone of voice. Human and direct — "Connect," "Introduce," "Vouch," "Founding member." Avoid corporate networking clichés. Serious about who's in; relaxed in how it feels.
Components. Card-based discovery; pill chips for interests/industries/intent; a consistent 5-tab bottom bar; sheets/modals for quick actions (suggest coffee, vouch, invite). Mobile-first, designed for one-handed use.
Bottom bar (every primary screen, identical): Discover · Network · Messages · Notifications · Profile.
Auth and onboarding screens have no bottom bar.
Global patterns:
Auth: Welcome · Verify (number/email) · Verify (code) · Returning (biometric). Onboarding: Intent & give/get · Interests, industries & hustle. Core loop: Discover · Discover empty/cold-start · Invite · Profile (viewing) · Trust detail · Spark/Chat · Post-meeting loop. Tabs: Network (Connections / Saved / Introductions) · Introductions composer · Messages · Notifications · My Profile (view/edit) · Settings (proximity / location / account).
Each block lists the screen's job, what it contains, its states, and key interactions.
Purpose: First impression and the front door. Establish "members' network," not dating app or directory. Contains: infinity wordmark; one-line value proposition; Create account (primary); Sign in (secondary); social options — LinkedIn (lead), Instagram, Apple, Google. States: default; loading after a social provider is chosen. Interactions: Create account → Verify (number/email); Sign in → Returning (biometric) if a session is remembered, otherwise Verify; social provider → OAuth then onboarding (new) or Discover (returning).
Purpose: Passwordless identity capture. Contains: heading; country selector + phone field (or email toggle); "Send code"; "Use email instead" fallback. States: empty; valid; invalid format; sending. Interactions: Send code → Verify (code). The choice of phone vs email persists to the code screen.
Purpose: Confirm ownership of the number/email. Contains: six single-digit boxes; destination line ("Sent to …321"); resend countdown; "Edit number." States: empty; partial; complete; error (wrong code); expired; locked (too many attempts). Interactions: auto-advance between boxes; accept a pasted code; auto-submit on the sixth digit; numeric keypad on focus. Success → Onboarding (new) or Discover (returning).
Purpose: Let remembered members back in without re-authenticating. Contains: mark; "Welcome back"; Face ID prompt; "Use a code instead." States: prompting; success; failed (fall back to code). Interactions: biometric success → Discover; failure → Verify (code).
Purpose: Capture why a member is here and what they offer, the spine of matching. Contains: progress (step 1 of n); "What brings you here?" multi-select (find a co-founder, win clients, find a mentor, hire talent, meet investors, find a mentee, peer relationships, exploring); "…and what I can offer" multi-select (capital, intros, expertise, hiring, partnership). States: nothing selected (Continue disabled); selections made. Interactions: multi-select chips; Continue → interests step.
Purpose: Deep niche capture for matching and icebreakers. Contains: searchable interest chips with the ability to add niche entries; industry multi-select; a short "what are you working on" (hustle) field; (later) AI-suggested niches based on early selections. States: few vs many selected; custom niche added; AI suggestions loading (phase 2). Interactions: search/add chips; Continue → Discover. Encourage breadth — the more niches, the better the matches and the easier the icebreaker.
Purpose: The core daily surface — find relevant people. Contains: one condensed card (photo, name, role, distance, a few interest/industry chips, a single trust signal); actions Skip / Save / Connect; bottom bar. States: populated; card acted-on (animates to next); end-of-stack; cold-start (screen 8). Interactions: swipe or tap Skip/Save/Connect; tap card → Profile. Connect requests a connection (other side opts in).
Purpose: Turn an empty early network into a desirable, exclusive moment. Contains: "You're early — that's the point"; founding-member framing; "Invite people you'd vouch for" (primary); widen-radius and notify-me options. States: truly empty; sparse (a few nearby). Interactions: Invite → Invite screen; widen radius adjusts discovery range; notify-me sets an alert.
Purpose: Grow by vouched invitation; the acquisition wedge. Contains: "Invite someone you'd vouch for"; recipient field (name/number/contact); invite allowance ("3 of 5 left"); list of sent invites with status; "Share my founding-member invite link." States: allowance remaining; allowance used up; invite sent/pending/joined. Interactions: send invite; share link. Founding members carry a permanent badge.
Purpose: Decide whether to connect. Contains: photo; name + verified tick; role/location; single trust signal ("Trusted by 23" → Trust detail); shared connections/industries/interests; About; Save / Connect. States: not connected; request pending; connected. Interactions: tap trust → Trust detail; Connect → request; Save → Saved tab.
Purpose: Show why someone is trusted, in depth. Contains: consolidated headline ("Trusted by N" / "Vouched for by N verified connections"); top traits with counts; the people who vouched; intros made; meaningful connections. States: rich (established member); thin (new member) — design the new-member state so it never feels empty or punitive. Interactions: tap a voucher → their profile. No blockchain. No negative feedback shown.
Purpose: Move a new connection toward a real-world meeting. Contains: header (the two people, verified); Connection Journey timeline (Spark → Connect → Meet → Trust → Vouch); messages; conversation starters; quick actions — Suggest coffee, Vouch (locked until meeting); composer. States: new (starters prominent); active; meeting scheduled (Meet step live); post-meeting (vouch unlocked). Interactions: Suggest coffee → meeting invite (other side accepts); tapping the Meet step or the locked Vouch → Post-meeting loop once a meeting is confirmed.
Purpose: The mechanic that makes vouches mean something and closes the flywheel. States: awaiting confirmation; vouch given; intro started. Interactions: confirm meeting → unlock vouch; vouch → updates both trust profiles; introduce → Introductions composer.
Purpose: Manage relationships. Contains: tabs — Connections / Saved / Introductions; list rows (avatar, name, role); bottom bar. States: populated; empty per tab (designed empty states). Interactions: row → Profile; Introductions tab → list of intros made/received and a way to start a new one (composer).
Purpose: Create a warm lead between two connections — the differentiator. Contains: "Introduce" — pick connection A and connection B; a short "why they should connect" line; send. States: empty; ready; sent/pending/accepted. Interactions: both recipients opt in before any chat opens; completed intros appear on the relevant trust profiles.
Purpose: All active conversations in one place. Contains: conversation list (avatar, name, last line, unread); bottom bar. States: populated; empty. Interactions: row → Spark/Chat.
Purpose: Keep members returning for the right reasons. Contains: tabs — All / Sparks / Messages / Intros; rows (sparked, intro requested, vouched for you, new message); bottom bar. States: populated; empty; (phase 2) "X viewed your profile" as a premium hook. Interactions: row → relevant screen.
Purpose: The member's own, editable presence. Contains: cover + avatar; name + verified tick; headline; Edit; About; what I'm looking for + offer; work; interests; strengths; (link to) Settings. States: view; edit. Interactions: Edit → inline editing; gear → Settings.
Purpose: Discovery, account, and (later) premium controls. Contains: Discovery — proximity (free) and change-location (premium); Account — personal info, privacy, notifications, security; About; Log out. States: free; premium (location unlocked). Interactions: standard settings rows; premium rows route to the upgrade path.
— NextSky Advisors