Unity Blood

Donor Registration Page.Donors check eligibility and register instantly to appear on the live map for nearby hospitals and patients in need.
Clinic Dashboard: Post emergency requests, view donors on a live map, and instantly alert compatible donors nearby.
Live Alerts Dashboard: Instantly see patients needing blood and nearby available donors in real time
Our full-stack blood donation flow — from donor eligibility checks to real-time alerts and map tracking

Inspiration

During my B.Tech, one of my cousins experienced a sudden, life-threatening drop in blood cell count. Because his blood type was rare, my family struggled desperately to find donors. We called relatives, searched distant blood banks, and posted on social media. Finally — at the very last moment — we found a few donors willing to help.

It was a true “touch and go” experience. That day I realized something important: while we have apps for food delivery, ridesharing, and almost every convenience, there was no widely used platform to instantly connect blood donors with patients in emergency need.

That moment stayed with me. I finally had the skills and the opportunity to turn that idea into reality — building UnityBlood, a platform designed to make lifesaving donor–patient matches faster and easier.

What it does

*Unity Blood bridges the gap between patients in need and donors willing to help. *

Donor Dashboard:

Donors register with their details.

They pass through a quick eligibility check based on Red Cross guidelines.

Their live geolocation (city-based) is tracked once they’re available.

Clinic Dashboard:

Clinics can post new patient emergencies in real time.

The system automatically matches patients with the closest, blood-compatible donors.

Donors receive instant alerts (web push + email) about the emergency and how far they are from the patient.

Live Tracking & Alerts:

Donors can see how far they are from the patient’s location.

Clinics can track available donors in real time.

Together, the system reduces the response time so that lives can be saved.

🧩 The Parts

Donor Dashboard (left): PWA where donors check in, declare availability, and pass eligibility rules.

Clinic Dashboard (right): Used by clinics/ER staff to post emergencies and view the live donor map.

Supabase (center): Single backend — Postgres (data), Realtime (live updates), Storage (CSV logs), Edge Functions (logic).

Eligibility Service: Applies Red Cross criteria (age, weight, health questions, last donation).

Geocoding API: Converts donor’s city → approximate latitude/longitude (no GPS required).

Notification Service: Sends alerts (push) to compatible donors.

How we built it

Frontend: HTML, CSS (Bootstrap), JavaScript for donor & clinic dashboards.

Backend: Python (Flask initially for APIs & matching logic).

Database: Supabase (stores donors, patients, and alerts).

Geolocation: Browser geolocation API + Maps integration for distance calculation.

Notifications: In-app “Alerts” triggered by database changes (Realtime events).

Challenges we ran into

Real-time map visualization: Implementing an interactive map to show both donors and patients within calculated miles was technically demanding. We had to accurately plot locations and update them live.

Live updates & push notifications: We wanted donors to receive instant notifications when a patient needed blood nearby. Creating that real-time pipeline under hackathon constraints was challenging.

Synthetic data generation: Because live donor data was unavailable, we built a realistic synthetic dataset to simulate donors, patients, distances, and urgency levels — enabling us to test and demo the system effectively.

Precise matching: We developed logic to calculate blood type compatibility and geographic proximity simultaneously to ensure the right donor was matched to the right patient.

Time pressure: Designing and connecting both the donor interface and clinic dashboard while also handling data pipelines and geolocation calculations in a single weekend.

Using Supabase for the first time: We had to learn how to structure tables, manage . It was a big learning curve.

Data consistency: Preventing duplicate donors or missing patient records across Supabase and our Python backend required extra validation.

Accomplishments that we're proud of

End-to-end working system: We successfully built Unity Blood, where donors can register, clinics can post emergencies, and alerts go out in real-time.

Overcame Supabase learning curve: Despite being first-time users, we set up databases, RLS, and real-time syncing across dashboards.

Geolocation with fallbacks: Even when users denied GPS access, our app smartly switched to city-based coordinates, ensuring we could still estimate donor–patient distance.

Cross-dashboard integration: Donor and clinic dashboards stay synchronized, meaning clinics see new donors right away and donors see patient alerts immediately.

Resilient architecture: We managed to stitch together multiple tools (Python, Supabase, Maps,) into a system that actually works under time pressure .

What we learned

Supabase Realtime is powerful but nuanced: We learned how to model donors, emergencies, and alerts as tables and let Supabase’s Realtime streams automatically push changes to both dashboards—removing the need for a heavy custom backend.

Eligibility checks aren’t trivial: Implementing Red Cross–style rules (age, weight, last donation, health conditions) taught us how critical it is to get edge cases right. We also learned how to capture why someone is ineligible, not just whether they are.

Geolocation ≠ GPS only: Many users won’t grant GPS permissions. We learned how to fall back to coarse city-based geocoding, still useful for matching and routing. Balancing accuracy vs. privacy was an important design insight.

Alerts are a UX problem as much as a tech one: Simply writing data to a database isn’t enough; presenting it as timely, actionable alerts is key. We experimented with Realtime-driven UI updates to simulate “push notifications” directly in the dashboard.

Hackathon speed vs. production design: At first we tried a Flask backend for everything, but we learned that leaning on Supabase SDKs and Edge Functions sped us up dramatically. This project showed us how far you can get with serverless-first design.

Team workflow matters: We discovered the importance of separating responsibilities (donor flow, clinic flow, backend, maps) and working in parallel, then wiring it all together near the end.

What's next for Untitled

We’ve built the foundation — instant donor–patient matching via Supabase, realtime dashboards, and city-level geolocation. Here’s where Unity Blood is going next: *Smarter Donor Commitments *

When a donor taps “I can come”, their record in Supabase updates with:

availability_status = "Reserved"

reserved_until = +20 min

Optionally, reveal precise lat/lon for routing.

Supabase Realtime streams this instantly to the Clinic Dashboard → staff immediately see who accepted and how far they are.

*Dynamic Prioritization Algorithm *

We will introduce a scoring system to rank and prioritize donors dynamically:

Distance: closer donors score higher.

Blood Type Rarity: rare groups (AB–, O–) get weighted priority.

Recent Activity: active donors rise higher in the list.

Availability: donors marked “Available Now” or “Reserved” get preference.

AI-powered demand prediction: forecast shortages in specific regions using past emergencies + donor density.