Ketikaria: a typing game for kids who can't read yet

01 · What it is

A typing game for children, working name Ketikaria.

It's for ages 4 to 10, including kids who can't read yet. The tagline is "Tekan. Dengar. Tumbuh.": press, listen, grow. A small character called Lumi guides them.

02 · Designing for pre-readers

If a child can't read the instruction, the instruction has to speak.

every control has an icon, a label and an audio demo
tap targets and buttons are at least 56 px
speech waits 1.2 seconds, so a slow child isn't talked over
no alarms, no "Gagal", no accuracy percentage, no confetti
modes aren't locked by age

Progress is a small garden: five seeds grow a plant.

03 · Sound without audio files

There isn't a single audio file in the game.

Narration uses the device's Indonesian voices through speechSynthesis. Music and sound effects are synthesised with Web Audio oscillators, turned down while narration plays and stopped when the tab is hidden. It also respects reduced motion.

const ctx = new AudioContext();
const osc = ctx.createOscillator();
const gain = ctx.createGain();
osc.frequency.value = 523.25; // C5
gain.gain.setValueAtTime(0.2, ctx.currentTime);
gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + 0.3);
osc.connect(gain).connect(ctx.destination);
osc.start();
osc.stop(ctx.currentTime + 0.3);

04 · A small stack

React 19, TypeScript, Vite and plain CSS.

The content is a JSON catalogue (56 items in the current draft), progress lives in localStorage, and Playwright checks the flows. No backend, nothing to log in to.

05 · The deploy gotcha

It ships to Cloudflare Pages with Direct Upload.

Two things I learned there: without --force, Wrangler can create a Workers project instead of a Pages one, and a Direct Upload project can't be switched to Git integration later. Pick the deploy model before the first upload.

npx wrangler pages deploy dist --project-name ketikaria --force

06 · Not done yet

It isn't ready for a pilot.

Still missing: a voice pack with two characters, narrated onboarding, and testing with real children on real devices. That's the next milestone, not a launch.