HackerRank Virtual Career Fair

What was already breaking before you started?

But before I could design anything, I needed to understand exactly what had broken — and for whom.

Physical career fairs worked because of real human moments — unplanned, unscripted, and impossible to schedule. A student stops at a booth they almost walked past. A recruiter notices something interesting. A five-minute conversation turns into an offer. Nobody planned any of it. It just happened — because people were in the same room.

When lockdowns hit, companies didn't just lose a channel. They lost the entire discovery layer of hiring.

Three groups. Three broken experiences.

This created a real opening for HackerRank. The platform already lived inside hiring. Companies assessed developers on it. Candidates proved their skills on it. What it didn't have was the layer in between — where companies and candidates could actually meet. Without that, enterprise customers would turn to alternatives. The gap was real. The timing was urgent. That was the gap I was asked to fill.

I had a clear challenge. What I didn't have yet was a clear answer. That required me to stop assuming and start listening. Which meant going into the unknown.

What did you actually own here?

One designer. One brief. Zero playbook.

I was the Lead Product Designer and sole design owner — responsible for the end-to-end experience from the first sketch to the day it shipped. No template existed for a virtual career fair. I was defining something new, under COVID pressure, with engineering building against my designs and enterprise customers waiting.

The work didn't follow a straight line. It couldn't — the problem kept evolving as I learned more. Instead I worked in rapid cycles: design a little, validate quickly, ship what worked, monitor what didn't, and loop back.

Speed mattered. But not at the cost of clarity. Every decision came back to one question — does this make it easier for a developer to find a job, or a recruiter to find the right person?

Before a single screen was designed, I aligned with product stakeholders on what success actually looked like.

That question became the compass for everything that followed. Next: understanding what was actually broken.

What rules did every screen have to pass?

I didn't write these down at the time. But looking back at the decisions I made under a six-week clock, the same handful of rules kept deciding things for me — and they're the criteria the rest of this case study should be read against.

Reduce friction at every step. Registration lived in a single modal with four SSO options, not a multi-page form. The application was a checklist, not a wizard. Every step I could remove, I removed.

Minimise what the user has to think about. Rather than make candidates search 108 near-identical booths, I surfaced companies using HackerRank's existing verified-skills data — relevant companies first, no new infrastructure. The work of finding relevance moved from the candidate to the system.

Keep it learnable for a first-timer. Nobody had used a virtual career fair before — there was no learned behaviour to lean on. The lobby was structured around featured companies, sessions, and recommendations instead of a flat directory, so a candidate's first thirty seconds pointed somewhere.

