DuskDrop — Real-Time Homeless Shelter Finder

Find a safe bed in 60 seconds. Not 47 minutes.

Comment

Inspiration

We started this hackathon knowing we wanted to solve something real. One statistic stuck with us: 650,000 Americans experience homelessness every night, and most of them have no way to quickly find a safe place to sleep. The problem hit us when we researched the current process. A person in crisis has to call 211 (a helpline), wait on hold for minutes, get transferred, call shelters individually, face rejection after rejection. By the time they find an open bed, they've spent nearly 47 minutes on phone calls while standing in the cold. We thought—this shouldn't take 47 minutes. This should take 60 seconds. That's when we decided to build DuskDrop. A too

What it does

DuskDrop is a real-time homeless shelter finder that helps anyone in crisis find a safe bed in 60 seconds or less. Core Features:

Instant Search - Enter your city and search radius. The app instantly shows every shelter nearby, sorted by distance and bed availability. Smart Filtering - Tell us what matters:

🐕 Traveling with pets? 👨‍👩‍👧 Have children? ⚕️ Need medical care? 🌈 Looking for LGBTQ+ friendly space? ♿ Need accessibility?

The app filters results in real-time to show only shelters that match your needs. AI-Powered Ranking - Each shelter gets a 0-100 "fit score" based on:

How close it is to you How many beds are actually available What services it offers Whether it matches your specific needs

Best match always appears first. One-Tap Booking - Click reserve, fill in name/phone/people count, hit confirm. You get a unique reference code in under 10 seconds. No account needed. No personal data stored unnecessarily. Track Your Bookings - See all your reservations, call the shelter directly from the app, cancel if needed. Works Everywhere - No login required. Works offline. 12+ language support planned. Any phone, any device, 24/7.

How we built it

We kept the tech stack simple and fast so the app could launch quickly: Frontend Stack:

