MediShield

Inspiration

The idea for MediShield came from a simple but alarming gap in emergency healthcare: when someone collapses on the street or is in an accident, first responders often have zero information about them — no blood group, no allergies, no chronic conditions, no emergency contact. Precious minutes are lost figuring out basic facts that could be life-or-death, especially for patients who are unconscious or unable to communicate.

What it is

MediShield is a QR-based emergency health card that shows different information depending on who scans it. Random bystanders see only the patient's name, emergency ID, and quick-call buttons for an emergency contact or ambulance — no medical data. Verified hospitals and ambulance staff, after logging in, unlock the full record: blood group, allergies, medications, conditions, insurance, and history. Every scan is logged with time, location, and purpose, with instant alerts sent to the patient and their contacts. It supports offline access for ambulances, AES-256 encryption for all data, and separate dashboards for Patients, Hospitals, Ambulance Staff, and Admins.

How we built

We built MediShield as a front-end prototype using HTML, CSS, and JavaScript, with the qrcodejs library for dynamic QR generation. Role-based login switches between four dashboards (Patient, Hospital, Ambulance, Admin), each pulling from different data subsets — public scans see minimal info, while verified roles unlock the full record. Scan logs, audit trails, geo-tagging, and offline mode are represented through mock data and UI states to demonstrate the intended system behavior. The pitch deck was generated programmatically using pptxgenjs in Node.js.

Challenges we ran into

Designing the privacy boundary convincingly — making sure the public QR view and the verified-access view felt like genuinely different security tiers, not just "the same page with some fields hidden," meant carefully separating what data each role's renderer could even touch. Balancing realism with a front-end-only prototype — things like AES-256 encryption, GPS geo-tagging, and offline sync are backend/device-level features. Representing them convincingly in a UI-only demo (without a real backend) took some thought around what to mock vs. what to leave clearly labeled as a future integration. Keeping four very different dashboards consistent — Patient, Hospital, Ambulance, and Admin each needed their own layout and data view, but we wanted them to feel like one coherent design system rather than four separate apps. Fitting a complex feature set into 10 slides — condensing security, RBAC, geo-alerts, offline mode, and a roadmap into a tight, visually clean hackathon deck without it feeling overcrowded.

Accomplishments we're proud of

We built a working privacy boundary where the same QR code reveals almost nothing to a random scanner but unlocks full medical records for verified hospitals and ambulances. We also delivered four distinct, fully functional dashboards (Patient, Hospital, Ambulance, Admin) with a consistent, professional design — and a complete interaction flow from QR scan to access logging to emergency alerts, all in a single hackathon build.

What we learned

Building MediShield taught us that privacy and usability aren't opposites — showing less by default (to the public) while making more available instantly (to verified responders) actually makes the system both safer and more useful. We also learned how much complexity sits behind "simple" emergency-tech ideas: things like encryption, offline sync, and geo-tagging look trivial on a slide but require real architectural decisions once you try to design them properly. Finally, working across four different user roles pushed us to think in terms of permissions and trust levels from the start, rather than bolting access control on at the end.

What's next for MediShield

The next step is moving from prototype to a real backend — implementing actual AES-256 encryption, authentication, and a database to replace the mocked data. From there, the roadmap follows what we outlined in the deck: building out the hospital and ambulance dashboards with live GPS and push notifications, adding true offline-first support for ambulance staff, and integrating with blood bank networks. Longer term, we want to connect MediShield to national health systems like India's ABDM, explore AI-assisted triage from a patient's history, and support wearable/IoT data so emergency profiles can update automatically based on real-time vitals.