Building a coding-challenge dashboard that scales across hiring rounds and products, in three days.

The rules before the build

When the placement PRD landed I did not open Figma. I built a Claude skill holding Scaler’s design system, so what it generated came out inside the system.

Then an implementation-plans.md turned the requirements into a flow: category order, what a wrong answer does, what carries forward, when a category closes.

I sketched the flow first, then let Claude build to those constraints. Full flow, edge cases included, in three days.

## Challenge rules

### Category order
- Easy, then Medium, then Hard. Fixed.
- A category opens only once the one before it closes.

### On a wrong answer
- The miss is not graded and not deducted.
- Route into Practice Mode, same interface.
- Practice is required, not offered. No skip.

### What carries forward
- Every correct answer already banked stays banked.
- The correct count carries across the practice detour.
- One miss still clears the round.

### When a category closes
- Threshold met -> close it, unlock the next.
- Six tries spent -> the attempt ends here.

Built for the wrong user first

Claude’s first pass assumed a returning user. It dropped candidates straight into Contest Mode with no onboarding.

Reasonable for a PRD written for people who know the product. Wrong for the real audience: someone hitting this cold, once.

So I built the first run back in: the rules, the modes, the ‘you cannot skip this’ framing, before any question loads.

The moment someone gets it wrong

The hard part was not the state logic. It was how a learner feels the moment they fail, on a timer, on camera.

A wrong answer routes into Practice Mode, same interface, framed as ‘not graded’ rather than a step down.

Right at that transition, the copy says it plainly: you keep the answers you already got right, your contest progress is safe.

And the way back is never vague. A ‘Continue’ or ‘Back to Contest Mode’ says exactly when they can resume.