Case 04Figma × Contra Config Makeathon 2026

Maa

Designing a vision and hearing screening that children think is a game

Role: Solo product designer and builder
Timeline: 3 weeks · June 2026
Platform: Responsive web, tablet first
Tools: Figma Agents, Figma AI, Figma Make, Claude

The problem I solved

Children do not report vision or hearing problems, because they have no baseline to compare against. Conditions like amblyopia are highly treatable in early childhood, but the treatment window largely closes around age seven.

The impact I created

5 Screening games

Eyes, focus and hearing

4
Languages: ~3 min
To complete a screening: 3.2K
Impressions

What it is

Maa is a free, browser-based screening for children aged 2 to 8: five short games that check a child's eyes and ears, and hand the parent a doctor-ready report in about three minutes. Designed and shipped solo in three weeks, as a live product rather than a prototype, and tested end to end with real children.

Play Maa

What I did

Designed and built it solo in three weeks
Research, game design, UI, the trust layer and the doctor's report, shipped as a live product in Figma Make rather than a prototype on slides.
Removed the camera as an instrument
Every screening signal comes from the child's own taps, drags and responses to sound, so the result is identical on a ₹6,000 phone and a ₹60,000 phone.
Hid the clinic inside a game
A lion checks the eyes and animals test the ears. The child plays through five levels while calibrated thresholds do the screening.
Tested with real children
End-to-end sessions with children aged 3 to 7, and a clinical-style report that informs without diagnosing, which a parent can hand to a doctor.

In the product

The five-level adventure map with level guides and progress — The adventure map: five levels, each with an animal guide, lock states and progress

A child wearing glasses playing Maa on a tablet, a parent beside her — A real testing session: a four-year-old playing, a parent watching

The full story

THE PROBLEM

A child can't tell you what they've never seen

Children don't report vision or hearing problems, not because they hide them, but because they have no baseline. The problem is silent by nature, and the cost of silence is permanent: conditions like amblyopia (lazy eye) are highly treatable in early childhood, but the treatment window largely closes around age seven.

Children in India live with visual impairment: 19MChildren in India live with visual impairment
School-age children live with hearing loss: 26MSchool-age children live with hearing loss
Age the treatment window largely closes: ~7 yrsAge the treatment window largely closes

India has no universal childhood screening program (unlike the USA, UK, Singapore or Australia). A screening today means a specialist visit: a cost, a journey, often a city. So for millions of families, the first "test" a child gets is failing to read the blackboard, years too late. The design question: could a screening reach a child before the system does, at home, free, on whatever phone the family already owns, run by a parent with no training?

The children this is for

Group of smiling Indian schoolchildren: the population Maa's free, at-home screening is designed to reach

DISCOVERY

Research: clinical methods, two users, three insights

I studied how professionals actually screen young children: the cover test for amblyopia, Hirschberg-style fixation checks for strabismus, Ishihara plates for colour vision, convergence testing for focus, and the principles of paediatric audiometry. Each has a behavioural core (a stimulus and an observable response), which meant each could be reframed as a game mechanic without inventing new science. Maa has two users with opposite needs: the child (2 to 8) is the player, pre-literate and motivated only by fun; the parent is the operator, anxious and terrified of the word "diagnosis."

Behaviour, not questions
A four-year-old can't self-report blur. But they can tap a lion, follow a star, and point at what they hear. Play isn't a coating on the test. Play is the test.
Parents fear verdicts, not information
The real barrier was emotional: "what if it says something is wrong with my child?" The product had to promise a screening, never a diagnosis. This became a hard language rule on every screen.
Hardware inequality corrupts camera-based results
Existing "eye-test apps" lean on front cameras, but camera quality varies wildly across devices. A screening whose accuracy depends on the price of the phone would systematically fail the families Maa exists for.

THE DEFINING DECISION

Killing the camera: the constraint that became the product

The first concept used the front camera to track eye movement. Testing across devices made the flaw obvious: the same child, the same test, different phones, different results. That's not a screening; that's a lottery weighted by income.

"A test must work the same on a ₹6,000 phone and a ₹60,000 phone. If it doesn't, it isn't screening children; it's screening their parents' wallets."

The pivot: the camera is used only for presence detection (confirming a child is in front of the screen), never for measurement. Every clinical signal comes from interactions that behave identically on any device: tap accuracy, tap position, response time, drag-to-follow paths, and responses to channel-isolated audio. This decision cascaded through the whole system. It set the equity principle, simplified the privacy story (no video is stored or analysed), and became the story the community responded to most.

Design principles that followed

