SanaSpeak

Inspiration

If you can't speak the language, going to the doctor is terrifying. You can't describe your pain, you can't understand the instructions, and you can't ask questions. For a lot of people, that gap is dangerous.

Tools that solve this already exist. I discovered them after I made the app. The reason I kept building after I found that out was that a lot of them make families pay money just to be understood in a hospital. When I found that out, it honestly made me angry, charging someone to describe their pain to a doctor feels predatory to me. Being understood by your doctor should be a basic right, not a subscription. So I set out to build something that does everything the paid apps do, for free.

What it does

SanaSpeak lets a person who doesn't speak English tell a doctor what's wrong, just by tapping. No typing, no interpreter, no account.

Instead of typing, you build a card by tapping. You pick what you feel, point to where it hurts on a body map, and set how long it's been going on and how bad it is. The body map matters a lot, because it means the app works even if you can't read in any language.

It's a two way conversation. The doctor always reads a clean English card, and can tap replies back that the patient sees in their own language. The patient can even hear those replies read out loud, so it works for people who can't read at all.

There's more built in too. You can flag your medications, like blood thinners or insulin, which can be critical in an emergency. Urgent symptoms trigger a calm notice that this might be an emergency. The app only asks questions that make sense, so a fever won't ask you where it hurts. And there's a verified library of trusted medical phrases, which is the same feature other apps lock behind a paywall.

How we built it

The front end is React and Vite, with lucide for the icons. Read-aloud uses the browser's built in Web Speech API, so it's free and needs no external service. Live translation runs through a small serverless function on Vercel, which keeps the API key on the server instead of exposing it in the browser.

The most spoken languages are hand translated and baked directly into the app, so they work instantly and offline with no API at all. The whole thing is built around one rule: English is the source of truth, and the doctor always reads the English card, never a translation of a translation. You tap fixed English concepts that you see in your own language, and the doctor's card is generated straight from those, so a shaky translation can never change what the doctor actually reads.

Challenges we ran into

The hardest one was translation I can't personally verify. I can't check every language, and in a medical app a wrong word is dangerous. The canonical English design is my answer to that, since the doctor's side stays reliable no matter what.

Getting SanaSpeak live was harder than building it. I spent roughly two and a half hours fighting the deployment, and it turned into a real lesson in how many separate things have to line up for a full stack app to actually work.

It started with a 404 on the whole site. That turned out to be the Vercel Root Directory pointing at a subfolder that no longer existed after I moved my files. Once I fixed that and the site loaded, the translations still did nothing, with no error and no obvious reason.

I worked through it layer by layer. First I confirmed the build was actually green and not serving an old cached version. Then I checked whether the serverless function even existed by hitting the endpoint directly in the browser, which returned "Method not allowed," so I knew the function was live. Then I opened the network tab and saw the app was posting to the wrong place entirely.

That was the real bug, and I found it myself by reading the code line by line. The deployed app was still calling the AI provider directly from the browser instead of going through my serverless proxy, so every request failed silently. I had committed the wrong version of the file. Once I pointed the app at the proxy and pushed the fix, the request finally reached the server, and the error message changed, which meant it was working. The last issue was just a translation model name that didn't match my account.

The biggest thing I learned is that "it doesn't work" is never one problem. It was five different problems stacked on top of each other, the wrong root directory, a stale build, a caching issue, the app calling the wrong endpoint, and a bad model name. The only way through was to isolate each layer and prove it worked before moving to the next one. Using the browser network tab and hitting the API directly with curl to see the real response, instead of guessing, is what actually solved it.

Accomplishments that we're proud of

I built a genuinely complete, polished, and deployed app, solo, from scratch, in about a day. It's not a mockup. It runs live, it works on a phone, and the core experience works instantly and offline with no cost to anyone.

I'm most proud of the accessibility. Between the body map, read-aloud, big tap targets, and high contrast colors that pass WCAG AA, someone who can't read at all can still tell a doctor what's wrong. And I'm proud that it stands up to a real product that charges for this, while being free.

What we learned

The biggest lesson was that scoping tightly wins. A small, finished, reliable app beats an ambitious broken one, so every feature had to earn its place. I also learned that for an accessibility app, the design is the product. The body map, the audio, and the contrast are not decoration, they are the reason it works for the people who need it most.

I also got a real crash course in shipping a full stack app. Serverless functions, environment variables, keeping API keys off the client, and debugging a live deployment while the clock was running taught me more than any tutorial could.

What's next for SanaSpeak

Native speaker review of every translation, offline support for the full language set, and a mode built for clinicians with structured intake. But the core belief stays the same. Being understood by your doctor isn't a premium feature. It's a basic right, and SanaSpeak is free, and always will be.

Built With

• css
• html
• javascript
• react
• vercel
• vite
• web-speech-api