Feel Pro Club Docs

Appearance

0004. Navigation, Home, and Post-Join Experience ​

Status: Approved Author: Codex Created: 2026-03-09

Overview ​

This PRD defines the main in-app navigation model once a user is inside Feel Pro Club, including the four-tab shell, the post-join welcome screen, and the home surface that aggregates matches and notifications.

Problem Statement ​

After onboarding or team acceptance, users need immediate orientation. The app must make it obvious where to go next, surface the most urgent team and system updates, and keep navigation lightweight enough for repeated weekly use.

Goals ​

  • Give all users a stable four-tab information architecture.
  • Provide a meaningful first screen after joining a team or returning to the app.
  • Centralize urgent updates, match status, and profile-completion prompts in one place.

Success Metrics ​

  • High rate of users reaching a core tab without confusion after onboarding.
  • Strong engagement with home CTAs such as confirming attendance or completing profile data.
  • Low drop-off after team join, especially for non-organizer members.

Scope ​

In Scope ​

  • Bottom navigation and its active-tab logic.
  • Post-join welcome experience for members and substitutes.
  • Home page greeting, upcoming matches carousel, and notification feed.
  • Direct home actions for attendance or notification call-to-action handling.
  • Home empty state when no notifications exist.

Out of Scope ​

  • Secondary settings navigation or desktop-specific navigation patterns.
  • Push notification delivery and device-level notification permissions.
  • Detailed team-management actions that live inside the team workspace.

Personas and Roles ​

  • Organizer: Needs quick access to home, team workspace, market, and profile.
  • Starter or regular member: Needs visibility into upcoming matches and attendance decisions.
  • Known substitute: Needs a lighter home state that avoids showing inapplicable match controls until summoned.

User Journey ​

  1. After authentication and onboarding, the user's first destination depends on context.
  2. Organizers who just finished onboarding land directly in the team workspace.
  3. Free players who just finished onboarding land directly in Market.
  4. New team joiners who accepted a team invitation as starters, substitutes, or known substitutes may see a post-join welcome before entering the regular shell.
  5. Returning users and users without a welcome-state exception enter the regular shell.
  6. The bottom navigation exposes Home, My Team(s), Market, and Profile.
  7. Home surfaces upcoming matches and relevant notifications.
  8. The user branches into the team workspace, market, or profile from the tab bar or notification CTAs.

Functional Requirements ​

  1. The main app shell shall expose four tabs: Home, My Team(s), Market, and Profile.
  2. The navigation component shall keep a consistent active-state highlight as users move across tabs.
  3. The navigation layer shall treat related subpages as part of their parent tab for active-state purposes. Example: team-profile belongs to My Team(s), and profile-completion editing belongs to Profile.
  4. The bottom navigation shall support horizontal swipe movement between adjacent tabs.

Post-Join Welcome ​

  1. The post-join welcome shall be shown only to new team joiners who decided to join through an invitation flow or through a join-related notification.
  2. Starters and regular members shall see a celebratory welcome plus next-match details when a next match exists.
  3. Substitute-oriented users and known substitutes shall see a waiting-state message that explains they can be summoned later and may also create their own team.
  4. The welcome screen shall expose a single "start" action into the main app.
  5. Returning members who have already completed the join moment shall not be shown the post-join welcome again by default.

Home Feed ​

  1. Home shall greet the user by first name.
  2. When at least one upcoming or in-progress match exists, Home shall show a horizontally scrollable match carousel.
  3. The match carousel shall show only matches from teams the user is currently a member of and sort them chronologically.
  4. In-progress matches shall display a distinct visual state (e.g., "In progress" badge) compared to upcoming matches.
  5. The current team's active match card shall support attendance actions that immediately update the confirmed-player count.
  6. Known substitutes who have not yet been summoned shall not see the match carousel.
  7. When no notifications exist, Home shall show an empty state instead of an empty feed.
  8. The Home empty state should still leave navigation and other available sections reachable.

Notifications ​

  1. Home shall show a notification feed combining system and team-originated messages.
  2. Each notification card shall show sender identity, title, message, and any available CTA buttons.
  3. Non-persistent notifications that do not require a user decision shall be dismissible with a right-to-left swipe gesture.
  4. Persistent notifications and notifications that require a user action shall not be swipe-dismissible.
  5. Notifications related to mandatory completion flows, such as complete-your-profile, shall remain visible until their underlying condition is resolved.
  6. Notifications that require a user decision, such as invite acceptance, shall remain visible until the user acts on them or the underlying condition expires.
  7. Triggering a notification CTA shall mark the notification as read.
  8. Dismissing a notification shall mark the notification as read and soft-delete it from the Home feed.
  9. A notification that was dismissed or interacted with through its CTA shall not appear in Home again unless it is tied to persistent product logic that still applies.
  10. Notification CTAs shall route into the relevant destination.
  11. The notification feed shall load notifications in batches of 10 as the user scrolls down (infinite scroll). There is no hard cap on total notifications.

Business Rules and Permissions ​

  • Home shall never show matches from teams the user does not belong to.
  • If the user belongs to multiple teams, Home may show matches from those teams in the same chronological carousel.
  • Attendance controls in Home apply only to matches where the user has a valid response to make.
  • Known substitutes should not see organizer-style upcoming-match controls before they are actually summoned.
  • The navigation model assumes the user is inside the authenticated shell; pre-auth screens are outside this scope.
  • Dismissed notifications are soft-deleted for record-keeping purposes and treated as read.
  • Chronological ordering of multi-team match cards is the default prioritization rule for the Home carousel.

UX Considerations ​

  • Home should feel like an inbox plus match center, not a generic dashboard.
  • Post-join copy should adapt to whether the user is a regular team member or only a substitute.
  • Notification cards should preserve team branding where a team sender is known and fall back to Feel Pro Club branding for system messages.
  • Match cards in the Home carousel should use the colors of the team organizing the match so users can quickly distinguish multiple teams at a glance.
  • Swipe-to-dismiss should feel lightweight and safe, and should not be available on cards that still require action.
  • The empty state should clearly communicate that there is nothing pending without making Home feel broken or unfinished.

Error States ​

  • Home and notification surfaces shall distinguish loading, empty, error, and stale states. Failed loads shall show retry affordances instead of reusing empty-state copy.
  • Home shall support manual refresh so returning users can recover from stale match or notification data without waiting for a full app restart.
  • Attendance responses and swipe-to-dismiss actions may update optimistically only if the previous state can be restored on failure. If the server rejects the action, the card state and counts shall roll back with clear feedback.
  • If a notification CTA targets a deleted match, deleted team, or otherwise unavailable resource, the user shall land in a recoverable unavailable-state screen with a clear path back to Home.
  • Infinite-scroll pagination failures shall preserve already loaded items and show an inline retry row at the failed boundary rather than stopping the feed silently.