Design Assignment

Candidate Screening

A recruiter dashboard designed for the UI/UX Design Intern assignment at Nuvama Wealth. The challenge was to help hiring teams review hundreds of candidates faster without losing important portfolio context.

  • Design Assignment
  • Product Design
  • Dashboard
  • Recruitment
  • B2B SaaS
The Candidate Screening dashboard — a Hiring Console sidebar, a header reading 'Candidate Screening · Product Designer · Design Hiring Team' with counts for total candidates, under review and shortlisted, a search field above Experience, Location, Industry, Skills, Status and Seniority filters, and below them a list of structured candidate rows, each showing a match strength, years of experience, skill tags, a work sample and a Shortlist action
01 The Assignment

What the brief asked for

Background

The design team is hiring and has hundreds of designer applications to get through. Each one arrives as a resume, a portfolio link and a scatter of experience markers. They needed one central dashboard to filter, sort and shortlist against several criteria at once.

Problems to solve

  1. 01Overloaded profiles

    Too much unstructured information to find the qualifications that matter.

  2. 02Inconsistent skills

    Every resume words the same skill differently, so nothing compares.

  3. 03No portfolio context

    Projects rarely say what the candidate actually did, so screeners guess.

  4. 04Buried experience

    Domain experience like design systems or fintech means digging through resumes.

  5. 05Invisible visual quality

    No design samples in the profile, so judging craft takes extra steps.

  6. 06No cue for fit

    Nothing shows how closely a candidate matches the role criteria.

The goal

Design a dashboard UI that lets the design team solve all six.

02 Approach

Designing for how recruiters actually review candidates

Compare first. Read later.

Recruiters rarely evaluate one person in isolation. They compare multiple applicants quickly, looking for patterns before reading details.

Traditional cards waste space, while spreadsheets remove portfolio context.

I designed a structured list that combines the speed of a table with enough visual information to judge design experience, skills and real work at a glance.

Candidate row
One candidate row from the list, read left to right — initials and a three-dot 'Strong Match' indicator beside the name and current title, then years of experience, seniority, location and notice period, then core and supporting skill tags with industry labels, then a work sample thumbnail with its outcome, and finally the review status and a Shortlist action

Keep recruiters in context.

Opening a separate profile for every candidate breaks flow and resets scroll position.

Instead, I designed a side panel that lets recruiters inspect one candidate while keeping the list visible underneath.

Closing one profile and opening the next becomes almost effortless.

Side panel, open over the list
The dashboard with a candidate's side panel open on the right — the panel shows '1 of 6' with up and down arrows and a Close control, while the candidate list stays visible and in place behind it
03 Process

From Structure to Interface

Wireframe
The dashboard wireframe — a grey block layout: sidebar with navigation items, a 'Recruiter View' header with three stat blocks, a search bar with filter pills, and a stack of full-width candidate rows below
High fidelity
The same dashboard in high fidelity — the identical layout resolved into real type, real candidate data, match indicators, skill tags, work samples and Shortlist actions

The information hierarchy was settled in wireframes first — what a recruiter needs, and in what order. Only once that held did typography, spacing and interaction details get refined.

04 Side Panel

Information follows the recruiter's decision process

The full panel
The full candidate side panel, top to bottom — a header with the candidate's name, match strength and Shortlist, Hold and Reject actions; a quick summary with strengths beside watch-outs; featured products with their outcomes; skills split into core and supporting across design, tools and industry; a short experience timeline; a resume block with auto-extracted highlights; and contact details with internal recruiter notes

  1. Header

    Name, match strength, seniority and location — with Shortlist, Hold and Reject already in reach. The decision never waits for a scroll.

  2. Quick Summary

    One honest sentence, then strengths set against watch-outs. The recruiter gets the verdict before the evidence.

  3. Featured Projects

    Real work with the outcome attached, and the candidate's actual role named — so contribution is read, not guessed.

  4. Skills

    Core separated from supporting, in one shared vocabulary across design, tools and industry. This is what makes two candidates comparable.

  5. Experience

    A short timeline — role, dates, duration. Enough to see a trajectory, not a second resume.

  6. Resume

    Auto-extracted highlights sit above the document, so the full PDF is opened by choice rather than by default.

  7. Contact & Notes

    Email, portfolio and links last — next to internal notes, which turn one person's screening into a team decision.

05 Tooling

AI in the Design Process

ChatGPT was used as a thinking partner throughout the assignment.

It helped challenge assumptions, discuss recruiter workflows, explore trade-offs and validate reasoning — the kind of back and forth I'd otherwise have with a colleague.

The interface, wireframes, interaction patterns and final decisions were designed manually in Figma.

06 Next

What I'd Improve Next

The assignment answers the brief. The product wouldn't stop here.

  • Color-coded hiring stages
  • Saved recruiter views
  • Bulk candidate actions
  • AI-assisted candidate summaries
  • Recruiter collaboration and notes
  • Keyboard shortcuts for reviewing candidates faster