HTML5 + CSS3 - Semantic markup, responsive grid layout, dark theme with teal accents Vanilla JavaScript - No frameworks. Pure DOM manipulation, event listeners, state management LocalStorage API - Bookings persist locally (user's device, completely private)

Core Algorithms:

Haversine Formula - Calculates real distances between user location and shelter coordinates Distance Sorting - Shelters sorted first by availability (beds open = priority), then by distance Multi-Filter Logic - Active filters use Set data structure for fast O(1) lookup

Data:

45 Shelters across 15 US cities (Austin, Houston, Dallas, San Antonio, Denver, Phoenix, Las Vegas, LA, San Francisco, Seattle, Portland, Chicago, Atlanta, Miami, New York) Each shelter has: name, address, phone, latitude/longitude, bed capacity, services offered

Demo & Video:

Audacity - Recorded voiceover (clear, slow pace for accessibility) DaVinci Resolve - Video editing, text overlays, audio mixing, color grading YouTube Audio Library - Royalty-free background music Final video: 3:50 minutes, 1920×1080 resolution, MP4 format

Development Timeline:

Day 1-2: Brainstorm, research, gather shelter data Day 3-4: Build frontend, implement search & filtering, create booking system Day 5: Design UI, polish interactions, add responsive design Day 6: Record voiceover, edit demo video, create graphics Day 7: Final testing, documentation, submission prep

Challenges we ran into

  1. Real-Time Data Problem

We wanted real bed availability, but shelters don't have APIs. Solution: We built realistic mock data based on average occupancy rates and made the system ready to integrate with real data later.

  1. Time Crunch

A full-stack project (data collection, frontend, backend-less design, video production, presentation) in one week is intense. We had to ruthlessly cut scope—no user accounts, no complex backend, no payment processing. Just the core: search → filter → book.

  1. Geolocation Complexity

Converting "Austin, Texas" to exact coordinates requires a geocoding API. For the hackathon, we hardcoded 15 city coordinates. Real deployment would integrate Google Maps API or similar.

  1. Mobile Responsiveness

Half our users would be on phones in crisis. Every button had to be large (minimum 44px), forms short, interactions instant. We rewrote the layout 3 times to get it right.

  1. Video Production Learning Curve

None of us had done professional video editing before. Learning Audacity, DaVinci Resolve, syncing audio to video, color grading—took us 12+ hours. But the final product is polished.

  1. UX Decisions

Do we ask for email? Name? ID? We decided: minimal friction. Just first name, last name, phone number, people count, special needs. Everything optional except name/phone. This taught us that less is more.

Accomplishments that we're proud of

✅ Built a working product in 7 days - From idea to live, deployed app. ✅ Zero dependencies - No frameworks, no backend servers, no external APIs required. Pure HTML/CSS/JS. This means instant load, works anywhere, low maintenance. ✅ Real data collection - We didn't just fake shelter data. We researched 45 real shelters, verified addresses, got accurate phone numbers, learned their services. ✅ Thoughtful UX - The booking form takes 30 seconds. We prioritized privacy (no account needed) and accessibility (large buttons, clear language, multiple languages planned). ✅ Professional video demo - 4-minute video that tells the full story: problem → solution → demo → impact. With voiceover, music, smooth editing. Judges will see the product in action. ✅ Haversine implementation - We implemented accurate distance calculations from scratch, so results are geographically real. ✅ Responsive design - Works perfectly on phones (1 column), tablets (2 columns), desktop (3 columns). Tested on multiple devices. ✅ Persistence layer - Bookings save to device storage, so users can close the app and come back to their reservations. ✅ Inclusive design - Thought about pets, families, medical needs, LGBTQ+ safety, accessibility. Every filter exists because someone needs it. ✅ Clear documentation - Code is readable, commented, ready for handoff or open-source contribution.

What we learned

Technical:

Vanilla JS is powerful - We built a complex app without React, Vue, or any framework. This forced us to understand core JavaScript concepts: DOM manipulation, event handling, state management, asynchronous operations. Responsive design is hard - Making something work on a 320px phone and a 2560px monitor requires careful planning and CSS media queries. LocalStorage has limitations - It's great for offline-first apps, but doesn't sync across devices. This taught us why real apps need backends. Haversine formula actually works - Math matters. We implemented the distance calculation from scratch and tested it against real-world coordinates.

Product Design:

Constraints breed creativity - Limited time forced us to focus on the core feature (search → filter → book). No extra features, no scope creep, no bloat. Users need simplicity - People in crisis don't want to fill out long forms. Every question we removed was a win. Data quality matters - Garbage data = garbage product. Verifying shelter info was tedious but essential.

Teamwork:

Pair programming works - Arin and I divided tasks (frontend/data vs. design/video), but paired on debugging. It caught bugs early. Communication is everything - We had a shared document with decisions, progress, blockers. This kept us aligned. Celebrate small wins - Every milestone (first search result, first booking, video done) kept morale up in a stressful week.

Hackathon Lessons:

Start with the problem, not the technology - We asked "what's the real problem?" before touching code. Build something people actually want - We got feedback from homeless advocacy groups. That grounded us. Ship it, don't perfect it - Our code isn't perfect, but it works. Done > perfect.

What's next for DuskDrop — Real-Time Homeless Shelter Finder

Phase 2 (Months 1-3):

Integrate real shelter databases (211.org, local housing authorities) Add real-time bed availability (shelters push updates) SMS confirmation texts for bookings Support for 12+ languages (starting with Spanish, Mandarin, Arabic) Emergency call button (connects to 911 + sends location)

Phase 3 (Months 4-6):

User accounts with booking history (optional, privacy-first) Shelter ratings & reviews (from users, to help others) Case manager integration (shelters can follow up with bookings) Partnership with cities (integrate into official 211 systems) Mobile app (iOS + Android)

Phase 4 (Months 7+):

AI training on real shelter data (actual demand patterns) Predictive bed availability (machine learning) Housing navigation tools (connect to job training, housing programs) Nonprofit partnerships (funding, operations) National expansion (all 50 states)

Long-term vision:

We want DuskDrop to be the standard way homeless individuals find shelter in the US. Not a side project—integrated into 211 call centers, city services, hospitals, police (for welfare checks), faith communities. Every person in crisis should find a safe bed in 60 seconds, not 47 minutes.

Built With

Share this project:

Updates