Case study

Typefall

A typing test where failure has gravity. Hit your target speed and accuracy and you get confetti. Miss it and every letter on screen falls, tumbles and piles up on the floor.

Try Typefall →

What it is

Typefall is a typing-practice app that runs entirely in the browser. You pick a length — 15 seconds, 30, 60, or 25 words — and a target speed of 20, 30, 45 or 60 words per minute. The clock starts on your first keystroke.

The twist is what happens when you miss. Most typing tests hand you a number and move on. In Typefall the text itself gives way: every letter drops, tumbles and settles in a heap at the bottom of the window, and you can click the pile afterwards to knock it around.

The rules, exactly

• Pass: finish at or above your target WPM and at or above 90% accuracy.
• Fail: finish under the target, finish under 90% accuracy, or make 10 mistakes at any point — which collapses the text immediately.
• A mistake is any wrong or extra character, plus a space typed on a word that is not yet correct.
• Accuracy is correct keystrokes divided by all keystrokes. WPM is net: correctly typed characters and their spaces, divided by five, divided by minutes.

A Stability meter shows how many mistakes you have left, so the collapse is never a surprise — you can watch it coming and try to steady yourself. That is the part that makes it practice rather than a gimmick.

What it tracks

Live WPM, accuracy, streak and a combo meter that climbs a level every ten correct keystrokes in a row. Correct letters pop in emerald, wrong ones shake, and the whole text wobbles once you are down to your last three mistakes.

Finish and you get a results card: WPM and raw WPM, accuracy, best streak, max combo, a character breakdown, and a WPM-over-time sparkline with your mistakes marked on it — so you can see whether you started badly or fell apart at the end. Personal bests are kept per mode in the browser's own storage, and only passed runs count.

Built to be usable, not just clever

• Reduced motion is respected properly. If the visitor's system asks for less movement, there is no shaking, no wobble and no confetti, and the failure becomes a plain straight drop with no spin or bounce. The feature still works; it just stops moving.
• Keyboard first. Tab starts a new test, Esc repeats the same words, Shift+Tab leaves the text box so you can still navigate the page.
• Mobile works. Tapping the text brings up the keyboard, with a hidden input handling the typing.

How it is built

Static HTML, CSS and JavaScript with no build step and no framework. The physics on failure come from matter-js, vendored into the project rather than pulled from a CDN, so the page has no third-party runtime dependency. It is the same approach we take to client sites: fewer moving parts, nothing to patch, and it still loads fast on a phone.

Being straight about this one

Typefall is our own project, not client work. We build these to try ideas properly rather than in a slide deck — in this case, whether a bit of physics makes a dry drill worth repeating. There are no user numbers to quote and we are not going to invent any.