## Inspiration In medical emergencies, the first 10 minutes—known medically as the Golden Hour—determine the boundary between life and death. The probability of survival decays exponentially with every passing minute of cardiac arrest or arterial hemorrhage: P(survival)=P0 ⋅e^−k⋅Δt
Where Δt represents bystander response delay and k is the critical decay factor. In India, the average emergency ambulance response time exceeds 15 to 30 minutes (Tambulance≫10 min), especially in rural regions, Tier-2/3 cities, and highway transit zones.
While existing first-aid apps exist, they suffer from three fatal flaws during panic situations:
The Connectivity Trap: They rely on high-speed internet and cloud APIs, failing completely during highway blackouts, monsoons, or remote excursions.
The Language & Panic Barrier: Complex text interfaces in English are unusable for non-English speakers experiencing severe adrenaline-fueled cognitive panic.
The Bystander Freeze: In severe emergencies, panicked bystanders often spend 10+ minutes desperately reading guides instead of calling national emergency services (112).
We asked ourselves: Can we build a zero-budget, 100% offline, panic-proof companion that guides any Indian citizen through life-saving first-aid with fluent Hindi voice coaching, anatomical animations, local remedies, and automatic 112 escalation?
That vision became RakshaSetu (रक्षासेतु) — a digital bridge of protection.
What it does
RakshaSetu is an all-in-one, zero-dependency offline emergency first-aid progressive web application built specifically for India’s 1.4 billion citizens.
📴 100% Offline Engine: Boots in under 1 second from device cache with zero network dependency. 🎙️ Fluent Bilingual Voice Coach: Native voice narration in both Hindi (हिंदी) and English, reading out exact physical hand placements, dosages, and warnings. 🤖 Offline AI Symptom Checker & Photo Wound Triage: A lightweight client-side scoring engine that maps symptoms to emergency protocols, paired with a guided wound identification system. 🎬 Split-Screen Anatomical Visual Simulations: Physiologically accurate SVG animated vector simulations: Adult CPR: Precise hand position at lower sternum with 110 BPM rhythm and 5.0 cm–6.0 cm chest recoil gauge. Tourniquet Windlass: Torsion stick technique with arterial pulse visualization. Heimlich Maneuver: Upward J-vector thrust diagram under the diaphragm. Recovery Position: Lateral airway maintenance and vomiting suffocation prevention. 🌿 Allergies & Local Remedies Guidebook: Dedicated treatment protocols for PITT (पित्ती / Hives & Urticaria), Food Allergies, Dust/Pollen, Insect Stings, and Drug reactions featuring verified Indian home remedies (Coconut oil + Camphor, Neem wash, Ice compress). ⏱️ Severity Auto-Escalation & 10-Minute Auto-Call: If a user remains on triage for Δt≥10 minutes, the system triggers a high-visibility warning and auto-dials 112 National Ambulance with snooze and cancel overrides. 📡 Live GPS SOS & Emergency Contacts: 1-tap coordinate resolution and automated WhatsApp/SMS emergency dispatch. 🪪 Offline Medical ID & Lockscreen ICE: Stores blood group, chronic conditions, and contact details securely on-device. How we built it We engineered RakshaSetu under a strict zero-budget, zero-framework constraint to guarantee unmatched speed, zero bundle overhead, and guaranteed offline execution on low-end budget smartphones.
┌───────────────────────────────────────────────────────────┐ │ RAKSHASETU ARCHITECTURE │ ├─────────────────────────┬─────────────────────────────────┤ │ Core Presentation │ HTML5 • Tailwind CSS • Lucide │ │ Offline Caching │ Service Worker Cache-First │ │ Real-Time Audio Engine │ Web Speech Synthesis API │ │ Voice Recognition │ Web Speech Recognition API │ │ Vector Physics & Motion │ Pure CSS3 Keyframe Engines │ │ Storage & Persistence │ HTML5 LocalStorage │ │ Geolocation Dispatch │ W3C Geolocation API + URL Schemes│ └─────────────────────────┴─────────────────────────────────┘ Service Worker Cache-First Layer: Built a custom sw.js cache pipeline that pre-caches the complete single-file bundle, allowing the app to install directly to mobile home screens as a standalone PWA.
Intelligent Voice Engine: Engineered a voice picker scoring algorithm that evaluates available local browser voices, prioritizing neural WaveNet/Natural voices and Indian accents (hi-IN / en-IN) with optimized speech rate (0.95×) for maximum clarity during panicking moments.
Client-Side AI & Fuzzy Search: Implemented a custom Levenshtein distance typo corrector and a 17-condition weighted keyword matching matrix (SYMPTOM_MAP) that runs in O(n) time without server roundtrips.
Anatomical SVG Vector Animations: Hand-coded animated SVG vector models calibrated to physiological standards (e.g., CPR oscillation frequency fCPR≈1.833 Hz≡110 compressions/min).
Challenges we ran into
Simulating Accurate Physics in Lightweight SVGs: Creating clear, non-confusing animations of human silhouettes (such as the inward-and-upward J-curve of the Heimlich thrust or CPR hand recoil) without heavy 3D frameworks (like Three.js) required extensive CSS keyframe math, transform-origins, and layered vector paths to keep file size under 300 KB.
Cross-Platform Hindi Speech Synthesis Inconsistency: Different Android versions, iOS Safari, and desktop browsers handle Hindi TTS voices unpredictably. We developed a multi-tier fallback heuristic that dynamically tests browser audio synthesizer capabilities and falls back gracefully to localized phonetic speech strings.
Balancing AI Guidance with Medical Safety: Designing an offline symptom checker carries high clinical responsibility. We engineered clear, non-intrusive safety guardrails, explicit bilingual medical disclaimers, and automated red-flag triggers that instantly prioritize 112 Emergency Ambulance calls when high-risk conditions are detected.
Accomplishments that we're proud of
🏆 Entire App Packaged in ≈320 KB: Zero npm build dependencies, zero API costs, zero database overhead. 📴 True Airplane Mode Reliability: Complete functionality—from AI triage and voice coach to GPS coordinate calculation—operates flawlessly with Wi-Fi and mobile data disabled. 🇮🇳 Deep Cultural Localization: Integrated traditional Indian first-aid terminology (such as PITT / पित्ती treatments using camphor and coconut oil) alongside evidence-based medical standards. ⏱️ Panic-Proof Bystander Safety Net: The 10-minute auto-escalation timer solves the classic bystander freeze problem, ensuring that emergency services are called even if the bystander panics. What we learned Simplicity Saves Lives: In emergency UX, every extra second of loading time or cognitive friction is dangerous. Direct typography, high-contrast color palettes (Red #ff0033, Amber #ffaa00, Emerald #00d4aa), and instant audio feedback are far more effective than complex multi-level menus. The Power of Vanilla Web APIs: Modern browser capabilities (Service Workers, Speech APIs, Geolocation, Vibration) are powerful enough to build production-grade, offline-first assistive tools without heavy backend servers.
What's next for Raksha Setu
📡 Mesh Network Relay (Bluetooth / Wi-Fi Direct): Enable nearby devices running RakshaSetu to create peer-to-peer offline emergency distress beacons when cell towers fail during natural disasters. 🗣️ Expanded Regional Indian Languages: Add voice coaches for Tamil (தமிழ்), Telugu (తెలుగు), Bengali (বাংলা), Marathi (मराठी), and Punjabi (ਪੰਜਾਬੀ). 📷 On-Device TensorFlow.js Wound Computer Vision: Deploy a quantized, offline MobileNet model to analyze wound depth and burn degree directly through camera sensor frames. 🤝 Emergency Responder Integration: Partner with local disaster response teams and community health workers to distribute RakshaSetu as an offline civic emergency tool across rural schools and transport hubs.
Built With
- accessibility
- ai
- cross-platform
- css3
- emergency-response
- first-aid
- gemini
- geolocation-api
- healthcare
- hindi
- html5
- javascript
- offline-first
- public-safety
- pwa
- service-worker
- social-impact
- tailwindcss
- web-speech-api
Log in or sign up for Devpost to join the conversation.