Play is the interface: if a child feels tested, the data dies.
Screen, never diagnose: the word "diagnose" appears nowhere in the product.
Equal on every device: no measurement a cheap phone can't make.
Parent in the loop: the adult verifies each step.
Trust through honesty: say what Maa is, and loudly say what it isn't.

THE SOLUTION

Five games, one adventure map

The screening is framed as an adventure: five levels, five animal guides, five brand colours. The flow: choose language → tell us about your child → pre-flight checks → adventure map → five levels → results → doctor's report. A parent sets up in under a minute; the child only ever sees the game.

Your adventure map

The five-level adventure map home screen, with lock states, level guides (Lion, Elephant, Chameleon, Owl, Rabbit) and progress

LEVEL	CONDITION SCREENED	GAME MECHANIC	WHAT IT MEASURES
1 · Lion	Lazy eye (amblyopia)	Cover one eye "like a pirate", tap the lion as it pops up	Left-vs-right response time and miss-rate asymmetry
2 · Elephant	Misaligned eyes (strabismus)	A star appears at five fixation points; child taps it	Directional tap offset and drift from target
3 · Chameleon	Colour vision	Five Ishihara-style plates; child names the hidden animal	Correct identifications, incl. a reversal catch-plate
4 · Owl	Focus & depth (convergence)	Owl moves near and far; child reports blur and drags to follow	Blur reports at approach distances, tracking smoothness
5 · Rabbit	Hearing	Stereo headphones play animal sounds to one ear at a time, fading softer	Per-ear accuracy and left-right asymmetry

Before any level begins, a pre-flight checklist confirms the environment: parent seated beside the child, device 35 to 50 cm from the face, and a quiet room. The parent must actively toggle all three, a deliberate friction that puts an adult in the loop before data collection starts.

Let's get ready!

The pre-flight checklist screen, with three parent toggles for seating, distance and a quiet room, and the Start Screening button

The hardest level to make honest was hearing: phones can't produce calibrated decibels, so absolute thresholds would be fake precision. The design sidesteps this using the Web Audio StereoPannerNode: sounds play to one ear at a time through headphones, fading softer each round, and Maa scores asymmetry between ears rather than absolute loudness, a comparison that's valid on any headphones.

THE INVISIBLE UX

Designing for trust: the layer nobody sees

A children's health product lives or dies on trust, and most of that design work is invisible. Maa's trust layer answers one question at every step: how do we avoid telling a family something false? A false red frightens a family; a false green silences a real problem. Both are design failures, so validity was treated as a UX surface of its own.

Calibration rounds
Every level opens with a task any child passes: a huge, slow, obvious target. Failing it means a do-over, never a false verdict.
Random-tap detection
Statistically random tap patterns downgrade the result to a low-confidence "worth re-checking". Maa refuses to over-read noise from a distracted child.
Parent-as-verifier
Steps a sensor can't confirm (is the eye actually covered?) are confirmed by the parent through deliberate hold-to-confirm interactions.
Age-calibrated thresholds
A 3-year-old's motor control isn't a 7-year-old's. Thresholds relax ~15% for ages 2 to 3 and tighten ~10% for ages 6 to 8.

Results that inform without diagnosing

Results arrive in three tiers with strict language rules. Every tier links to what was observed, never to what the child "has." The word diagnose does not exist in the product.

Green
"We didn't notice anything; screen again in six months. This is not a diagnosis."
Yellow
"Worth mentioning at your next check-up."
Red
"We recommend seeing a specialist."

CLOSING THE LOOP

The doctor's report: where a screening becomes an action

A screening that ends at a coloured card changes nothing. Maa's endpoint is a doctor-ready report designed for two readers at once. For the parent: plain-language findings per level, and a "What to Ask Your Doctor" list that scripts the conversation, including exact sentences like "My child responded much better in one ear than the other in a home hearing screen." For the doctor: a Measurement Data section with raw numbers against normal ranges, so a professional can judge signal quality themselves. The header states it plainly: "This is a screening document, not a medical diagnosis."

VALIDATION

Testing with real children: where theory met a 4-year-old

The product was tested end-to-end with real children aged 3 to 7 in a real home, on a real tablet, with a parent operating, exactly as designed. The pirate framing worked immediately: role-play beat instruction, and children kept the eye covered without being told twice. Animal-tap answering needed zero explanation across ages, and children asked to play again, the strongest possible signal for a screening that depends on periodic re-testing.

Real runs also caught what a happy-path demo never would: a data-recording defect in the hearing level, where one ear's rounds could record as "0 of 0" while the summary still interpreted asymmetry. It reshaped my view: for a health product, data integrity is a UX property. A beautiful report with a hollow number is worse than no report.

