The Onboarding Experience
Guided Setup: From Sign-In to Strategy
The onboarding experience in Credit Card Co-Pilot is designed to transform a user's wallet into a high-performance rewards engine in under two minutes. By focusing on progressive disclosure, the system ensures that complex configurations—like reward rules and milestone tracking—are handled through a simple, guided flow.
Frictionless Authentication
The journey begins with a secure, one-tap entry point. By leveraging Google Sign-In, the application eliminates the friction of manual account creation while establishing a foundation for future integrations (such as optional Gmail-based transaction ingestion).
- Secure Identity: Utilizes industry-standard OAuth 2.0.
- Connectivity Awareness: The onboarding flow provides real-time feedback on internet connectivity to ensure a smooth initial sync.
Building Your Digital Wallet
The core of the Co-Pilot’s intelligence is your card portfolio. During the "Add Cards" phase, users are prompted to select their existing credit cards from an extensive pre-loaded database.
- The Power of Three: While the system requires at least one card to function, the onboarding experience encourages users to add three or more. This allows the recommendation engine to effectively compare different reward structures and demonstrate the "best-in-wallet" value proposition.
- Smart Card Browser: Users can quickly search by bank or card name. The interface categorizes cards by network (Visa, Mastercard, RuPay, Amex) and issuer (HDFC, ICICI, Axis, etc.), ensuring the digital replica matches the physical card exactly.
Personalized Profile Configuration
To provide accurate advice, the Co-Pilot collects high-level spend preferences during the initial setup. This data influences how the recommendation engine prioritizes certain cards for high-value transactions.
- Spend Brackets: Users select their typical monthly spend (e.g., ₹25k-50k or ₹1L-3L).
- Contextual Awareness: This information helps the system calculate the likelihood of hitting annual fee waivers or spend-based milestones.
Visual Progress Tracking
To reduce cognitive load, the onboarding flow utilizes a persistent, top-mounted Progress Bar. This visual cue breaks the setup into four distinct, digestible steps:
- Welcome & Value Intro: Understanding the "Maximize Rewards" philosophy.
- Profile Creation: Setting spend and preference baselines.
- Wallet Construction: Adding physical cards to the digital app.
- Interactive Tutorial: A guided walkthrough of the Search and Recommendation interface.
The Interactive Tutorial
The final step of onboarding is a hands-on simulation. Before the user ever makes a real payment, they are guided through a mock "Merchant Search."
- Search Simulation: Users learn how to input a merchant (e.g., "Amazon" or "Starbucks").
- Result Interpretation: The tutorial explains how to read the "Best Card" result, highlighting why a specific card was chosen—whether due to a 5% cashback category, a channel multiplier for online shopping, or proximity to a milestone bonus.
Developer & Data Context
For developers integrating with the onboarding flow, the system utilizes a centralized onboarding_store to track state. This ensures that if a user leaves the app mid-setup, they return exactly where they left off.
The data collected during this phase populates the users and user_cards tables in the local SQLite database:
// Example of the data structure initialized during onboarding
export interface UserProfile {
displayName: string;
mobileNumber?: string;
monthlySpend: "0-25k" | "25k-50k" | "50k-1L" | "1L-3L" | "3L+";
}
export interface UserCard {
cardDbId: number; // Reference to the global card database
displayName: string; // User-defined nickname
network: string; // Visa, Mastercard, etc.
}
By the end of the onboarding experience, the Co-Pilot has a complete map of the user's financial tools, ready to provide precise, real-time spending advice.