All projects

CodingZones: turning screen time into thinking time

A mobile-first learning web app for children in Indonesia. Twenty short games train logic, patterns, early coding and AI thinking. Five games are free, and the rest unlock with an affordable monthly code. I designed and shipped it end to end.

My roleProduct designer, end to end
TeamMe, with an AI coding assistant
PlatformMobile-first web app (PWA)
StatusLive at codingzones.com
Three CodingZones screens: an animal guessing game, the personalised home screen and a robot coding puzzle
The challenge

Two users, one cheap phone

Parents want screen time that is actually useful, not another hour of scrolling short videos. Children want something fun that they can play without help, often before they can read. And in most Indonesian homes, both of them share one low-end Android phone with limited data.

The parent

Wants to trust the app before paying, worries about ads, top-ups and data use, and needs a way to stop the session.

The child

Can't type or read well, taps fast, loses interest quickly and needs clear, instant feedback.

The question I started withHow might a child learn real logic in a few minutes a day, on a cheap phone, without needing an adult to help or a reason for the parent to worry?
Key decisions

Six decisions that shaped the product

1. No sign-up

Open the app and play in seconds. There is no account, email or password standing between a child and the first game.

2. Play before pay

Five games are free forever, and premium games have a trial mode, so parents see the value before any purchase. No ads, no top-ups.

3. Voice-first UI

Every prompt can be read aloud, and controls are big touch targets, so children who can't read yet can still play alone.

4. One system, twenty games

A shared engine, level picker and feedback pattern. Learn one game and you know how to play them all.

5. A parental brake

A per-session time limit with a lock screen, and a simple math gate that only an adult can pass.

6. Built for low-end phones

No frameworks, 6–25 KB per game and about 7 MB for the whole app, with offline support as a PWA.

Landing page: headline, Try free now button, a button for schools and tutoring centres, and the promises: 5 free games, no ads and no top-ups, light on data
The promise up front: free to try, no ads, light on data, plus a separate path for schools.
Personalised home screen with age group, stars, play count, last played game and games suited to the age
Home adapts to the child: age group, stars earned and one tap back into the last game.
One system

Designing a system, not twenty one-off games

With one designer and twenty games, consistency had to come from the system. Every game shares the same frame: a top bar with the game name, stars, help, settings and close; a progress bar for rounds or levels; the play area; and a voice prompt with a speaker button. Trial games carry a clear "COBA" (trial) badge in the same place.

The library works the same way. Parents can filter by type (coding, AI, online safety, design, websites, little ones, logic), by free or premium access and by age, and switch between a grid and a list. Each card shows the difficulty, the play time and the age range, so a parent can choose in seconds.

Game library with the type filter open: All, Coding, AI, Safety, Design, Website, Little ones, Logic
Filters by type, access and age. Questions and maps are shuffled, so each play is different.
List view of games with category, title, one-line description, difficulty, minutes and age range
List view: difficulty, minutes and age on every card, and a clear Free label.
Level picker with the robot guide, a short note for parents and two levels: easy and medium
Every game starts the same way: Zozo, a note for parents and a simple level choice.
The games

Small games, real thinking skills

Each game targets one skill and fits into a few minutes. The interaction is always the simplest one a small hand can do: tap a big answer, drag a shape, or press an arrow.

Animal guessing game: a voxel monkey celebrates a correct answer with confetti and the voice line This is a monkey
Cilukba: match animals to their shadows, with a voice line and a small celebration.
Coding puzzle: the player queues arrow commands to move a robot to its house, then presses Run
Mudik: plan a sequence of steps, then press Run. The first idea of coding.
Pattern game: blue and yellow train carriages and a question mark, with three carriage colours to choose from
Kereta: spot the colour pattern and pick the next carriage.
Counting game: pick three pears from a voxel tree into a basket
Panen: count while picking fruit. Trial games show a COBA badge.
Shape matching game: move and resize a sailboat over its silhouette, with a match meter
Siluet: move and resize a shape until it fits its silhouette.
Block puzzle: fit coloured block pieces into the empty spaces of a grid
Kubik: spatial reasoning with block pieces.
Brand & motion

A cheerful voxel world

I built a world children already find familiar and fun: blocky voxel landscapes, two child characters and Zozo, the robot guide who introduces every game. Animals and fruit are animated, correct answers get a short celebration, and the copy is 100% Bahasa Indonesia.

Sound is part of the interface, not decoration. Every voice line was scripted, recorded and levelled so that prompts are clear on a cheap phone speaker. Short launch videos for parents are labelled wherever AI footage is used.

Building it

Designer as product owner, AI as engineering partner

I directed an AI coding assistant as my engineering partner: I set the structure, the shared components and the performance budget, reviewed every change and owned QA. Each release was tested at phone and desktop widths before it went live.

20Games shipped

Across logic, patterns, early coding, AI thinking and online safety.

230+Versions released

Small, frequent releases, each one tested on phone and desktop widths.

~7 MBWhole app

6–25 KB per game, no frameworks, and it works offline.

Outcome

Live, and learning what makes parents pay

CodingZones is live with 20 games, a free tier and premium access by monthly code, plus a separate offer for schools and tutoring centres. The next step is measuring which games children come back to and which channel brings paying parents.

What I learned

Design for the child, sell to the parent

The child decides whether a game is fun, but the parent decides whether to pay. Designing for both changed every screen: playful and wordless for the child, clear and reassuring for the adult.

I also learned that paid ads are not a shortcut. Early ads brought visitors but not enough paying parents to cover their cost. That is why I'm now focusing on schools and tutoring centres, where one decision reaches a whole class.