A child wearing glasses playing Maa on a tablet during a real testing session, with a parent beside her

CRAFT & WORKFLOW

Built entirely in Figma: one connected pipeline

Maa was an experiment in how much product one designer can ship alone with an AI-native workflow. Figma Agents turned the concept into first screens and a coherent design system. Figma AI generated the illustration world: the bear mascot, forest environments and level art in one consistent style. Figma Make assembled the working product (game logic, scoring, the Web Audio hearing engine and the report generator) and hosts the live build. Claude supported clinical research synthesis, threshold logic and report language.

The design system carried the emotional architecture: a five-colour level palette mapped to five animal guides, a warm cream base so no screen ever reads clinical, rounded type and oversized touch targets tuned for small fingers.

Design system

Maa design system sheet: logo, brand tagline, primary/neutral/semantic colour palettes and button component states

Inside the Figma workspace

The full Figma workspace: layers panel and canvas showing the design-system pages and every screen built for Maa

OUTCOMES

What shipped, what it earned, and what's next

Maa is live on the web: five working screening levels, four languages, the trust layer, and a generated doctor's report, completed by real children in real sessions. For a three-week solo build, shipping complete was the outcome I protected above all others. It was submitted to Config Makeathon 2026 and hand-picked as a Contra Featured project.

Impressions on the Contra Featured post: 3.2KImpressions on the Contra Featured post
Likes on the launch post: 60Likes on the launch post
Replies from the design community: 13Replies from the design community
Competitions entered: Config '26, Design Pitch '26: 2Competitions entered: Config '26, Design Pitch '26

Featured on Contra, and the community weighed in

Contra 'Featured' post for Maa with engagement metrics, alongside LinkedIn comments praising the project

"This will be so helpful to so many."

Dylan Siegel

"A thoughtful and impactful project that makes an important thing simple, and child-friendly."

Abhiram RG

"Amazing work. I love how you've taken a complex healthcare need into a simple, engaging experience for children and parents. Awareness and early intervention is especially powerful."

Janaina Oliveira

The honest part: Maa did not place at Config Makeathon 2026. Studying the winners taught me something worth more than the prize: Config rewarded tools for designers, visually arresting and instantly shareable within the design community, while Maa is a product for parents, strongest on impact criteria. Same product, wrong room. It's now being refined for UX India's Design Pitch 2026, where problem/solution and human-centred design carry 45% of the score.

TRACK	WHAT'S NEXT
Clinical	Clinical advisor review. Independent review of thresholds and screening methods with a paediatric specialist.
Product	Analytics + a custom domain. Instrumentation to learn from real sessions, plus a shareable results link and custom domain.
Distribution	Pilot conversations. Early conversations with preschools and anganwadi programs about a pilot rollout.
Competition	UX India Design Pitch 2026. Refining Maa for the Health & Wellbeing, New Product stage, with a sustainability model: free for parents, licensed reporting for clinics and public-health programs.

REFLECTION

What I learned

A named constraint is a design superpower. "No camera measurement" did more work than any feature: it set the equity principle, simplified privacy, focused the mechanics, and became the one line everyone remembered.
For health products, data integrity is UX. A "0 of 0" recording bug in the hearing level only surfaced under real, messy usage. Test with real users before you trust your own demo.
Trust is designed in language, not disclaimers. The green/yellow/red rules and the banished word "diagnose" did more for parent trust than any visual choice. Copy was the highest-leverage design surface in the product.
Know which room your product is standing in. Losing Config against designer-audience tools clarified positioning: the same product reads differently to different judges.
Shipping alone is a trainable muscle. Three weeks, one designer, a complete product with a trust layer and a report engine. The AI-native workflow didn't replace design judgement. It removed everything standing between judgement and a shipped thing.

"Maa is a screening, not a diagnosis. But often, a beginning. If even one child gets through the right door in time, every design decision in this document did its job."

Lukhman P, Product Designer, Kochi, Kerala

Play the live product →

Next case studyBuilding a B2B SaaS from 0 to 1, reaching 5,000+ users by focusing on accessibility

Lukhman

Selected Work

Building a B2B SaaS from 0 to 1, reaching 5,000+ users by focusing on accessibility

One design system that made a 9-person team design 70% faster

Rethinking how enterprises find and trust vendors

Designing a vision and hearing screening that children think is a game

About Lukhman

Vibecoded Projects

Maa

SalaryShift

Flames

Match Cards

My UI dump

Kind words

Instagram