Share
Explore

Onboarding Flow + Profile Completion (revamp)

👩🏻‍💼 Created By: Abhinav

👨🏻‍💻 Dev Team Owner: Yogesh

🗓 Date Created: 6/2/27

📱 Platform: Beep App + Webapp

⏱ Expected Final Release Timeline:

note: Please check the collapsible headers , double click on the heading, it’ll open the doc. Ive used ‘users’ interchangeably with ‘students’, and the future scope isnt defined at the moment

🧑🏻‍🎓 Actors / Target Audience:

Main Users: Students (in Tier 2 and Tier 3 colleges in India who want to find jobs and improve their skills.
Others: Recruiters and companies hiring, and course providers

❓ Problem Statement:

Students on Beep App aren't completing their profiles, making it harder for them to find jobs and for recruiters to find the right people

✅ Why do we need to solve this?

We want to make it super easy for students to create awesome profiles that get them noticed. This will help them get better jobs and make Beep App more useful for everyone

🧐 Key Objectives/Goals:

Main Goal: Get 30% more students to finish their profiles within a week of joining the app (current benchmark is 3% only with a broken logic to check profile completion)
Other Goals:
Get students to add more skills to their profiles (aim 15% more) (currently we dont have a proper BE structure in v1 for profile completion - with current BE logic setup the profile completion rate is ~3%)
Get 20% more recruiters to look at and contact students on Beep App ( can work with pseudo right now)
image.png

🎯 Metrics to be affected & Target to be achieved

Profile Completion: Increase the percentage of students completing their profiles within 7 days by 30% within the first month after the app update (new users)
Need to increase the top of the funnel per month. 22.46k Signup → 8k Onboarding comlete (34%) → Need this number to reaach 60% (with the same installs the number has to be ~15k)
Skills Listed: Increase the average number of skills on student profiles by 15% within the first month after the app update (current benchmark is 3.5 skill per user need this number to reach 5skill per user)
Recruiter Engagement: Increase the number of recruiter searches and profile views by 20% (pseudo now)

EPIC: User Onboarding and Profile Setup

As a new user, I want to seamlessly onboard and set up my profile so that I can apply for internships/jobs and access upskilling courses and see my Profile Completion %

User Story 1: User Registration and Verification

User story 1.1 : User logins via SSO

As a user, I want to register with my Google/Linkedin/Apple ID and verify it with mobile number and OTP so that i can create an account
Acceptance Criteria:
google
Description: As a user, I want to register with my mobile number and verify it with an OTP so that I can create an account.
Acceptance Criteria:
The user is prompted to enter their mobile number.
An OTP is sent to the provided mobile number.
The user inputs the OTP to verify the number.
An optional field for a referral code is available, prompting the user to fill in the referral code to get 20 coins, which are directly added to their coin wallet (future scope post the referral and reward feature).
The user can proceed only after successful OTP verification.

User Story 2: Onboarding Options

Description: As a user, I want to choose between uploading a resume, uploading my LinkedIn profile, or filling in my details manually for onboarding.
Acceptance Criteria:
The user is presented with three options: Upload Resume, Upload LinkedIn Profile, Fill Manually.
Clicking "Upload Resume" triggers a file upload dialog box.
Clicking "Upload LinkedIn Profile" opens a LinkedIn login pop-up where the user logs into LinkedIn or posts a LinkedIn Profile URL (TECH DISCUSSION PENDING).
Clicking "Fill Manually" directs the user to the manual input form.

User Story 3: Upload Resume

Description: As a user, I want to upload my resume so that the system can prefill my profile information.
Acceptance Criteria:
The user can upload a PDF resume file.
Backend parses the resume and extracts relevant information.
Profile fields are prefilled with extracted information.
The user can edit any prefilled information.

User Story 4: Upload LinkedIn Profile

Description: As a user, I want to upload my LinkedIn profile so that the system can prefill my profile information.
Acceptance Criteria:
The user is redirected to LinkedIn login for authentication.
Backend fetches and parses LinkedIn profile information.
Profile fields are prefilled with extracted information.
The user can edit any prefilled information.

User Story 5: Manual Profile Setup

Description: As a user, I want to manually input my profile picture and name.
Acceptance Criteria:
The user can upload a profile picture.
The user can enter their name.
The user can proceed to the next step after uploading a profile picture and entering their name.
For "Upload Resume" and "Fill with LinkedIn," the user name and profile picture might be parsed/might not be parsed.

User Story 6: Area of Interest and Skills Selection (rethinking now)

Description: As a user, I want to select my area of interest and relevant skills so that my profile reflects my expertise.
Acceptance Criteria:
The user is presented with a list of areas of interest in headers format.
The user can select any area of interest from the list above.
The selected area of interest is highlighted (size of the card increases).
Recommended skills related to the selected area are displayed.
The user must select at least 3 skills to proceed.
The user can search and add additional skills from the backend dataset. (existing data set → enhanced Data set required)
For "Upload Resume" and "Fill with LinkedIn," the user will still have to fill in the details on the screen.
image.png

User Story 7: Education Details

Description: As a user, I want to input my education details to complete my profile.
Acceptance Criteria:
The user can select their college from a dropdown list.
The user can add a new college if not found in the list.
The user can enter the course name and duration.
All fields are mandatory and must be filled to proceed.
For "Upload Resume" and "Fill with LinkedIn," education details input fields might be prefilled/might not be prefilled based on the accuracy of the parser.

User Story 8: Work Preference

Description: As a user, I want to select my work preference and preferred location so that employers know my availability.
Acceptance Criteria:
The user can select work preference (Work from Home, In Office, Hybrid) using radio buttons.
If "In Office" or "Hybrid" is selected, a location preference field appears.
The user can search and select a location from the dropdown list.
For "Upload Resume" and "Fill with LinkedIn," the user will still have to fill in the details on the screen.

User Story 9: Profile Review

Description: As a user, I want to review and complete my profile by adding additional details such as bio, professional experience, projects, and awards & certifications so that my profile is comprehensive and accurately reflects my professional background.
Acceptance Criteria:
Pre-filled Sections:
The screen displays pre-filled sections for skills, education details, email, mobile number, user name, and profile picture
The user can edit the prefilled input
Bio Input:
The user can input a professional bio.
Placeholder text: "Enter your professional bio here..."
Frontend Requirement: Text input field with a placeholder.
Professional Experience Section:
The user can add professional experience entries.
Each experience entry includes:
Organisation input field (Placeholder: "Enter organisation name")
Designation input field (Placeholder: "Enter your designation")
Duration of experience input field (calendar format) (Placeholder: "Select duration of your experience")
Workplace type input (Remote, In Office, Hybrid)
If "In Office" or "Hybrid" is selected, a workplace location input appears (Placeholder: "Enter workplace location")
Description input field (Placeholder: "Describe your professional experience")
The user can add multiple experiences via an "Add Experience" option.
Experience entries are displayed in a pop-up format without redirection.
Frontend Requirement: Dynamic form fields with conditional display for workplace location.
Backend Check: Ensure each experience entry is saved and retrieved correctly, supporting multiple entries.
Project Input Section:
The user can add project entries.
Each project entry includes:
Project title input field (Placeholder: "Enter project title")
Organisation input field (Placeholder: "Enter organisation or institution name")
Duration of project input field (calendar format)
Link input field (Placeholder: "Enter project link")
Description input field (Placeholder: "Describe your project")
The user can add multiple projects via an "Add Project" option.
Frontend Requirement: Dynamic form fields for adding multiple projects.
Backend Check: Ensure each project entry is saved and retrieved correctly, supporting multiple entries.
Awards & Certifications Input Section:
The user can add awards and certifications entries.
Each entry includes:
Award title input field (Placeholder: "Enter award or certification title")
Institution input field (Placeholder: "Enter institution name")
Issued on input field (calendar format) (Placeholder: "Select date of issuance")
Credential link input field (Placeholder: "Add your Awards OR Certifications, upload a Google drive link")
The user can add multiple awards and certifications via an "Add Awards & Certifications" option.
Frontend Requirement: Dynamic form fields for adding multiple awards and certifications.
Support CRUD operations for user profile data.
Integration with external APIs for fetching organisation names and location suggestions.

User Story 10: Backend Data Management

Description: As a system, I need to manage datasets for areas of interest, skills, colleges, and locations to support the onboarding process.
Acceptance Criteria:
Backend maintains datasets for areas of interest and their associated skills.
Backend API supports college name search and addition.
Backend API supports location search and suggestions.
APIs to fetch and save user profile data.
API for organisation name suggestions.
API for location suggestions.
Store and manage multiple entries for professional experience, projects, and awards & certifications.
Ensure data consistency and integrity.
Handle bio, experience, project, and awards & certifications data inputs.
Profile Data Management:
CRUD operations for user profile data.
Endpoint to fetch and save bio, professional experience, projects, and awards & certifications.
External APIs:
Integration for fetching organisation names and location suggestions.

User Story 11: Frontend Profile Completion

Description: As a user, I want to see a visual representation of my profile completion progress and receive motivating prompts to encourage me to complete my profile, so I can increase my chances of being shortlisted for relevant opportunities.
Acceptance Criteria:
Progress Bar Display:
A progress bar is displayed prominently on all relevant screens (onboarding and profile section).
The progress bar accurately reflects the profile completion percentage based on the defined weightage system (mentioned below)
The progress bar updates dynamically and smoothly (with animation) after each relevant user input change ( noble to handle this)
Motivational Prompt Display:
A motivational prompt is displayed below the progress bar or in a designated area on the screen.
The prompt text changes dynamically based on the profile completion percentage
The prompt text encourages the user to complete their profile and highlights the benefits of doing so
Examples:
0-20%: "Your profile is just getting started. Let's complete it together!"
21-50%: "You're halfway there! Keep building your profile."
51-80%: "Almost done! Add a few more details to stand out."
81-99%: "Great job! Just a few finishing touches left."
100%: "Congratulations! Your profile is complete and ready to impress."
Backend Calculation:
The backend calculates the profile completion percentage accurately based on the finalized weightage system.
The calculation endpoint is triggered on page load and after each relevant user input change
The backend returns the calculated percentage to the frontend for display

User Story 12: Profile Completion Backend

Description: I want to implement a robust and efficient system to calculate and store user profile completion percentages, accurately reflecting the provided weightage system, so that the frontend can display this information to users and encourage them to complete their profiles
Acceptance Criteria:
Endpoint Implementation:
An endpoint is created to calculate and return the profile completion percentage.
The endpoint accepts the user's profile data as input in a specified format
The endpoint is accessible to authenticated users
Calculation Logic:
The backend accurately calculates the profile completion percentage based on the following weightage system:
Profile completion weightage
Field
Weightage (%)
Notes
1
pfp
10
2
email
20
3
bio
15
4
education
20
5
exp
20
6
projects
10
7
awards
5
There are no rows in this table

- The calculation considers: - Presence of each field in the user's profile. - Weightage of each field as per the table above. - Maximum caps for experience, projects, and awards & certifications ). - If the user adds more than 3 entries, the profile completion for each input will reach max with 3 on Backend ( wont restrict the user to feed more than 3 entries and BE saves and maps the data to the user )

Web-App Simplified login for Courses and Events

🧑🏻‍🎓Target Audience

Web app Traction (top of the funnel from all channels[Organic, smartDB, CAs etc)

❓Problem Statement

Currently, there is steady traction on the web app, but the six-step long onboarding hinders anonymous users from accessing the product offerings, i.e., Courses and Events, that do not require user profile information. Thus, a simplified signup flow is needed for users interested in the Courses and Events product offerings As a result, user engagement drops, and many users abandon the signup process.
Also Signup and Login buttons on the homepage for Programs and events - simplified login only when the user tries to join waitlist or register (bypass) & will redirect to the onboarding flow of the app

✅Why Do We Need to Solve This?

The extensive onboarding process is a barrier for users who are only interested in courses and events. By simplifying the signup flow for these offerings, we can:
Attract more users
Increase engagement
Reduce the number of users dropping out due to the lengthy signup process

🧐Key Objectives

Increase Engagement: Make it easier for users to sign up and access courses and events.
Reduce Drop-Off Rates: Minimize the required information upfront to keep users from abandoning the signup process.
Maintain Data Quality: Ensure the collected information is sufficient and accurate for future interactions.

🎯Metrics to be Affected

User Signups: number of new users via the new signup flow
Engagement Rates: courses page visit and time spent per session
Drop-Off Rates: page to page bounce rate, courses page visit to any user action churn rate
Screenshot 2024-05-29 at 11.53.32 AM (1).png

🙅🏻‍♀️Functional Requirements

User Access
Anonymous(logged out) users should be able to browse courses and events without full onboarding.
Whenever a logged out user tries to join the waitlist for courses he/she should get the simplified signup flow
whenever a logged out user tries to register for an event, he/she should get the simplified signup flow
OTP Verification
OTP input and verification to be in place with all case handlings for Users must receive an OTP on their provided mobile number
OTP must be verified before the user can proceed
Option to resend OTP if not received
BE and Corner Cases : BE sanity and handling of all edge cases and mapping the user joined from the simplied signup flow and the user joined from onboarding flow and also the user from cross platform that is the app
User flow →

All + Corner Cases for the Simplified Signup Process

ALL + CORNER cases

1. First-Time Users (New Users)

Case : First-Time User Accesses Course/Event Page
User tries to access a course or event page for the first time
Action: Display the simplified signup page
Case : First-Time User Completes Simplified Signup
User enters full name, mobile number, and email, receives OTP, and verifies it
Action: Account is created, and access is granted to the course/event

2. Existing Users (Logged Out)

Case : Existing User Tries to Access Course/Event
User who has previously signed up (full onboarding) tries to access a course/event
Action: Display login page(UI) instead of simplified signup

3. Users with Simplified Signup (Logged Out and Returning)

Case : User Who Completed Simplified Signup Logs Out and Returns
User who previously completed simplified signup logs out and tries to access a course/event again
Action: Prompt for (login screen UI) mobile number/email and OTP verificatiom
Detect existing account and prompt for login instead of new signup.

4. Duplicate Account Handling

Case : Mobile Number/Email Already Exists
User tries to sign up with a mobile number/email that is already registered
Action: Detect existing account and prompt for login

5. Post simplified - full onboarding

Case: User with Simplified Signup Trying Full Onboarding Later
User who completed simplified signup tries to complete full onboarding later
Action: Redirect to the full onboarding process with pre-filled known informatiom
BE checks and logics

1. First-Time Users

Case 1: First-Time User Accesses Course/Event Page
Check: Determine if the user is logged in or anonymous
Logic: If anonymous, redirect to simplified signup page
Case 2: First-Time User Completes Simplified Signup
Check: Validate full name, mobile number, email, and OTP.
Logic: Store user details, create a new user account, and set a session.

2. Existing Users (Logged Out)

Case : Existing User Tries to Access Course/Event
Check: Check if user exists in the database
Logic: If user exists, redirect to login page.
Case : Existing User Completes Login
Check: Validate login credentials (email/mobile number and password)
Logic: Authenticate user and set session

3. Users with Simplified Signup (Logged Out and Returning)

Case : User Who Completed Simplified Signup Logs Out and Returns
Check: Identify the user using mobile number/email.
Logic: Prompt for OTP verification.
Case : User Who Completed Simplified Signup Tries to Sign Up Again
Check: Detect existing account using mobile number/email.
Logic: Redirect to login page instead of signup.
similar checks for other cases (half journey on app half journey on webapp)

Consolidated Use case + User flow

Scenario:
Abhinav downloads Beep App on his smartphone after hearing about it from a friend.
He quickly registers using his mobile number and OTP.
He chooses to upload his resume to fasten the onboarding process.
Beep App's backend parses his resume and pre-fills relevant sections of his profile (skills, education, experience).
Abhinav sees a progress bar indicating his profile is 60% complete, with a motivational prompt encouraging him to complete it for better job matches.
He manually adds his areas of interest (Software Development, Web Development) and selects relevant skills (Java, Python, HTML/CSS).
He reviews his pre-filled education details and updates his current course name and duration
Abhinav indicates his preferred work location as "Hyderabad" and work mode as "Hybrid."
On the Profile Review screen, he notices the progress bar has increased to 85%, with a prompt reminding him to add a bio, projects, and awards for a complete profile.
Abhinav fills in his bio, adds a project he completed during college, and lists a relevant certification.
He sees the progress bar reach 100% and receives a congratulatory message.
Abhinav proceeds to browse internship opportunities, confident that his profile is well-represented and optimized for recruiters.
/USER FLOW
Landing Page/App Launch:
User opens the Beep App.
User is presented with a welcome screen or a call to action to create an account.
User Registration and Verification:
User enters their mobile number.
User receives an OTP via SMS.
User enters the OTP to verify their mobile number.
Optional: User enters a referral code and redeem 20 coins
Onboarding Options:
User is presented with three options:
Upload Resume
Upload LinkedIn Profile
Fill Manually
Path 1: Upload Resume:
User selects "Upload Resume."
User uploads a PDF resume.
Backend: Parses resume and extracts relevant data.
UI: Pre-fills profile fields with extracted data (user can edit)(Setup profile screen)
Proceed to Step : Area of Interest and Skills Selection
Next user flow same as manually filling with pre-filled info
Path 2: Upload LinkedIn Profile:
User selects "Upload LinkedIn Profile."
User authenticates with LinkedIn (or provides a LinkedIn profile URL - pending discussion)
Backend: Fetches and parses LinkedIn profile data
UI: Pre-fills profile fields with extracted data (user can edit).
Proceed to Step : Area of Interest and Skills Selection
Next user flow same as manually filling with pre-filled info
Path 3: Manual Profile Setup:
User selects "Fill Manually."
UI: Presents a form for user to input:
Profile picture
Name
Proceed to Step Area of Interest and Skills Selection
Area of Interest and Skills Selection:
User selects an area of interest.
UI: Displays recommended skills based on the chosen area.
User selects at least 3 skills (mandatory)
User can search and add additional skills
Education Details:
User selects their college from a dropdown (or adds a new one)
User enters course name and duration
UI: Prefills if data is available from resume or LinkedIn (optional)
Work Preference:
User selects work preference (WFH, In Office, Hybrid).
UI: If "In Office" or "Hybrid" is selected, a location preference field appears.
User searches and selects a preferred location.
Profile Review and Completion:
User reviews the pre-filled profile information.
User completes additional details:
Bio
Professional Experience (multiple entries)
Projects (multiple entries)
Awards & Certifications (multiple entries)
Profile Completion:
User confirms profile completion.
User is directed to the main app interface - Homepage opportunities

Functional Requirements

Functional requirements
User Registration and Verification : Functional Requirements:
Mobile number input field with validation
OTP generation and delivery via SMS
OTP input field with verification
Optional referral code input with validation (and backend referral code validity check)
Onboarding Options : Functional Requirements:
Clear presentation of three onboarding options (Resume, LinkedIn, Manual)
File upload functionality for resume (PDF only)
LinkedIn authentication or profile URL input (with backend validation)
Navigation to manual input form
Upload Resume
Resume parsing and data extraction (backend)
Error handling for unsupported file types or failed parsing
Prefilling of relevant profile fields
Editing capability for prefilled data
Upload LinkedIn Profile
LinkedIn authentication flow (error handling for failed authentication)
LinkedIn profile data fetching and parsing
Error handling for private or inaccessible profiles
Prefilling of relevant profile fields
Editing capability for prefilled data
Manual Profile Setup
Profile picture upload functionality (with size/format validation)
Name input field with validation
User Story 6: Area of Interest and Skills Selection
Functional Requirements:
Display of areas of interest in headers format
Selection functionality with highlighting
Display of recommended skills based on area of interest (from backend)
Skill search and selection from backend dataset
Minimum 3 skill selection requirement (with validation)
User Story 7: Education Details
Functional Requirements:
College selection from dropdown or manual addition (with backend validation/addition of new colleges)
Course name and duration input fields (mandatory)
Prefilling from resume/LinkedIn (optional)
User Story 8: Work Preference
Functional Requirements:
Work preference selection (radio buttons)
Conditional location input field
Location search and selection (from backend dataset)
User Story 9: Profile Review
Functional Requirements:
Display of pre-filled sections with editing capability
Bio input field (with character limit)
Dynamic form fields for:
Professional experience (multiple entries, with start/end date validation)
Projects (multiple entries, with link validation)
Awards & Certifications (multiple entries, with date validation)
User Story 10: Backend Data Management
Functional Requirements:
Datasets for areas of interest, skills, colleges, locations
APIs for:
College search and addition
Location search and suggestions
Profile data (CRUD operations)
Organization and location suggestions
Data validation for all API endpoints
User Story 11: Frontend Profile Completion
Functional Requirements:
Visual progress bar with dynamic updates and animations
Motivational prompts based on completion percentage (fetched from backend)
User Story 12: Profile Completion Backend
Functional Requirements:
Endpoint to calculate profile completion percentage (with authentication)
Calculation logic based on the provided weightage system (including caps)
Data storage for completion percentages
Error handling for invalid input data

Corner Cases & Future Scope


Future Scope:
User Story 1: User Registration and Verification: Implement social media login options (Google, Facebook, etc.).
User Story 6: Area of Interest and Skills Selection: Expand skill dataset based on user and industry trends.
User Story 9: Profile Review:
Enable video resume uploads
Allow users to showcase their work portfolio (e.g., GitHub, Behance links)
User Story 11: Frontend Profile Completion:
Gamify the profile completion process with rewards (e.g., badges, coins)
Integrate with job recommendations based on profile completeness.
User Story 12: Profile Completion Backend:
Refine weightage system based on user data and recruiter feedback.
Use AI/ML to suggest profile improvements for better job matches.

Flow Chart

Wireframe/Mockup

Load content from app.visily.ai?
Loading external content may reveal information to 3rd parties. Learn more
Allow

Events sheet

Events to be done by Noble post making of the Product Design

❓ Any Questions / Suggestions?

please put up comments in each section if you have specific questions regarding any section of the PRD

CORNER CASES FOR SSO LOGIN
@Ayush Rajguru

SSO Flow
Landing Page (Signup/Signin):
Clear options for:
Mobile number input (new users, possibly existing users)
SSO login (Google, Facebook)
Mobile Number Input:
If new user: Proceed to onboarding flow.
If existing user: Verify number, proceed to home page.
SSO Login:
Successful login: Redirect to mobile number input.
If new number: Proceed to onboarding.
If existing number: Verify, check for account conflicts (see below), proceed to home page
Edge Cases and Account Conflicts
SSO Email and Mobile Mismatch:Scenario: User logs in with Gmail1, enters Number1. Later, they log in with Gmail2, but still enter Number1
Action:
Allow, but present a prominent message: "This number is already associated with another account (Gmail1).
Switching Between SSO and Mobile Login:
Scenario: User creates an account with their mobile number. Later, they try to log in with SSO (same email)
Action:
Link the SSO account to their existing mobile account
Potential issue: Data merging if the user had separate profiles for each login method, and then it redirects directly to the homepage
Mobile Number Reuse:
Scenario: User creates an account with Number1, then deletes their account. Later, a new user tries to sign up with Number1.
Action: Allow the new user to sign up with Number1. The previous account is gone
Number Verification Errors:
Scenario: Typos, wrong country code, failed SMS delivery
Action: Clear error messages, retry options, customer support contacts
SSO Account Linking Conflicts:
Scenario: User A logs in with Google Account 1 and links it to Phone Number 1. User B logs in with Google Account 2 and tries to link it to Phone Number 1 (which is already linked to User A's Google Account 1).
Action: Prevent linking, show an error message indicating that the phone number is already linked to another account.
SSO Provider Merges Accounts:
Scenario: User logs in with Google Account gmail1 and links it to Phone Number 1. Later, Google merges Account 1 with another Google account that the user owns (gmail2)
Action:
Upon the next login, detect the merged account, and notify the user that their Google account has changed to gmail2
Allow the user to relink the new merged account to the existing Phone Number 1
Potential Issue: If the user had different data associated with the two Google accounts, you'll need to decide how to merge or prioritize that data
SSO Provider Deactivates Account:
Scenario: user deletes the account
Action:
Treat it as a new user
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.