Cardiac Cycle Interactive Learning Application

Problem

Raffles Institution, under a Singapore Ministry of Education (MOE) innovation initiative, needed a way to help students grasp the cardiac cycle — one of the more physiologically complex topics in secondary science education. Static diagrams and textbook explanations struggled to convey the time-based, multi-system nature of how pressure, volume, and valve states interact across a single heartbeat. The challenge was to make this process tangible and explorable, without requiring any software installation in a classroom setting.

Approach

As Interactive Media Developer at VARTeL Pte. Ltd. (an NTU spin-off), I led end-to-end development of a browser-based, WebGL interactive application. The build combined a real-time 3D heart model with a synced pressure-volume graph, letting students scrub through six key physiological checkpoints (valve opens/closes) while hearing corresponding heart sounds (Lub/Dub). Development spanned the full pipeline: interaction design, Unity application architecture, C# scripting for the animation/UI systems, Zbrush for 3D asset creation, Blender asset preparation for real-time rendering, and WebGL optimization for reliable in-browser deployment - prioritizing educational clarity and performance over high-fidelity visuals, so the tool would run smoothly on standard school hardware and on web browsers.

Tech Stack

Result

Evaluated with ~150 students at Raffles Institution as part of a formal educational study: - 20.9% improvement in immediate learning performance - Strong knowledge retention measured two months post-use - ~64% of students reported the tool effectively improved their understanding of the cardiac cycle The project was presented at a Singapore MOE Innovation Fund review as a case study in how interactive 3D learning tools can improve engagement and comprehension in science education.