Case study · AI hiring platform · UX/UI · College project

First Step

Designing where human insight meets machine imagination, from Mumbai.

Hiring that finally tells you where you stand.

An AI hiring platform for Indian startups and freshers: clear status for candidates, a calmer shortlist for recruiters, and a human in every final call.

All projects
Two people looking at the First Step website on a big monitor
Role
Solo UX/UI Designer · research to prototype
Project
College UX studio project · AI + HR tech
Platforms
Web app (HR + candidates) · mobile
Tools
Figma, Illustrator, Canva + AI tools

01 · Overview

Two people on one platform, both waiting.

A fresher sends fifty applications and hears nothing back. A founder opens five hundred resumes and finds ten worth reading. First Step puts both of them in one place and replaces the silence with status, feedback and fit.

What I designed

  • AResearch: desk study, survey, interviews, personas
  • BJourney maps, HMW, SCAMPER and MoSCoW
  • CInformation architecture for three roles
  • DBrand: logo, colour, type, ID cards
  • EHR workspace, candidate app, Lumi AI assistant
  • FClickable prototype in Figma

How I worked · double diamond

01 · Discover

Understand the mess

  • 3 research papers
  • Market data
  • 8 competitors
  • Survey · 21
  • Interviews
02 · Define

Name the real problem

  • 4 personas
  • Empathy maps
  • Affinity map
  • Thematic analysis
  • HMW
03 · Develop

Shape the answer

  • SCAMPER
  • MoSCoW
  • Journey map
  • IA
  • Wireframes
04 · Deliver

Make it real

  • Brand
  • UI system
  • Prototype
  • Usability tests
  • Iteration

02 · The problem

Hiring works like a black box.

Candidates0%

want feedback after a rejection, and almost never get it.

Candidates0%

sit through long delays with no update at all.

Recruiters0%

of 500+ applications per role are not relevant.

Founders0h

a day lost to hiring: 2 to 4 hours, away from the product.

For freshers

  • Ghosting and no feedback loop
  • Fake postings and “training fee” scams
  • “Entry level”, but 2–3 years required
  • Hidden salary, vague job roles

For recruiters & startups

  • Volume overload, mostly irrelevant
  • AI matching that shows “random profiles”
  • Scheduling takes longer than interviews
  • Culture fit is a guess

From my survey (21 responses) and interviews with freshers, HR and startup founders.

03 · Research

Five ways of listening.

03Research papers

Startup hiring, tech hiring, AI vs human screening.

08Platforms studied

LinkedIn, Naukri, Internshala, Greenhouse, Lever…

21Survey answers

14 questions on trust, delays and feedback.

04Interview groups

Freshers, HR, freelance interviewers, startups.

02Screen audits

Every step of applying on LinkedIn and Internshala.

Startup workforce in India

250K
590K
53%
41%
Workforce 20212025Fresher share 20242025

The startup workforce grew 136%, yet the share of fresher hires fell from 53% to 41%. More jobs, fewer first chances.

Where hiring happens today

LinkedIn45%
Naukri25%
Referrals15%
Others15%

Half the market sits on one network built for volume. Referrals give the best hires but reach the fewest people.

Competitive landscape

LinkedIn

Massive network, rich profiles

Overcrowded, poor matching, ghosting culture

Naukri

Reach across India

Fake postings, spam, dated UX

Hirect

Startup focus, direct chat

Spam messages, weak matching

Internshala

Trusted by students

Entry level only, few tools for HR

The gapNobody owns feedback, transparency and bias reduction. That became First Step’s job.

From the papers

AI screens resumes about 70% faster, but rejects people with non-traditional backgrounds about 18% more often. The answer is not AI or humans: it is AI for the volume, people for the decision.

From the survey

The loudest wish was not a smarter search. It was “tell me what happened”: a status, a reason and one thing to improve.

04 · Users

The four people I designed for.

Candidate
RG

Raj Gupta

23 · Data analyst fresher · Mumbai
Why won’t anyone tell me why I was rejected?
Wants
Skill-based shortlisting, clear roles and pay
Fights
Vague JDs, the experience barrier, ghosting
Candidate
SS