Balance both sides of the marketplace — let neither win by default. The interest-signal layer gave recruiters the prioritisation signal they were drowning without, and it did it through explicit candidate action (“I'm Interested”) rather than hidden behavioural tracking — recruiter value the candidate could see and control.

Design patterns that could scale past the event. The candidate dashboard tracked saved companies, applications, and status after the live day ended — because I was designing a repeatable platform, not a one-time event. It's the same reason the interaction patterns were built to be reused rather than staged for a single fair.

And underneath all of them, one question: does this decision make a meaningful connection between a candidate and a recruiter easier, or harder? Every trade-off in the sections that follow resolved by asking it.

With the criteria clear, the first real work was listening. What I heard reframed the problem entirely.

How did you learn what both sides actually needed?

The first real work was listening — a structured research push before any solutioning.

To understand what was really broken in virtual hiring, I ran a multi-method research programme — talking directly to the people who would use this platform every day, and studying the competition. Three methods, each answering a different question.

Recruiter interviews

I conducted 45-minute semi-structured interviews with 12 enterprise recruiters from companies already using HackerRank — including Airbnb, Booking.com, DoorDash, Dropbox and PayPal. These were teams running high-volume technical hiring, so they knew exactly where the existing process cost them time. I asked how they sourced before lockdown, what they'd tried since, and what they were doing manually that they shouldn't have to.

Candidate interviews

I conducted 60-minute semi-structured interviews with 15 developers and early-career candidates who had previously attended virtual career fairs. I wanted the part recruiters couldn't tell me — what it feels like to apply into silence, how candidates decide which booth is worth their time, and where they give up.

What I heard across all these conversations surprised me. The problem wasn't what I expected.

So what was the big reframe?

The conversations confirmed the problem — but they also reframed it.

The assumption going in was simple: virtual hiring was broken because the technology wasn't good enough. What I actually found was different. The technology wasn't the problem. The signal was.

What recruiters told me

Recruiters weren't struggling to attract candidates. They were drowning in them. Booth traffic was high — but quality was low. Every recruiter said the same thing in different words: "I can't find the right person inside all this noise."

Four consistent breakdowns emerged:

What candidates told me

Candidates had the opposite problem. They had access to companies — but no real way to connect with them meaningfully. Applying felt like sending messages into a void.

Four consistent patterns emerged:

What the data was really saying

Two sides of the same marketplace. Both frustrated. Both for the same underlying reason — there was no intelligent layer connecting the right candidate to the right recruiter at the right moment.

That was the real problem. Not the lack of a virtual venue. Not the lack of booths or sessions. The lack of signal clarity on both sides. That single insight became the foundation for every design decision that followed.

Now I knew what to solve. The next question was who exactly was I solving it for? Three people. Three completely different needs.

Who were you actually designing for?

Three very different people. One platform. Their needs pulled in completely different directions.

Understanding who I was designing for wasn't just about building personas — it was about holding three conflicting sets of needs in my head simultaneously and finding solutions that worked for all of them.

The tension was real. Developers wanted personalisation. Recruiters wanted signal. Early career candidates needed simplicity. Every design decision had to balance all three — without sacrificing any one of them. That constraint became a creative forcing function.

With a clear picture of who I was designing for, I could start mapping the experience they needed. That meant understanding the full arc — from first touch to offer letter.

Where did the journey actually break down?

Before I designed a single screen, I needed to understand the full arc — from the moment a developer first heard about the fair, all the way to receiving an offer letter.

Two questions guided this phase — what are all the places a candidate needs to go, and what does the journey actually feel like, step by step? The IA answered the first. The journey map answered the second.

What the platform needed to contain

Six sections. Two sides of the marketplace. Every feature mapped to a clear user need before a single wireframe was drawn.

The emotions layer revealed what the steps alone couldn't. The biggest drop-off risk wasn't at application — it was at discovery. Candidates who felt overwhelmed in the lobby left before they ever reached a booth. That single insight directly shaped how I designed the Virtual Lobby and Company Booth experiences.

The structure was clear. The journey was mapped. Now it was time to start drawing.

How did you get from sketch to screen?

My manager had a rule — forty minutes to sketch an idea. If you can't draw it in forty minutes, you don't understand it well enough yet. I didn't open Figma. I picked up a pen.

This was March 2020. Several colleagues were personally affected by COVID — managing illness, family loss, and exhaustion while working remotely across time zones. I shared paper sketches over video — held up to the camera, or photographed and dropped into Slack. Engineering, product, sales, marketing, and HR gave feedback in fragments — a comment here, a question there, a voice note at midnight. I took everything back to paper. Sketched again. Shared again. Two or three rounds before anything went digital. The constraints made every decision intentional — there was no time or energy to waste on anything that didn't matter.

Seven decisions. Each one came from a constraint, a research finding, or something a recruiter or candidate told me directly. Now it was time to build what I'd drawn.

What did you actually ship?

The sketches became screens. The screens became a product. This is what I designed — and the decisions that got us there.

My manager had a rule: forty minutes to sketch an idea. What he didn't say was what came after. After the sketches came the screens. After the screens came the feedback. After the feedback came more screens. Six weeks of that loop — and this is where it landed.

The platform had to work for three people simultaneously: a developer finding their first job, an early career candidate trying to stand out, and an enterprise recruiter buried in noise. Every screen I shipped was the answer to one question — does this make the right connection easier, or harder?

Eighteen screens. Four acts. One end-to-end hiring journey.

The journey map in Section 7 gave the platform its spine — discover, explore, connect, continue — and an emotional arc underneath it: uncertain, overwhelmed, hopeful, anxious, relieved. That arc shaped how I thought about the tone of each interaction, and I used it as a lens to check the experience against — was I meeting the candidate where they actually were at each step?

The acts themselves are organized around the tasks candidates had to perform — impressing, applying, browsing, proving — not around the journey stages one-to-one, and that separation was deliberate. The journey told me what candidates were feeling; the platform still had to be built around the work they'd actually do. I structured the screens around that work, and used the emotional arc to pressure-test whether the order and tone felt right.

The First Impression

01 Landing Page 02 Login / Register 03 Registration Confirmed

The landing page had one job: earn belief before a candidate committed to anything. I didn't open with a headline. I opened with a clock. 58 days. 19 hours. 20 minutes. A live countdown — not marketing copy. A real number, ticking. It told every visitor the same thing without a single word of explanation: this is happening, and you should be part of it.

Below the fold, three numbers did the social proof work. 30+ exhibitors. 200+ universities. 30+ live events. Employer logos above — companies candidates already recognised. The page didn't sell the event. It made the event feel real.

Registration lived in a modal. Not a new page — a deliberate choice. The world dimmed. A clean form appeared: name, email, password, or connect through Google, LinkedIn, Facebook, or GitHub. One action. Minimal friction. When it was done, the page responded: a green confirmation banner, a checkmark, and a CTA that shifted from "Register Now" to "Manage Application." Four words. Enormous meaning. You're no longer a visitor. You belong here now.

Landing Page

Registration in a modal

Successful registration

Building the Application

04 My Application 05 Add Certificate 06 Certificates Earned 07 Add Exhibitors 08 Exhibitor Selected 09 Application Complete

Research had told me candidates abandoned virtual fairs when they didn't know what was expected of them. The application couldn't feel like a form. It had to feel like a path.

I designed the right rail as a persistent progress tracker — three steps, always visible, updating in real time as the candidate moved through them. Complete your Profile. Earn HackerRank Certificate(s). Select Exhibitors. It never pushed. It never nagged. It just reflected back exactly where you were.

The profile was layered deliberately: Personal → Professional → Other Links → Work Authorization → Demographic. Each layer told a recruiter something different about a candidate's readiness. The demographic section carried copy I wrote carefully: "the data you provide here is confidential." Small words. Real trust.

Certificates started at zero — one card, one CTA. After the tests: Python (Basic). Java (Basic). Problem Solving (Intermediate). Each badge verified by HackerRank, not self-reported. That distinction mattered. Recruiters weren't looking for claims. They were looking for proof.

Registration in a modal

An honest empty state

Certificate section

The moment a candidate completed all three checklist items, the right rail transformed entirely. The checklist disappeared. In its place: an il ustration of three people mid-jump, and two words — Application Complete. That state change was the product's highest- stakes emotional moment. I designed it to feel like it was earned — because it was.

The platform didn't stop there. It nudged candidates to go further — earn more certificates, fill all ten exhibitor slots, attend live events. Completion was the floor, not the ceiling.

Add Exhibitors

Exhibitor selected

Application Complete

The Marketplace

10 More Exhibitors 11 Edit Exhibitors 12 Exhibitors Page 13 Company Page 14 Filtered View 15 Remove Interest 16 Interested Badge 17 Not Interested

108 companies. Every candidate looking at the same grid. My research had been clear: when every booth looks identical, candidates don't pick carefully — they stop looking. The exhibitors page had to help each person find the right three out of 108, without making it feel like work.

The cards carried brand color as a design element. Roblox in black. Dropbox in blue. Audible in orange. Logos didn't sit on white backgrounds — they owned their space. The right rail offered filters by job type, company size, industry, and location. Active filter chips appeared above the results grid — candidates always knew what they were looking at, and why. A Trending badge surfaced high-engagement booths. A High Scope signal flagged strong matches.

The company page was where intent became action. Full-bleed brand header. Job description. One green button on the left: I'm Interested. Pressing it triggered a toast with a live counter — "You are interested in 1 exhibitor out of a maximum of 10." That number wasn't decoration. It created healthy pressure. It told candidates how much room they had — and how to use it. Remove interest flipped the exact same toast component into red. Same layout. Same position. Opposite meaning. The symmetry was intentional. No candidate should ever be confused about their own application state.

All 10 exhibitor slots filled

Edit mode

Exhibitors page

Company page

Filtered view

Remove Interest

Interested badge

Not Interested

The Assessment Gateway

18 Skill Assessment

Before a profile reached a recruiter, it had to earn the right to be seen. That was the point of the assessment — and the screen had to make that weight legible.

I broke from the product's visual language deliberately. White left panel. Dark right panel. The candidate's name at the top. Hey Sandra Cox. Below it: HackerRank 2020 Career Fair Skill Assessment. 60 minutes. 6 questions. The split wasn't arbitrary — it was psychological. Left: who you are, what you're walking into. Right: instructions, structure, the path forward. One column of identity. One column of challenge.

The assessment screen was the only place in the product where I wanted a candidate to feel the gravity of what they were doing. The design got out of the way and let the test do its job.

A deliberate mode change

What I Iterated Before It Shipped

The eighteen screens you see are the result of removing everything that didn't work. These are the key explorations that shaped them.

Exploration

Booth layout exploration

Application Process diagram

Application Checklist

Key decisions

What It Became

A complete virtual career fair — built from zero, by one designer, in six weeks — that ran HackerRank's first live hiring event during a global lockdown. Every screen was a decision. Every decision came from something a recruiter or candidate told me directly in research.

The states between the happy path

A hiring journey isn't only its best-case screens, and the six weeks did stretch to the in-between states that decide whether a first-time user keeps going. The certificate section had an honest empty state with a clear next action rather than a blank panel. The application carried its own progress — “0 of 10 selected” through to a completion moment — so a candidate always knew where they stood. And the interest layer was designed as a reversible pair: an Interested confirmation with a live counter, and a Not Interested path that flipped the control back and reset the count — because a signal a candidate can't take back isn't an honest signal.

What I consciously did not design for, under a six-week clock, were the live-event failure modes — a dropped connection mid- conversation, an unattended booth, a recruiter flooded past capacity. Those were real risks; they were also out of scope for a first release built to prove the model. I'd rather name that boundary than imply a completeness the first version didn't have.

The platform launched. The event ran. And something shifted — for the candidates who used it, for the recruiters who finally had signal, and for HackerRank as a business. That's the next section.

What did this actually change?

The product launched mid-lockdown. No campus, no booths, no handshakes — just a platform, a six-week build, and a question nobody could answer yet: would people actually use it?

They did. And it didn't stay a one-time experiment.

Publicly reported by HackerRank

The clearest measure of success wasn't any single number. It was that the Virtual Career Fair stopped being a crisis response and became a recurring product — HackerRank ran a second annual fair in 2021. A six-week emergency build became part of how the company hired, year after year.

Two sides of the marketplace both moved

A two-sided product usually pleases one side at the other's expense. This one moved both — at the same time.

These engagement and satisfaction metrics were tracked and reported by HackerRank's product and analytics team after launch. My role was the end-to-end design that drove them — measurement ownership sat with the product and leadership team. I've kept the framing honest because the work stands on its own.

What changed for HackerRank

A new revenue stream: Monetised as a premium paid service to companies — meaningful income at the exact moment in-person recruiting had collapsed entirely.

Category leadership in virtual hiring: Its success positioned HackerRank as a credible leader in remote recruitment, attracting clients looking for a platform that could run hiring at scale, remotely.

Product synergy across the platform: Pulled candidates and companies deeper into HackerRank's existing assessment and interview tools — lifting usage platform-wide and opening revenue beyond the fair itself.

Client retention and acquisition: Kept existing customers who needed a reliable virtual hiring option — and brought in new ones looking for a complete hiring solution during the pandemic.

A product I designed in six weeks, alone, under lockdown, became a pillar of how the company hired — and how the company earned.

But success is only half an honest story. The harder half is what didn't go right — and what it taught me.

What was the hardest part?

Every honest case study has a second half. This is mine.

The Virtual Career Fair worked. But it wasn't smooth, and it wasn't perfect. Three things went wrong — and each one taught me something I carried into every project after it. I'm including them because the mistakes shaped me more than the wins did.

I went in assuming the technology was the problem. It wasn't — the signal was.

I underestimated the technical complexity

I designed desktop-first and mobile paid for it

I didn't communicate enough with every stakeholder

Two sides of the same marketplace. Both frustrated. Both for the same underlying reason — there was no intelligent layer connecting the right candidate to the right recruiter at the right moment.

Which leads to the last, and most personal, part of this story — what building this actually built in me.

What did this build in me?

I went into this project as a designer. I came out of it as something closer to an owner.

For six weeks I was the only designer on a product that didn't exist yet, with no template, under a deadline set by a global emergency. There was nowhere to hide and no one to defer to. That kind of pressure either breaks you or it teaches you what you're actually capable of. For me, it did the second.

What I Learned

I learned to design under real constraints: No time, no playbook, no second designer, and a team stretched thin by COVID. The constraints didn't limit the work — they focused it. Every decision had to earn its place. I stopped polishing things that didn't matter and learned to spend my effort where it changed outcomes.

I learned to hold conflicting needs at once: Developers wanted personalisation. Recruiters wanted signal. Early-career candidates needed simplicity. I couldn't pick a favourite. Designing for three people whose needs pulled in different directions — without sacrificing any of them — became the most useful muscle I built.

I learned that research is the shortcut, not the detour: The instinct under deadline pressure is to skip straight to screens. The single most valuable thing I did was the opposite — twelve recruiter interviews and fifteen candidate interviews before drawing anything. The "signal, not technology" insight reframed the entire product. Listening first saved weeks.

I learned to own the outcome, not just the output: A designer ships screens. An owner cares whether the product worked, whether the business benefited, and whether the team was aligned. By the end, I was thinking about revenue, retention, and engineering feasibility — not because it was my job title, but because owning the whole picture is what the project demanded.

The outcome, in one honest paragraph

The HackerRank Virtual Career Fair delivered a platform that worked for both sides of the marketplace — and became a product the company ran again, year after year. It demonstrated the power of user-centred design, rapid iteration, and genuine cross-functional collaboration, built entirely in a remote environment during the hardest stretch most of us had worked through. It drew 20,000+ attendees and 72,000+ applications, and turned a crisis response into a recurring line of business.

But the part I carry isn't a number. It's the proof — to myself — that I can take a problem nobody has solved before, under conditions nobody would choose, and ship something real that people actually use.

That's what it built in me. And it's what I bring to every problem now.