Inspiration : In an emergency, every second counts. LifeSaver is a one-tap web app that instantly shares your location, connects you to mental health resources, and helps you stay calm when it matters most. No logins, no distractions — just pure help, fast

What it does : LifeSaver is a fast, one-tap emergency web app that shares your location and gives instant access to mental health support — no login, no delay

How we built it : We built LifeSaver using simple, lightweight web technologies to ensure it loads fast and works anywhere:

HTML, CSS, JavaScript – For the frontend structure, styling, and interactive behavior.

Geolocation API – To detect the user's current location in real time.

Leaflet.js – For displaying the user’s location on an interactive map.

Vanilla JavaScript – Used for handling button actions, geolocation logic, and DOM updates.

External Links – We included curated mental health resources, motivational quotes, and breathing guides to provide immediate emotional support.

Challenges we ran into : Limited Time: With only a few hours to build, we had to prioritize simplicity and core features over complexity.

Geolocation Permissions: Some browsers required special permission or HTTPS to access location data reliably.

Map Integration: Getting Leaflet.js to display dynamic locations smoothly took time to debug.

No Backend: Without a server, we had to simulate emergency messaging features instead of sending real alerts.

Mobile Responsiveness: Making the UI clean and functional across different screen sizes in a short time was tricky

Accomplishments that we're proud of : Built a fully functional emergency web app in under 6 hours.

Integrated real-time location sharing using the browser’s Geolocation API.

Displayed a live map with Leaflet.js — lightweight and mobile-ready.

Designed a clean, accessible interface with zero dependencies or login required.

Included mental health support tools to go beyond just emergency help.

Made it work on both desktop and mobile, even with limited testing time.

Created a project with real-world impact — simple enough to actually be used.

What we learned : How to build and deploy a working web app under extreme time pressure.

How to use the Geolocation API and Leaflet.js to get and display real-time location data.

The importance of designing for clarity and urgency — especially in emergency tools.

How to make a simple app feel meaningful through design and user experience.

How to prioritize core functionality over features when time is limited.

That even basic web tools can be used to create something useful and human-centered

What's next for Life Saver : Real Emergency Messaging: Integrate with SMS APIs (like Twilio) or email to actually notify emergency contacts.

Offline Support: Cache key features so users can still access help even without a strong internet connection.

Custom Emergency Contacts: Let users save personal emergency numbers locally with encryption.

More Mental Health Tools: Add breathing timers, guided meditations, and multilingual support.

PWA Version: Turn LifeSaver into a downloadable app for mobile use — with notifications and offline features.

Accessibility Improvements: Make it more usable for people with visual or cognitive impairments.

Community Mode: Add an anonymous support chat (with moderation or AI help).

Built With

Share this project:

Updates