Suva Sasmal

22 · Banking fresher · Mumbai
Is this really a banking job, or insurance sales?
Wants
Verified, scam-free listings with real salaries
Fights
Role mismatch, hidden pay, fee scams
Recruiter
LR

Laxmi Roy

38 · Talent acquisition lead · Pune
Drowning in resumes, but starving for talent.
Wants
Pre-screened candidates, quick feedback tools
Fights
Irrelevant volume, no time to reply
Startup
JS

Jatin Sehrawat

32 · Startup consultant · Gurgaon
The problem isn’t finding candidates. It’s finding the right match.
Wants
Accurate matching, culture-fit signals
Fights
Premium prices for irrelevant profiles

Empathy maps: what they say vs. what they feel.

Says

Thinks

Does

Feels

05 · Synthesis

Every note, six patterns.

I wrote every quote and number on its own note, then grouped them until the themes named themselves. A few from each group:

01Communication & transparency

  • “Nobody tells me why I was rejected”
  • Radio silence for weeks

02Time & efficiency drain

  • Founders spend 2–4 h a day hiring
  • Scheduling takes longer than interviewing

03AI & platform ineffectiveness

  • “Random, unqualified profiles despite premium costs”
  • 500+ applications, 90% irrelevant

04Culture fit & team

  • Skilled hires who don’t fit the culture
  • Hard to judge real skills from a resume

05Trust & verification

  • Fake postings asking for training fees
  • Fake resumes, misrepresented skills

06Bias & evaluation

  • Non-traditional backgrounds filtered out
  • Different standards per interviewer

The problem, redefined

Both sides lose time and trust because hiring is a black box. Candidates need status and a reason; recruiters need fewer, better matches they can act on fast.

How might we…

  1. track every application in real time, so no one feels ghosted?
  2. pre-screen so startups only see genuinely relevant people?
  3. make job posts match the real role and pay?
  4. end the back-and-forth of interview scheduling?
  5. turn a rejection into a next step for the candidate?
  6. verify both sides, so every profile and post is real?

06 · User journey

Where it hurts today, and how it should feel.

I mapped both journeys on existing platforms, step by step, then redesigned every stage. Tap a stage to see the pain, my answer, and the number it should move.

TodayWith First Step
CONFIDENTFRUSTRATED
Pain today

My answer

What it should move

Curves are illustrative, drawn from the feelings recorded in the journey maps (overwhelmed, sceptical, anxious, impatient).

07 · Ideation & priorities

Many ideas, then a hard no to most of them.

SCAMPER on today’s hiring

SSubstitute

Resume filters → AI skill checks

CCombine

Hiring + upskilling + feedback

AAdapt

E-commerce style verification

MModify

Interviews that ease anxiety

PPut to use

Data → career plans

EEliminate

Fake profiles and scam posts

RRearrange

Screen → fit → technical

MoSCoW · what makes the first version

Must MVP

  • Real-time application tracker
  • Verified profiles & companies
  • AI matching engine
  • Structured communication
  • Transparent job listings

Should next

  • AI interview scheduler
  • Feedback after every round
  • Anonymous first screen
  • Hiring pipeline metrics

Could later

  • Upskilling partners
  • Team hiring workflows
  • Diversity dashboard
  • Onboarding suite

Won’t for now

  • Full employee lifecycle
  • Multi-language platform
  • Salary benchmarking

08 · Information architecture

One door, three workspaces.

The landing page splits people in one click: hire talent or browse jobs. After that, each role only sees what it needs, and Lumi, the AI assistant, sits in the same corner everywhere.

First Step
Public siteEveryone
  • Hero searchHire talent · Browse jobs
  • Get hired · Hire talent
  • Community · Mentorships
  • Internship · Services
  • Sign up · Log in
HR workspaceRecruiters & founders
  • OnboardingPersonal → company → verify → preview
  • DashboardApplied, invited, hired, today’s interviews
  • Open hiringPost a job or internship, salary & perks
  • Candidates · Interviews · Talent pool
  • Messages · Reports & analytics
  • Lumi AIJob analyzer, resume screener
