\section*{Inspiration} Cardiovascular disease remains the leading cause of mortality globally, accounting for 1 in 3 deaths. Currently, cardiologists are forced to navigate a heavily fragmented software ecosystem: a basic risk calculator in one window, a clunky Electronic Health Record (EHR) in another, and entirely separate portals for radiological imaging and genomic variants.

The inspiration behind \textbf{CardioAegis} was to build a unified, privacy-first ``Aegis'' (shield) that arms clinicians with the full spectrum of predictive, genetic, and pharmacological data in one seamless, beautiful dashboard. We wanted to move the needle from just \textit{predicting} a heart attack, to instantly \underline{understanding} the underlying genetics and \underline{prescribing} the exact targeted therapy.

\section*{What it does} CardioAegis is an all-in-one, AI-driven clinical decision support platform featuring four core modules: \begin{enumerate} \item \textbf{Risk Predictor:} Evaluates 13 clinical biometrics (e.g., resting ECG, fasting blood sugar, ST depression) to instantly calculate the probability of coronary stenosis. \item \textbf{Diagnostic Imaging & Labs:} A simulated Computer Vision pipeline that allows clinicians to drag-and-drop raw medical scans (MRIs/Angiograms) to generate automated, highly detailed radiological findings. \item \textbf{Genomic Explorer:} A bioinformatics deep-dive mapping critical cardiovascular genes (like \textit{PCSK9}, \textit{LDLR}, and \textit{APOB}) against pathogenic ClinVar variants to provide structural context for familial hypercholesterolemia. \item \textbf{Targets & Therapeutics:} A pharmacology database linking specific drug classes directly to their genetic targets and Reactome biological pathways. \end{enumerate}

\section*{How we built it} We built the front-end using raw HTML, CSS, and vanilla JavaScript to ensure blazing-fast performance without heavy framework overhead. The UI utilizes a custom, dark-mode glassmorphism aesthetic with micro-animations to make dense clinical data highly readable and engaging.

For the predictive engine, we trained a Logistic Regression model on the UCI Cleveland Heart Disease dataset. To guarantee strict patient data privacy (HIPAA compliance), the inference runs \underline{entirely locally in the browser}. The probability of coronary stenosis $P(y=1|X)$ is calculated locally using the sigmoid function over the extracted feature weights:

$$ P(y=1|X) = \frac{1}{1 + e^{-(\beta_0 + \sum_{i=1}^{n} \beta_i x_i)}} $$

By implementing this mathematical model directly in our client-side architecture, patient biometrics never leave the local machine.

\section*{Challenges we ran into} Balancing premium UI aesthetics with highly dense medical data was incredibly difficult. Designing a dashboard that displays complex bioinformatics (like pathogenic phenotypes and protein interaction mechanisms) without overwhelming the clinician required dozens of design iterations. Additionally, building an interactive, multi-tab state management system entirely in vanilla JavaScript—while ensuring all our mocked AI deterministic logic fired correctly—was a significant architectural challenge.

\section*{Accomplishments that we're proud of} We are incredibly proud of the UI/UX. The frosted glass aesthetic, interactive SVG risk dials, and seamless navigation make exploring dense genomic data feel incredibly modern and intuitive. We are also incredibly proud of our localized ML architecture—we proved that powerful predictive analytics can be run safely and privately directly in the physician's browser.

\section*{What we learned} We learned a tremendous amount about clinical bioinformatics—specifically how genetic variants in the \textit{PCSK9} and \textit{LDLR} genes directly influence blood cholesterol, and how modern therapies like monoclonal antibodies and siRNA target these exact biological pathways. On the technical side, we massively leveled up our skills in advanced CSS layouts, dynamic DOM manipulation, and mathematical modeling in JavaScript.

\section*{What's next for CardioAegis} In the future, we plan to replace our local mock databases with live REST API integrations to the Open Targets Platform, ClinVar, and Reactome. We also want to expand the diagnostic imaging module to process real DICOM medical files securely via WebAssembly (Wasm). Ultimately, we hope to deploy CardioAegis in a pilot clinical setting to gather real-world feedback from practicing cardiologists!

Share this project:

Updates