Do you like poking things?
Quick background: I run a sysadmin help site (pragmaticsysadmin.help). A few months ago I started thinking about who else struggles with the same basic computer illiteracy my clients have — and the answer was obvious: my mom. And her friends. And basically everyone over 70.
So I built a free web app for them. It's called Buddy. One-tap calls to family, daily medicine check-offs, a scam-message pattern checker, and step-by-step guides for things like "how do I take a screenshot on this thing."
Live at https://pragmaticsysadmin.help/buddy/ if you want to poke at it.
I'm posting here because I learned some things building it that I think are relevant to anyone who designs for users with accessibility constraints — and also because the architecture might interest the vanilla-JS-curious among you.
The stack:
- Zero build step. No npm, no webpack, no transpilation. Just three files: index.html, style.css, app.js.
- No backend. Everything in
localStorage. Privacy-first, no accounts. - 7 languages with full UI translation including all help content. (English, Spanish, French, German, Portuguese, Chinese, Finnish — chose by the senior populations in each.)
- Locale-aware emergency numbers. US users see "Call 911," EU users see "Call 112," Brazilian users see "Call 190," Chinese users see "Call 110." Same code, different output.
- Demand validation built in. Tracks unique-day visits, prompts for feedback after the 2nd use (max once per 30 days). Lets me measure if anyone actually uses it before I invest in monetization.
What I learned about accessibility-first design:
- 1.Default to the lowest-common-denominator device. My development iPhone has a great screen. My target user has a five-year-old Android with a cracked screen protector and bifocals. Designing for them made it better for everyone.
- 2.Touch targets need to be absurd. Material Design says 48dp minimum. My tiles are 150px+ square with text inside. After a few rounds with my mom, I realized: if it's not obviously tappable to someone with shaky hands and reduced motor control, it's broken.
- 3.Localization is harder than translation. Finnish needed 112 instead of 911 for emergency. Some cultures use formal/informal "you" — Spanish requires careful choice between tú and usted depending on context. The phone number placeholder for a Finnish user shouldn't be
555-123-4567. Date formats vary. Time-based greetings ("Good morning") don't always translate literally. - 4.Demand validation prevents you from building the wrong thing. I was about to build a family dashboard with cross-device sync. Instead I built the feedback prompt first. Got 0 "I'd pay for this" signals in the first month. The free version was enough. I would have wasted weeks building the wrong thing.
- 5.Vanilla JS is still viable. The whole app is ~600 lines of plain JavaScript. No framework, no build. It's faster to load than any React app I've shipped. For simple interactive pages, the pendulum has swung too far toward frameworks.
The repo is open:
https://github.com/JRone-git/pragmatic-sysadmin/tree/main/static/buddy
If you're the kind of person who likes finding bugs in accessibility implementations, please break it. I want to know what's broken before real users hit it.
Things I'd love feedback on:
- The scam detection patterns. I have 10 regex rules. What's missing for non-English-speaking users?
- The locale auto-detection logic. I fall back through
navigator.language→ base language code → English. Is there a better way? - The font choice (Lora serif for headlines, system sans for body). Is that the right call for an aging-eye audience?
Happy to answer questions about any of it.