Candidate appFreshers & students
  • OnboardingCV → details → experience → skills
  • DashboardApplied → screened → shortlisted → interviewed
  • Open jobsJob detail, AI summary, apply
  • My applications · Saved jobs
  • Community · Practice
  • Lumi AIJob match, interview prep, resume help
Team workspaceInterviewers & panel
  • Employee log in
  • DashboardReviews, interviews, calendar
  • Request an interviewBy role, skill and seniority
  • Add candidate
  • Interview roomVideo + hiring-criteria rubric
  • Scheduling · Reporting

User flows · merged into one

One entry, three journeys that meet.

In Figma these were separate diagrams. Here they are one flow: everyone enters through the same door, and the three journeys hand work to each other where the dotted lines cross.

Platform entryWho are you?

EnterpriseFirst Step hires for you

  1. Client signs up
  2. Requirement analysis meeting
  3. Define role & culture fit
  4. First Step handles everything
  5. AI sourcing & screening500+ applications→ sources candidates
  6. Technical assessmentsskills verified
  7. First Step interviewsculture assessed
  8. 3–5 pre-vetted candidates
  9. Client interviews finalists
  10. Hire best fit
  11. 90-day guarantee

CandidateFreshers & students

  1. Sign up
  2. Profile completionCV import, AI summary
  3. Skill verification
  4. Browse jobs
  5. Apply in one click→ reaches the company
  6. Track application
  7. Application status
  8. Under reviewStatus: under review
    ShortlistedStatus: shortlisted
  9. Interview scheduled
  10. Interview completed
  11. Offer decision
  12. OfferAccept / decline
    RejectedFeedback provided
  13. Skill-gap analysis
  14. Learning recommendations
  15. Career growth

Company / HRStartups hiring themselves

  1. Company registration
  2. Verification
  3. Profile setup
  4. Create job postAI description helper
  5. Salary shown up front
  6. Publish job
  7. Receive quality applications
  8. AI pre-screening
  9. Shortlist & bulk updates
  10. Schedule & conduct interviews
  11. Structured evaluation
  12. Decision
  13. RejectAuto-feedback→ back to the candidate
    HireSend offer → onboarding
  14. Talent pool for later
  15. Data-driven hiring
AI stepGood outcomeHand-off between journeys
RULE 01

Progressive onboarding

Sign-up asks for three things. Company details and verification come step by step, with a progress line on top.

RULE 02

Status before search

A candidate’s home opens on where each application stands, not on more jobs to apply to.

RULE 03

AI in one place

Lumi lives in the sidebar: same entry point, same tone, whether you hire or apply.

09 · Mood board & inspiration

Calm like a bank, warm like a mentor.

The mood board started with people, not interfaces: the rejection letter with no reason, the fresher lost between job posts, the recruiter buried in tabs. First Step had to feel like the opposite of these moments.

From this… to this

IgnoredConfusedOverwhelmedPressured
ClearTrustworthyOptimisticHumanFair

How users feel today

A candidate shocked by a rejection letter
Rejected, no reason
A new hire being shouted at by a manager
Pressure, no clarity
A confused student between piles of books
Which job is real?
A recruiter overwhelmed by reports, deadlines and calls
Buried in hiring work
An employee carrying a box with an I quit sign
A bad fit that ends early

UI inspiration · what I took from each

Inspiration: a soft-card profile dashboard
Soft cards, one colour each · became the candidate dashboard
Inspiration: an AI interview app with video scores
AI scores as plain bars · became Lumi’s insights and the interview room
Inspiration: a teacher profile with a booking panel on violet
Profile + action panel on violet · became the job detail and the brand stage
Inspiration: a clean chat and meeting app
Chats like a messaging app · became recruiter chats

10 · Wireframes

Grey boxes first, colour last.

I wireframed the landing page, the HR workspace, the candidate flow and the collaboration screens in low fidelity, tested the flow, then moved to visuals only once the structure held.

