Finding the missing number,
and the missing usability.
A Nielsen heuristic evaluation of a K-4 counting game surfaced a dated, cluttered interface with no mobile story. Here's the teardown, the principles it produced, and the balloon-powered redesign that followed.
Designing for a 9‑year‑old who wants to finish fast and get back to playing.
The evaluation started with a persona, not a screenshot. Anna is nine, in Grade 4, and does her schoolwork on a shared classroom iPad. She's motivated by finishing a task in one sitting — any friction that slows her down risks losing her before the lesson lands.
That single constraint — impatient with delays, works on a tablet — became the lens for every heuristic finding that followed.
The existing screens broke five of Nielsen's ten usability heuristics.
The level-select and gameplay screens used dense clip-art, mismatched object scale, and glossy, dated buttons — and gave no thought to anything narrower than a desktop monitor.
Illustration was dense and dated — bevelled buttons, drop shadows and a busy dot pattern competed with the actual task.
The train cars carrying numbers weren't in proportion with the station or the characters, breaking the scene's own internal logic.
Correct and incorrect feedback appeared in a speech bubble far from where the child last tapped, so the response felt disconnected from the action.
Fixed-pixel layout with no responsive behaviour — unusable on the iPad Anna actually does her schoolwork on.
Navigation relied on an unlabelled arrow and a train motif that don't map to any icon vocabulary a 9-year-old already knows.
Typography, iconography and colour language shifted between the level-select and gameplay screens, so the two never read as one product.
Four commitments the redesign had to hold, in order.
Every screen in the new design gets checked against these before anything else — they're the direct answer to the heuristic findings above.
Mobile‑first, always
Designed for the iPad first, then scaled up — not the other way around.
One clear metaphor
A single hot‑air‑balloon world replaces the mismatched train set, so every object shares one scale and logic.
Feedback where you tapped
Correct and incorrect states now surface right on the object the child touched — never off in a corner.
Clear, minimal, calm
Flat colour, generous spacing and two icons — Levels and Info — instead of a page of ornament.
One balloon world, from level select to feedback.
The dated train station became a sky full of number balloons — a metaphor simple enough that scale, colour and meaning never fight each other.
Same task, six fewer things fighting for attention.
- Skeuomorphic buttons with heavy bevels and shadow
- Train, station and characters at three different scales
- Feedback bubble detached from the tapped object
- Fixed layout, desktop only
- Flat‑colour balloons with a single consistent light source
- One mascot, one basket, one scale across every screen
- Answers live directly beneath the question
- Responsive from phone to desktop, same component