UX7: Accessible and inclusive design
Inclusive design for India
🎯You'll be able to
Design for many languages, different literacy levels, budget phones, slow connections and shared devices.
🏠The everyday picture
A good railway announcement is made in Hindi, English and the local language, with a display board for those who can't hear. The service is designed for everyone who travels, not just one kind of traveller.
📘What it really is
-
Languages: plan for Hindi and other Indian languages from the start. Strings outside images; layouts that allow longer words; fonts that support each script; a language switch that's easy to find and remembers the choice.
-
Literacy and familiarity: short sentences, common words, icons with words, and examples ("For example, Aliganj"). Some people prefer voice or a phone call; offer it.
-
Budget phones and slow connections: small pages and images, system fonts, and working without heavy scripts. Show progress when something loads, and keep forms safe if the connection drops.
-
Data costs: avoid autoplay videos and large downloads.
-
Shared and assisted use: one phone may be used by several family members; P1's son usually books for them. Don't show other people's data, mask personal details (show only the last four digits of a phone number), and make it easy to book for someone else.
-
Older users: larger text, clear states, fewer steps, no time limits that rush people.
- Respect and dignity: avoid assumptions about gender, caste, religion or family structure in forms; ask only what's needed.
📝A worked example
Input: the confirmation page.
| Starter | Problem | Reference |
|---|---|---|
| "Done!" and a one-line summary ending with the full mobile number | Full number visible to anyone nearby (P4); no next step | "Your appointment is booked", "Mobile number: Ending in 4321", "What happens next" |
| English only, "OPD" | Jargon; no language plan | Plain words; the capstone design notes plan Hindi |
Expected output: test 10 of npm run test:prototype finds "Ending in 4321" and no full number on the confirmation page.
🌍Where it's used
- Government schemes, used by people with very different literacy and devices.
- Banking, where many first-time users bank on a phone.
- Health, where carers often book for patients.
📝Case scenario
A crop insurance app was designed in English for new smartphones. Uptake among farmers was low. A redesign with Hindi and Marathi, voice help, large buttons and a light version that worked on 2G connections increased claims filed through the app.
🖱️Try it
Pick one screen of the SehatSlot prototype and list what would change for (a) Hindi, (b) someone booking for a parent, (c) a budget phone on a slow connection. Success: at least two changes for each.
⚠️Common mistakes
- Translation at the end. Sign: text inside images; layouts that break with longer words. Fix: plan languages from the start.
- Assuming one user per phone. Sign: other family members' bookings visible to anyone. Fix: mask details; support booking for others.
- Heavy pages. Sign: large images on every screen. Fix: small assets and system fonts.
🛠️For your project
The capstone's design notes include languages and literacy, and Project 2's safety item is about hiding the full phone number.
✅Quick check
Why mask phone numbers on a confirmation page?
Show the answer
Phones are often shared or seen by others, so showing the full number exposes personal data.
Name two ways to design for slow connections.
Show the answer
Small pages and images, and system fonts (also progress indicators and forms that survive a dropped connection).