Wireframe of the full landing page, top to bottom
Landing page · the whole scroll, low fidelity
Wireframe of the candidate dashboard with mock-test practice and mentors
Candidate · dashboard, mock tests, practice interview
Wireframe of the team workspace: request an interview by role
Team · request an interview by role
Wireframe of the Go Plus checkout for recruiters
HR · Go Plus checkout, the price always visible

11 · Branding

An F made of two steps.

The name is a promise to freshers: your first step into work. I explored a person inside a search pin and a focus ring, then kept the simplest idea: two rounded bars that read as an F and as stairs, with a small person at the bottom, about to climb.

Why blue and violet: blue is the colour people already trust with money and careers; a warm violet keeps it from feeling like a bank. Tall, condensed headlines give the product a confident voice in very little space.

Explore 1 · Pin

Logo exploration: a person inside a search pin

Finding the right person

Clear, but it looked like every job portal.

Explore 2 · Ring

Logo exploration: a person in a focus ring

Focus on people

Friendly, but no story of growth.

Final · Steps

Final logo: an F made of two rounded bars

An F that climbs

Reads as a letter, as stairs and as progress bars.

Lockup

The full First Step lockup on a dark blue poster

Mark + person + name

The full lockup for splash screens and posters.

Colour

Step Violet#5F5AFE · headlines, actions
Trust Blue#1F5BFF · the mark
Night#0D1A4A · Lumi, depth
Mist#E9EDFF · panels
Paper#FFFFFF

Typography

HeadlinesAaAnton

Start Building Your Future

Tall and condensed: big words in little space
Interface textAaCondensed sans

Labels, forms and dashboards stay light and narrow, so dense screens still breathe.

Light for reading · Medium for labels
First Step team ID cards on blue lanyards
Brand in use · team ID cards
Hands holding a phone with the Lumi AI screen, on blue
Lumi on the phone · night blue
Hands holding a phone with the Lumi AI screen, on violet
Same screen · violet stage

12 · Final UI

Three flows, one clickable prototype.

Every screen below is from the Figma prototype you can open at the end of this page.

The landing page

Pick a side in one click.

Keep scrolling: the page runs inside the frame. Real faces first, then the vision, Lumi, why First Step, and the way in for both sides.

firststep.app
The full First Step landing page

Flow 01 · HR workspace

From sign-up to a live job in seven screens.

Sign-up asks for three fields. The company comes next, then verification (website, LinkedIn page or documents), so fake employers never reach a fresher.

The dashboard answers the recruiter’s first questions at a glance: how many applied, who is invited, who got hired, and which interviews are today.

Scroll · the HR flow

01 / 07
HR sign up: Start building your future
01 · Sign up in three fields
HR onboarding: personal details with progress steps
02 · Personal details
HR onboarding: company details and verify your company
03 · Company + verification
HR onboarding: mobile number verified
04 · Verified, ready
HR dashboard with totals, job summary, analytics and today’s interviews
05 · Dashboard
Lumi AI assistant inside the HR workspace
06 · Lumi AI for recruiters
Post a job or internship: job details, salary and perks
07 · Post a job, pay shown up front

Flow 02 · Candidate app

A profile that builds itself, a status you can always see.

Upload a CV and the profile fills in; Lumi drafts the summary. The dashboard is a pipeline, so a fresher always knows if they were screened, shortlisted or interviewed.

Candidate onboarding: upload your CV
Upload a CV
Candidate onboarding: work experience with Generate AI summary
Generate an AI summary
Candidate onboarding: hard and soft skills
Skills & portfolio
Candidate dashboard: applied, screened, shortlisted, interviewed
Dashboard · applied → screened → shortlisted → interviewed, at a glance
Open jobs grid with company cards
Open jobs · filters by industry, location, type, level
Job detail with summarize this job and a match score
Job detail · “Summarize this job” and the skills that match

Lumi · the AI assistant

One assistant, two jobs.

For recruiters Lumi analyses job descriptions, screens resumes and turns interviews into notes. For candidates it finds matching jobs, coaches interviews and improves the resume. Same orb, same place, same calm voice.

Job match finderInterview prepResume optimizerSmart resume screener
Lumi AI home for candidates with three suggestions and an input
Lumi for candidates

Flow 03 · Team workspace

