Job­vite Job Grader

Inter­ac­tive tool for recruiters to test job post­ings for gen­der and racial bias with feed­back in info­graph­ics and emojis. 

Back­ground

Job­vite is a mar­ket leader in the recruit­ment indus­try. With a main prod­uct offer­ing of appli­cant track­ing sys­tem and recruit­ment soft­ware, their team came to us with a brand new AI-dri­ven algo­rithm designed to detect racial or gen­der bias in job post­ings and request­ed a UI design to bring it to the public.

In begin­ning this project, the need for a judge­ment-free UI was the impe­tus for our cre­ative process. I rec­og­nized that many recruiters who may use this algo­rithm were doing so in a proac­tive way, and so the pri­or­i­ty for this tool was to pro­vide a judge­ment-free edit­ing zone for recruiters.

Defin­ing our Goal

This prod­uct tack­les one of the great­est chal­lenges recruiters face today: how to attract tal­ent with a bias for gen­der or race. Implic­it bias affects mar­gin­al­ized com­mu­ni­ties the most, and can be detri­men­tal when search­ing for a new job.

By check­ing job post­ings for racial or gen­der bias, recruiters gath­er a more inclu­sive pool of tal­ent, and mar­gin­al­ized groups of peo­ple see bet­ter chances of win­ning the job or career they most want.

Users & Audience

The indi­cat­ed user for this project was ini­tial­ly only recruiters who sub­scribe to Jobvite’s appli­cant track­ing sys­tem. When the project was expand­ed, so did the intend­ed audi­ence includ­ing but not lim­it­ed to non-sub­scrib­ing recruiters, tech recruiters, hir­ing man­agers, job searchers, career coun­selors, and human resource professionals.

Roles

I was tasked with the research, design, and devel­op­ment of this prod­uct. I worked with a team of one oth­er design­er, and one Back End Developer.

Scope & Constraints

Some unique fac­tors were that the base algo­rithm that would detect gen­der or racial bias was built with Machine Learn­ing and was con­stant­ly being trained. This result­ed in mul­ti­ple result fac­tors to design for — some of which were chang­ing until late in the project. We also faced major con­straints in time and resources as this project was not our only live project at the time.

New Tech­nol­o­gy Unlocked: Svelte

Because of the live-reload demands of this web app, our Back End Devel­op­er set up our project using Svelte and some oth­er new tech­nolo­gies. As a result, this became the first svelte project for every­one in our team

Expand­ing Accessibility

Late in the project, the client came to our team with a request to make the final results page print­able. This pre­sent­ed some excel­lent design oppor­tu­ni­ties and even­tu­al­ly became a point of empha­sis for accessibility.

User Research

The first step I took in this project was com­mu­ni­cat­ing with the client and cre­at­ing a user flow for the prod­uct. I want­ed to explore where users would be com­ing from and where they would go next after enter­ing their infor­ma­tion and job posts, edit­ing, and where they would go next.

High-Fideli­ty Wireframing

The next step I turned to the wire-fram­ing tool Fig­ma and pre­sent­ed an ini­tial click­able pro­to­type to the client. From this high-fideli­ty pro­to­type, our team designed and built the full expe­ri­ence in Fig­ma while main­tain­ing the pro­to­typ­ing func­tion­al­i­ty. I was par­tic­u­lar­ly inter­est­ed in build­ing pro­gram­ma­ble svg com­po­nents that would respond to data points some­times in a range from (-1,1) for example.

Ask­ing for Print Query

Then, lat­er in the project, the client came to our team with the request to add print func­tion­al­i­ty to the final report page of the prod­uct. This became my sole respon­si­bil­i­ty in the project. 

This was a unique request in that it wasn’t very com­mon for our core clients to ask for print-ready web­pages. I was made aware there were paid plu­g­ins that could achieve boil­er­plate results, but see­ing the oppor­tu­ni­ty for acces­si­ble design I advo­cat­ed for craft­ing a cus­tom print experience.

Results & Conclusion

In the end, I deliv­ered a cus­tom print-from-web expe­ri­ence that per­fect­ly cap­tured the result page for the prod­uct. Addi­tion­al­ly, by com­plet­ing user expe­ri­ence research ear­ly in the process, we had a fin­ished prod­uct that offered many entry and exit points for the user to explore Jobvite’s oth­er prod­uct offer­ings after get­ting their job descrip­tion eval­u­a­tion back. 

Out­come

Our team deliv­ered this project on time and in per­fect cohe­sion with the machine learn­ing algo­rithm that sup­port­ed it. This project was the first where I tru­ly led on process and guid­ed our team through research, con­cep­tion, wire­fram­ing, pro­to­typ­ing, and final design. 

New Knowl­edge

This was also our team’s first project using Svelte, a unique tem­plat­ing lan­guage that we all fell in love with. Addi­tion­al­ly, I gained a new capac­i­ty for craft­ing web-to-print expe­ri­ences and still use that exper­tise today in my dai­ly acces­si­bil­i­ty practices.