Clearwater Health

• 

  Main Page

• 

  Log-In through Phone Number

• 

  OTP

• 

  Patient Page

• 

  Nurse Call from Patient

• 

  Healthcare Worker Page

• 

  Emergency Mode Activation

• 

  Accessibility toggles

• 

  Patient Storm Mode

Project Name

Clearwater Health

Slide Deck

https://docs.google.com/presentation/d/1mNyWz6XX6ePXFKRUiVQqxsK4DM6-c48UAMIwoM4p0zg/edit?usp=sharing

Short Description

A rural care coordination dashboard improving communication between patients and nurses in remote communities during travel disruptions.

Inspiration

Living in or near rural communities like Clearwater Ridge, we've seen firsthand how isolation impacts health outcomes. Simple issues often escalate into emergencies because patients can't easily get to a hospital, and local nurses are overwhelmed with manual tracking. When we heard about the challenges of care continuity during travel disruptions (like snowstorms), we knew we wanted to build something that bridges the gap between the living room and the nursing station.

What it does

Clearwater Health is a lightweight healthcare coordination platform designed for remote communities.

• For Patients: It provides a simple dashboard to view appointments, track medications, and request non-emergency assistance via a "Call Nurse" button. It also supports virtual check-ins.
• For Nurses: It offers a real-time overview of all patients in the community, with status indicators (Stable, Needs Attention, Urgent). It features an "Emergency Mode" that instantly alerts all staff and prioritizes critical cases during crises like severe weather.
• Key Benefit: It ensures care continuity even when physical travel to the clinic or hospital is impossible.

How we built it

We prioritized speed and reliability.

• Frontend: We used React with Vite for a snappy, modern experience.
• Styling: Tailwind CSS allowed us to rapidly prototype a clean, calming interface suitable for healthcare settings.
• Backend: Supabase was our hero here. It handled:
  • Authentication: Secure OTP (One-Time Password) login (via Twilio/Supabase) was crucial for elderly patients who struggle with complex passwords.
  • Database: Real-time subscriptions enabled the "Emergency Mode" feature, instantly alerting all connected dashboards.

Challenges we ran into

• State Management: Synchronizing the "Emergency Mode" across different clients in real-time was tricky. We had to ensure that when a nurse hits the red button, every patient dashboard reacts immediately.
• Role-Based Logic: Designing two completely different views (Nurse vs. Patient) within the same application required careful routing and state protection to ensure data privacy.
• Simulating Real World Data: Creating realistic dummy data to demonstrate the extensive filtering capabilities of the nurse dashboard took significant thought.

Accomplishments that we're proud of

• The "Emergency Storm" Mode: It looks cool, but practically, it demonstrates how a digital system can instantly adapt to environmental crises.
• Seamless OTP Login: Implementing a password-less flow that actually feels secure and easy to use.
• UI/UX Design: We managed to create an interface that feels professional and trustworthy, while being easy to use for senior citizens.
• Accessibility Icon: An additional feature that allows users who have difficulty reading to adjust the interface for better readability.

What we learned

• Healthcare is about trust: The UI needs to be clean, accessible, and error-free. A confusing interface in a health app can be dangerous.
• Supabase is powerful: The speed at which we could stand up a backend including Auth and DB allowed us to focus 90% of our time on the user experience.
• The importance of empathy: Building for "Clearwater Ridge" forced us to think about users who might have spotty internet or limited tech literacy.

What's next for Clearwater Health

• Telehealth Integration: Implementing real WebRTC video calls explicitly within the platform.

Built With

• react
• supabase
• tailwind
• vite