Hiring is a team sport.

Interviewers log in with an employee ID. They request interviews by role and seniority, add candidates, and run the interview with the hiring criteria beside the video, so every panel judges against the same rubric.

Team dashboard with applications, reviews and an interview calendar
Team dashboard · the day’s interviews on one calendar
Request an interview for an existing profile, by skill
Request an interview · pick the role and skill
Select seniority for the interview
Seniority · internship to staff
Interview room with video and the hiring criteria rubric
Interview room · the rubric sits next to the call

Mobile

The same calm, in your pocket.

First Step mobile: Lumi AI home
Lumi home
First Step mobile: home with stats, suggested jobs and First Step Campus
Home · status first
First Step mobile: PayPal Junior UI/UX Designer job detail
Job detail · summarize with Lumi
First Step mobile: chats with recruiters
Chats with recruiters
A hand holding a phone with the Lumi AI home
Ask Lumi anything
Two hands holding a phone with the First Step home feed
The home feed
Two hands holding a phone with PayPal’s open jobs
A company’s open jobs
A hand holding a phone with the chats screen
Talking to recruiters

13 · Usability testing

Tested with both sides, then simplified.

Candidates were asked to

  • 01Apply to a job from scratch
  • 02Find where an application stands
  • 03Read and act on feedback
  • 04Decide if a company is genuine

Recruiters were asked to

  • 01Post a job and screen the shortlist
  • 02Send status updates in bulk
  • 03Book an interview for a panel
  • 04Read the hiring dashboard

What changed after testing

ITERATION 01

Plainer status words

“Screened”, “Shortlisted”, “Interviewed”: no HR jargon on the candidate side.

ITERATION 02

Feedback that feels personal

Skill gaps and one next step, not a generic rejection.

ITERATION 03

Faster bulk actions for HR

Fewer clicks to update many candidates at once.

How success is measured

4h→1hRecruiter hiring time a day · target
0Applications left without a status · goal
1Shared rubric for every interview panel

14 · Toolkit

The tools behind each step.

Figma

UI + prototype

Why: one file for wireframes, components and the clickable prototype, so testers could tap through real flows.

Here: 3 flows, 27 prototype screens, the research boards and the journey maps.

HR dashboard, designed in Figma
Candidate dashboard, designed in Figma
Team dashboard, designed in Figma

Adobe Illustrator

Brand craft

Why: a logo has to hold from a favicon to a poster, so I drew every option as vectors.

Here: the three logo directions, the final F mark and its lockup, icons.

Logo exploration
Logo exploration
Final logo

Canva

Research & story

Why: fast, clean layouts for the parts people read rather than tap.

Here: survey charts, persona sheets and the presentation of the research.

ChatGPT

Mockups & drafts

Why: to see the brand in the real world before it exists, quickly.

Here: the desk scene, the phone-in-hand shots, the logo on glass and the ID cards.

Desk scene mockup
Phone mockup
ID card mockup

DeepSeek

Flow diagrams

Why: turning a written flow into a diagram in seconds, so I could check it before drawing it properly.

Here: first drafts of the user flows behind the information architecture.

15 · Outcome & impact

Less guessing, on both sides.

0Connected flows
0+Prototype screens
0Personas
0Survey responses
IMPACT 01

Transparency end to end

Every application has a visible status and a timeline.

IMPACT 02

Lighter recruiter workload

AI pre-screening and ranking, with a human making the call.

IMPACT 03

Feedback, not silence

Structured feedback after rejections, with a next step.

IMPACT 04

Confidence for freshers

Real-time updates and interview practice with Lumi.

IMPACT 05

Trust by default

Verified companies and clear pay before anyone applies.

IMPACT 06

One ecosystem

Students, colleges, mentors and companies on one platform.

16 · Reflection

What this project taught me.

LESSON 01

The real problem was silence

I expected “better search”. Research said “tell me what happened”.

LESSON 02

AI for volume, people for decisions

Trust grows when the AI explains itself and a human signs off.

LESSON 03

Design for two users at once

Every candidate feature needed a recruiter action behind it.

See the full project

Next project · 05 / 06

Vow