Inspiration

The inspiration for this project came from the urgent need to streamline volunteer support in medical and humanitarian contexts. Often, cases requiring attention are scattered across different systems, making it hard for volunteers to quickly identify and act on high-priority reports. I wanted to create a platform that consolidates cases, prioritizes them, and empowers volunteers to make meaningful contributions efficiently.

What it does

Medverse is a volunteer-focused case management platform that streamlines the way medical and humanitarian volunteers engage with urgent cases. Key features include:

  • Real-time case queue: Volunteers see new cases as they come in, with severity clearly indicated.
  • Detailed case insights: Each case includes age, gender, location, symptoms, AI-assisted diagnosis, and a description to help volunteers make informed decisions quickly.
  • Secure access & navigation: Volunteers can sign in safely, and navigate seamlessly to review cases.
  • Resilient backend handling: Cases load reliably even if the backend is slow or temporarily unavailable, using fallback demo data.
  • Interactive UI: Parallax scrolling and intuitive design enhance user experience while keeping functionality at the forefront.

How we built it

The project consists of two primary components:

  • Volunteer Sign-In: A secure authentication page that validates credentials, manages errors, and stores volunteer IDs locally.
  • Volunteer Dashboard:
    • Fetches cases from a backend API.
    • Displays cases with detailed info: age, gender, location, severity, symptoms, and AI-assisted diagnosis.
    • Implements features such as real-time loading states, refresh functionality, and navigation to detailed case reviews.

We used React for the frontend, TypeScript for type safety, and fetch API calls to a Node.js backend. The design incorporates a parallax scrolling UI to make the interface visually engaging while keeping it functional.

Challenges we ran into

  • Backend instability: Handling incomplete or delayed data from the API required building a robust fallback system with demo cases.
  • Dynamic UI updates: Synchronizing loading states, error handling, and live updates for volunteers without confusing the user.
  • Data transformation: Converting raw backend responses into clean, display-ready case objects, including generating readable locations and AI diagnoses.
  • User experience: Designing an interface that is both informative and easy to navigate for volunteers with varying technical backgrounds.

Accomplishments that we're proud of

  • Built a full-stack application connecting frontend React components with a backend API, implementing real-time updates and error handling.
  • Integrated AI-assisted diagnosis insights, helping volunteers triage cases more effectively.
  • Developed a robust and responsive UI with dynamic loading, refreshing, and empty/error states.
  • Created a scalable architecture that can support more volunteers and institutions as the platform grows.
  • Successfully handled complex data transformations, turning raw backend responses into user-friendly case displays.

What we learned

This project was a huge learning experience in multiple dimensions:

  • Full-stack development: Strengthened skills in React, TypeScript, and backend integration using REST APIs.
  • State management & UI design: Handling dynamic case data required careful state management, error handling, and designing an intuitive interface.
  • Real-world problem solving: Gained insight into building applications that can handle asynchronous data, network failures, and partial data gracefully.
  • DevOps & testing: Setting up a local backend, testing API routes, and implementing a fallback mechanism taught us about robustness in production-like scenarios.

What's next for Medverse

  • Global accessibility: Expand Medverse beyond local pilots to connect volunteers and institutions worldwide.
  • Institution integration: Enable hospitals, clinics, and NGOs to directly submit cases into the platform.
  • Enhanced AI features: Improve diagnosis recommendations and priority ranking for faster triage.
  • Mobile-first experience: Make Medverse fully accessible on smartphones for volunteers in the field.
  • Community engagement: Build tools for volunteer collaboration, feedback, and recognition.

Built With

Share this project:

Updates