AI Resume Screener
Product & UX/UI Designer
Figma
2 weeks
Problems
Reviewing and ranking hundreds of resumes is time-consuming, repetitive, and costly for recruiters, especially when evaluating candidates against specific job criteria.
Reviewing and ranking hundreds of resumes is time-consuming, repetitive, and costly for recruiters, especially when evaluating candidates against specific job criteria.
Solution
An AI-powered resume screening tool that evaluates candidates against predefined job criteria, ranks them by match score, and provides a candidate-level analysis to support faster and more consistent screening decisions.
An AI-powered resume screening tool that evaluates candidates against predefined job criteria, ranks them by match score, and provides a candidate-level analysis to support faster and more consistent screening decisions.
My contribution
I designed the end-to-end UX and product experience , including market research, user flows, interaction design, and UI design. I conducted user testing with 6 recruiters to validate key workflow decisions and translated those insights into an AI-powered candidate screening experience and landing page.
I designed the end-to-end UX and product experience , including market research, user flows, interaction design, and UI design. I conducted user testing with 6 recruiters to validate key workflow decisions and translated those insights into an AI-powered candidate screening experience and landing page.
Possible Improvements
ATS integration to sync candidate data and streamline resume screening.
AI-assisted job description generation to help recruiters define screening criteria faster.
ATS integration to sync candidate data and streamline resume screening.
AI-assisted job description generation to help recruiters define screening criteria faster.
Design Process
Market Research
I conducted a competitive analysis of several free resume screening tools to identify common patterns, user expectations, and opportunities for improvement. Key findings included allowing users to upload resumes manually, providing a clear job-match score, and offering actionable feedback on how candidates could improve their alignment with the job criteria. I used these insights to inform the user flow and core product experience of the AI Resume Screener.
I also reviewed common file upload patterns across different products to explore how cloud storage options could be incorporated into the experience. This research informed my decision to position Google Drive and Dropbox as secondary upload options beneath the drag-and-drop area, keeping the primary upload action prominent while still supporting alternative recruiter workflows.
In a later market review, I identified more advanced solutions that integrated directly with Applicant Tracking Systems (ATS) to sync candidate data and reduce the manual work of downloading and uploading resumes at scale. Based on this research, I added ATS integration to the product backlog as a potential future enhancement to streamline the recruiter workflow.
I conducted a competitive analysis of several free resume screening tools to identify common patterns, user expectations, and opportunities for improvement. Key findings included allowing users to upload resumes manually, providing a clear job-match score, and offering actionable feedback on how candidates could improve their alignment with the job criteria. I used these insights to inform the user flow and core product experience of the AI Resume Screener.
I also reviewed common file upload patterns across different products to explore how cloud storage options could be incorporated into the experience. This research informed my decision to position Google Drive and Dropbox as secondary upload options beneath the drag-and-drop area, keeping the primary upload action prominent while still supporting alternative recruiter workflows.
In a later market review, I identified more advanced solutions that integrated directly with Applicant Tracking Systems (ATS) to sync candidate data and reduce the manual work of downloading and uploading resumes at scale. Based on this research, I added ATS integration to the product backlog as a potential future enhancement to streamline the recruiter workflow.
Recruiter Interviews
I asked 6 recruiters "Is it better to start by setting up the job description or by uploading resumes? Or is there an alternative workflow you'd recommend?"
Result: It’s a tie.
Upload resumes
The moment I first opened the screen, it gave the impression of being easier to use. I can just drag and drop the CV directly. Since the other one requires entering content, it felt more complicated to use.
Senior Recruiter
I conducted user testing with 6 recruiters to validate the starting point of the resume screening workflow. Participants were evenly split between defining the job criteria first and uploading resumes first.
The results showed that there was no dominant user preference, so the research alone could not determine the final flow. I therefore made a product design decision to prioritize job criteria setup as the first step, establishing the criteria before candidates entered the screening process.
I conducted user testing with 6 recruiters to validate the starting point of the resume screening workflow. Participants were evenly split between defining the job criteria first and uploading resumes first.
The results showed that there was no dominant user preference, so the research alone could not determine the final flow. I therefore made a product design decision to prioritize job criteria setup as the first step, establishing the criteria before candidates entered the screening process.
Drafts
These early design explorations focused on three key areas: the analysis screen, opportunities to convert tool users into Jotform users, and the file upload experience.
I created and compared multiple layout alternatives for the upload area, exploring different ways to position Google Drive and Dropbox integrations alongside manual file upload. These iterations helped refine the information hierarchy, interaction flow, and overall usability before moving into the final design.
These early design explorations focused on three key areas: the analysis screen, opportunities to convert tool users into Jotform users, and the file upload experience.
I created and compared multiple layout alternatives for the upload area, exploring different ways to position Google Drive and Dropbox integrations alongside manual file upload. These iterations helped refine the information hierarchy, interaction flow, and overall usability before moving into the final design.
Final
I based the overall structure of the AI Resume Screener on Jotform’s established tool design framework, creating consistency with other tools across the product ecosystem. I reused existing design system components and foundations, including typography, buttons, icons, spacing, and layout widths. However, the existing file upload pattern did not fully support the requirements of this workflow, so I designed a custom file upload experience specifically for the Resume Screener while keeping it visually consistent with the broader Jotform design system.
The final experience starts with recruiters defining the job criteria, followed by adding candidate resumes through local upload, Google Drive, Dropbox, or direct links. I designed these input options to support different recruiter workflows and reduce friction when sourcing candidate files across platforms.
After selecting Start Screening, the AI evaluates each candidate against the job criteria and generates an estimated match score and detailed analysis. A skeleton loading state communicates progress while results are processed. Candidates are then ranked from highest to lowest match, with color-coded score ranges to improve scannability. Recruiters can expand each result to review the analysis, copy it, or reopen the original resume or website for comparison.
Beyond the core workflow, I designed product-led growth, account-limit, and error states for guest and registered users. These included contextual sign-up and upgrade touchpoints, file-size recovery through Jotform PDF Compress, invalid-link feedback, AI processing errors, and hourly rate limits to reduce abuse and support service reliability.
I based the overall structure of the AI Resume Screener on Jotform’s established tool design framework, creating consistency with other tools across the product ecosystem. I reused existing design system components and foundations, including typography, buttons, icons, spacing, and layout widths. However, the existing file upload pattern did not fully support the requirements of this workflow, so I designed a custom file upload experience specifically for the Resume Screener while keeping it visually consistent with the broader Jotform design system.
The final experience starts with recruiters defining the job criteria, followed by adding candidate resumes through local upload, Google Drive, Dropbox, or direct links. I designed these input options to support different recruiter workflows and reduce friction when sourcing candidate files across platforms.
After selecting Start Screening, the AI evaluates each candidate against the job criteria and generates an estimated match score and detailed analysis. A skeleton loading state communicates progress while results are processed. Candidates are then ranked from highest to lowest match, with color-coded score ranges to improve scannability. Recruiters can expand each result to review the analysis, copy it, or reopen the original resume or website for comparison.
Beyond the core workflow, I designed product-led growth, account-limit, and error states for guest and registered users. These included contextual sign-up and upgrade touchpoints, file-size recovery through Jotform PDF Compress, invalid-link feedback, AI processing errors, and hourly rate limits to reduce abuse and support service reliability.
Mobile Designs
To ensure a responsive experience across devices, I adapted the AI Resume Screener for mobile using the full-screen interaction pattern already established across other Jotform tools. This helped maintain consistency across the product ecosystem while keeping the screening workflow focused and easy to navigate on smaller screens.
To ensure a responsive experience across devices, I adapted the AI Resume Screener for mobile using the full-screen interaction pattern already established across other Jotform tools. This helped maintain consistency across the product ecosystem while keeping the screening workflow focused and easy to navigate on smaller screens.
Landing Page
I designed the landing page using a reusable Jotform tool template that I had previously created. The template was later adopted by other designers and is used across multiple Jotform tool projects, helping create a more consistent and scalable design approach across the product ecosystem.
The page introduces the AI Resume Screener through a clear three-step product walkthrough and highlights key benefits such as AI-powered candidate screening and time savings for recruiters.
I also added a contextual banner promoting Jotform Workflows to create a relevant cross-product entry point for HR-focused users. To support consistency and scalability, I created reusable visual components for the landing page imagery.
I designed the landing page using a reusable Jotform tool template that I had previously created. The template was later adopted by other designers and is used across multiple Jotform tool projects, helping create a more consistent and scalable design approach across the product ecosystem.
The page introduces the AI Resume Screener through a clear three-step product walkthrough and highlights key benefits such as AI-powered candidate screening and time savings for recruiters.
I also added a contextual banner promoting Jotform Workflows to create a relevant cross-product entry point for HR-focused users. To support consistency and scalability, I created reusable visual components for the landing page imagery.
Other Works
