CardioROC | ECG Signal Simulator & Diagnostic Game

ECG Monitor

Score: 0

⚡ DEMO ACTIVE - Tap to Resume

Tap the waveform stream if you identify an ABNORMAL signal.

Performance Curve (ROC)

AUC: N/A

Parameters

Signal Noise Level: 10

ROC Interpolation:

Overview

CardioROC creates a dynamic Receiver Operating Characteristic (ROC) curve that evolves as you interact with the simulation, providing a visual representation of diagnostic performance. Instead of showing static numbers like false positives and true negatives directly, we’ll plot points on a ROC curve that gives immediate visual feedback about how well you identify abnormalities in an electrocardiogram signal.

In biomedical engineering and data science, a ROC curve is a powerful tool used to evaluate the accuracy of diagnostic tools. In this game, your ROC curve becomes a living entity. Every time you correctly identify an abnormal waveform, your curve nudges closer to the top-left corner—indicating high sensitivity and low false positive rates. Clicking on a normal segment by mistake sends your curve drifting toward the middle baseline.

Each point on the curve represents a moment of decision. Over time, the curve and the Area Under the Curve (AUC) value will show whether your classification pattern mimics a top-tier diagnostician or if your accuracy relies heavily on guesswork.

How to Play

Observe the Monitor: Watch the continuous ECG signal scrolling across the primary simulator canvas.

Identify Abnormalities: Look for missing P-waves, missing T-waves, or highly modified QRS complexes.

Tap to Diagnose: Tap or click anywhere on the simulator canvas when you spot an abnormal signal before it exits the screen.

Avoid False Alarms: Do NOT tap if the waveform represents a healthy, standard cardiac cycle.

Track Your Curve: View the ROC panel. Green dots indicate correct assessments; red dots represent errors. Aim to maximize the Area Under the Curve (AUC).

Technical Details & Architecture

This application is built entirely using modern Vanilla JavaScript, HTML5 Canvas, and the Web Audio API. It guarantees a highly optimized Interaction to Next Paint (INP) score by strictly isolating heavy mathematical operations (like Polynomial Least Squares Fitting and Cubic Spline interpolation) from the immediate UI event thread.

Signal Generation: The ECG signal is procedurally generated using standard sine math and a localized Gaussian function to form the QRS complex. Random noise is injected based on user parameters.

ROC Math Engine: Evaluates True Positive Rates (TPR) and False Positive Rates (FPR) in real-time. Includes matrix equation solvers via Gaussian elimination to plot polynomial trend lines organically.

Sandbox Demo Engine: Features an isolated, non-mutating state loop. If you are inactive for 45 seconds, the application automatically branches into an automated simulation using deep-cloned memory states to prevent polluting your actual diagnostic score.

Future Directions & Roadmap

Continual refinement of CardioROC involves enhancing the complexity of the signal processing layers and expanding the diagnostic challenges. Planned updates include:

Multi-lead Simulation: Adding V1-V6 and standard limb leads simultaneously to require cross-referencing signals for correct diagnosis.

Dynamic Pathology Profiles: Introducing more subtle arrhythmias like Atrial Fibrillation, PVCs, and STEMI elevations based on physiological models.

Machine Learning Comparison: Allowing users to race against a local TensorFlow.js trained model to compare human intuition against algorithmic thresholds.

Resource Directory

BioniChaos Engineering Portal - Main hub for biomechanical and signal simulations.

Receiver Operating Characteristic (ROC) - Theoretical background on sensitivity vs specificity.

MDN HTML5 Canvas API - Rendering documentation used for the simulation engine.