Inspiration
For many older adults, a smartphone is the way to see grandkids’ photos, call a friend, or keep a doctor’s appointment, but the first attempts are stressful. One wrong tap can send a message to the wrong person, and scam texts add a real fear for older folks who don't know what to do. Our goal was to make older adults feel more confident using their iPhone!
What it does
iLearn is a safe practice space for learning the iPhone. Inside the app is a fully interactive, fictional iPhone with Messages, Phone, Calendar, and Camera apps, populated with made-up contacts and photos. Every lesson comes in two modes: Tutorial: glowing highlights show exactly what to tap, with a plain-language explanation at every step. Guided practice: the highlights are off, and the learner can ask for a hint when stuck.
How we built it
iLearn is a web app built with React and Vite. The practice iPhone is built from scratch with custom icons and styling so it looks and feels like the real thing. We used the browser’s built-in speech support to read instructions aloud, and we save progress privately on the user’s own device, so there are no accounts and no data collected. App screens were designed and prototyped first in Figma.
Challenges we ran into
Designing for accessibility from the start: contrast, tap-target size, spoken instructions, and tone. And a more humane approach to understanding the perspective of a senior citizen using a phone: we needed to make a practice phone that is realistic enough to transfer to a real iPhone, but forgiving enough not to punish mistakes.
What we learned
We learned that for this audience, tone and pacing matter as much as features. Short steps, reassurance, and a no-rush attitude change how the app feels.
What's next for iLearn
More lessons (video calls, Wi-Fi, text size, photos and albums, emergency contacts), larger text and language options, a “family mode” so a grandchild can assign lessons and see progress, and testing with real older adults and community senior centers and libraries to refine the pacing and wording.
Built With
- css
- figma
- javascript
- react
- vite
- web-speech
Log in or sign up for Devpost to join the conversation.