TriageAI: Project Story

Inspiration

Every day, millions of people turn to search engines to decipher their symptoms, only to be met with alarming, worst-case scenarios that cause unnecessary panic or vague advice that leads to delayed medical care. We realized there was a critical gap between anxious "Dr. Google" searches and actual medical consultation. We were inspired to build TriageAI to bridge this gap: a calm, professional, and transparent platform that doesn't diagnose, but rather guides users on when to seek care, where to go, and most importantly, why. We wanted to replace anxiety with actionable, evidence-based clarity.

What it does

TriageAI is a premium, AI-powered symptom analysis and triage platform. Users are guided through a sleek, multi-step intake process where they report primary complaints, duration, clinical severity on a 1-10 scale, associated symptoms, and pre-existing comorbidities.

The engine then processes these inputs against established clinical guidelines to generate an Urgency Verdict (e.g., "Go Now", "See Someone This Week", "Monitor at Home"). Uniquely, TriageAI provides:

1. Clinical Reasoning: A transparent, cited explanation of why the verdict was reached.
2. Confidence Scores: A percentage indicating the system's certainty, explicitly highlighting when human evaluation is critical.
3. Care Routing: Curated, nearby care options ranging from Level I Trauma Centers to local urgent care clinics.
4. Symptom Tracking: A secure dashboard to monitor how symptoms evolve over days or weeks.

How we built it

We prioritized a high-fidelity, production-ready stack designed for performance and trust.

• Frontend: We built the application using React and TypeScript, bundled with Vite for blazing-fast performance.
• Design System: We utilized Tailwind CSS to engineer a custom "luxury dark mode" aesthetic. We completely stripped away generic UI templates in favor of custom glassmorphism components (backdrop-blur), dynamic gradients, and sophisticated micro-animations (staggered fade-ins, floating elements) to establish immediate visual trust and professionalism.
• Backend & Database: We integrated Supabase (PostgreSQL) to securely store and fetch encrypted symptom histories and user timelines in real-time.
• Architecture: We implemented a modular, component-driven architecture to seamlessly manage complex state across the multi-step triage form and the history dashboard.

Challenges we ran into

One of our primary challenges was establishing trust through design. In health-tech, generic or overly simplistic UIs can make users skeptical of the underlying technology. We spent significant time refining the CSS, implementing custom keyframe animations, and tuning the color palette to achieve a truly premium, clinical feel.

Another technical hurdle was state management and secure data flow. Ensuring that multi-step form data seamlessly transformed into a structured database payload—while handling edge cases like missing environmental variables or network latency—required rigorous error handling and asynchronous logic refactoring.

Accomplishments that we're proud of

We are incredibly proud of the UI/UX transformation. TriageAI looks and feels like a top-tier enterprise product rather than a weekend hack. The glassmorphism effects combined with the glowing urgency indicators create a highly engaging user experience.

Furthermore, we successfully implemented a robust Supabase backend integration, allowing the Symptom Tracker to dynamically render historical data with functional status updates (Active, Resolved, Worsening) all tied to a live relational database.

What we learned

We learned that in medical applications, transparency is a feature. Users don't just want an answer; they need the reasoning behind the answer. Designing the UI to highlight confidence scores and medical citations taught us a lot about building user trust in AI systems. Technically, we deepened our expertise in React state management, Tailwind custom animations, and rapid backend-as-a-service deployment with Supabase.

What's next for TriageAI

The foundation is set, but the roadmap is expansive:

1. Live Data Integration: Connecting to live hospital APIs (like Epic or Cerner) to show real-time ER wait times and allow direct appointment booking.
2. Advanced NLP: Replacing the current algorithmic logic with a fine-tuned, secure Large Language Model specifically trained on medical triage protocols to handle unstructured, conversational symptom descriptions.
3. Telehealth Handoff: Creating a secure portal where users can export their triage summary as a structured PDF to hand directly to their physician or trigger a virtual telehealth consultation right from the dashboard.

Built With

• css3
• github
• html5
• node.js
• postgresql
• react
• supabase
• tailwind-css
• typescript
• vite