UX/UI · 2024 · WEB APP · MVP

AI CV Enhancer

personalise your CV with AI and match it to the job offer

ROLE

UI designer in a UX/UI pair

TEAM

2 UX/UI designers, 2 full-stack developers, UX and tech mentors

TIME

1 month · two 2-week Agile sprints

TYPE

Responsive web app · MVP

TOOLS

Figma · Illustrator · shadcn/ui

ProCV.ai landing page on a desktop screen: upload your CV and we will match it to the job offer

ABOUT THE PROJECT

Your CV, matched to the job offer.

AI CV Enhancer is an app that personalises a CV with AI. It takes an existing CV, improves it and lets the user download the better version. It can also read a job offer from its link and tailor the CV to that offer.

We built it during a mentoring contract on nerdbord.io. The contract imitated a real client brief: UX designers and developers had one month to deliver a working MVP, in Agile, with weekly feedback from mentors.

PROBLEM & HYPOTHESIS

Too many applications, too little time.

Tailoring a CV to every offer by hand takes 60–90 minutes, and without the right keywords ATS systems reject about 75% of applications. In 2023 an average job post in the US drew 118 candidates, and only 20% of them were invited to an interview.

Our hypothesis: matching the CV with AI would cut that time to a few minutes, raise the chances of passing ATS and help candidates who have no access to professional CV services.

PROCESS

Two sprints, one working MVP.

Sprint 1: competitor benchmark, design assumptions, user story and story map, site map and user flow, while developers built the back end. We skipped broader research on purpose: the client had already defined the problem, and usability tests were planned for the MVP.

Sprint 2: lo-fi and hi-fi mock-ups and close work with developers, who built and tested the front end. Every week we met at Product/Design Cafe, and every sprint started and ended with Retro/Planning.

BENCHMARK & MVP

Nine tools, one short list for the MVP.

We compared EnhanCV, Jobscan, Resume.io, Zety / InterviewMe, CV Tools Pro, Jobslead, Pracuj.pl, CVwizard and ChatGPT. The best of them guide the user step by step and let AI suggest edits. The weak points: cluttered screens, unclear navigation, mixed terms (CV or resume) and limited free versions.

From that we fixed the MVP: upload a CV in different formats, paste a link to the job offer, let AI match the CV for ATS, then edit and download it. Polish first, other languages in later iterations.

Benchmark board of EnhanCV: CV builder, CV score and other features

Benchmark board of Jobscan: CV scan, CV builder, dashboard and templates

USER STORY, SITE MAP, USER FLOW

One candidate, one golden path.

“As a job seeker, I want to upload my CV so that AI checks it for mistakes and tailors it to a specific job offer and to ATS requirements.”

We broke the story map into four levels: activities, steps, details and interface elements. From it came the site map with screens, CTAs and navigation along the golden path, and the user flow with screen states, which we kept refining until the end of the project.

User story map: activities, steps, the MVP release and later releases for the AI CV Enhancer

Site map of the AI CV Enhancer: landing, CV upload, editor, job offer match, results and account

User flow: from uploading a CV, through AI checks and matching it to a job offer, to downloading the improved CV

LO-FI & DESIGN SYSTEM

Two lo-fi versions, one direction.

We chose shadcn/ui as the design system: none of us had worked with it and we wanted to try something new. Clerk handled sign-in and registration.

Each designer prepared their own lo-fi version, built on the site map, the user flow and shadcn/ui components, already with the final copy. Comparing two takes gave us different perspectives and ideas we would not have found working on one.

Lo-fi wireframes: upload, template choice, job offer link and CV editing screens

HI-FI

ProCV.ai: Inter, violet and four clear steps.

Before hi-fi we made a moodboard and a style guide, and named the app ProCV.ai to stress both AI and its main job, editing a CV. I designed the style guide: Inter in four weights, a violet palette and a four-step stepper.

Hi-fi added what developers and the first internal tests asked for: screens after sign-in, re-uploading a file, skeleton loading, error messages, a direct jump to templates after upload and changing the job offer link on a matched CV. Then came the mobile version.

ProCV.ai style guide: Inter in four weights, violet palette, icons, stepper and input states

Hi-fi mobile screens: choosing a CV template and the matched CV ready to edit

A person choosing a CV template in ProCV.ai on a laptop

OUTCOME & NEXT STEPS

A working MVP and a list for the next sprint.

ProCV.ai shipped as a working web prototype: upload a CV, add a job offer link, match the CV with AI, edit the result and download it. Sign-in and the missing UI details came in the second development iteration.

At the final Retro/Planning we set the next steps: usability tests with real users, a candidate dashboard with edit history, more templates, payments, deeper AI editing, more languages and the mobile build.

NEXT PROJECT →

IVIVI Style

↑