Development of In-Browser Simulators for Medical Education: Introduction of a Novel Software Toolchain

Abstract

BackgroundSimulators used in teaching are interactive applications comprising a mathematical model of the system under study and a graphical user interface (GUI) that allows the user to control the model inputs and visualize the model results in an intuitive and educational way. Well-designed simulators promote active learning, enhance problem-solving skills, and encourage collaboration and small group discussion. However, creating simulators for teaching purposes is a challenging process that requires many contributors including educators, modelers, graphic designers, and programmers. The availability of a toolchain of user-friendly software tools for building simulators can facilitate this complex task.ObjectiveThis paper aimed to describe an open-source software toolchain termed Bodylight.js that facilitates the creation of browser-based client-side simulators for teaching purposes, which are platform independent, do not require any installation, and can work offline. The toolchain interconnects state-of-the-art modeling tools with current Web technologies and is designed to be resilient to future changes in the software ecosystem.MethodsWe used several open-source Web technologies, namely, WebAssembly and JavaScript, combined with the power of the Modelica modeling language and deployed them on the internet with interactive animations built using Adobe Animate.ResultsModels are implemented in the Modelica language using either OpenModelica or Dassault Systèmes Dymola and exported to a standardized Functional Mock-up Unit (FMU) to ensure future compatibility. The C code from the FMU is further compiled to WebAssembly using Emscripten. Industry-standard Adobe Animate is used to create interactive animations. A new tool called Bodylight.js Composer was developed for the toolchain that enables one to create the final simulator by composing the GUI using animations, plots, and control elements in a drag-and-drop style and binding them to the model variables. The resulting simulators are stand-alone HyperText Markup Language files including JavaScript and WebAssembly. Several simulators for physiology education were created using the Bodylight.js toolchain and have been received with general acclaim by teachers and students alike, thus validating our approach. The Nephron, Circulation, and Pressure-Volume Loop simulators are presented in this paper. Bodylight.js is licensed under General Public License 3.0 and is free for anyone to use.ConclusionsBodylight.js enables us to effectively develop teaching simulators. Armed with this technology, we intend to focus on the development of new simulators and interactive textbooks for medical education. Bodylight.js usage is not limited to developing simulators for medical education and can facilitate the development of simulators for teaching complex topics in a variety of different fields.

Matematický Model Regulace Železa v Organismu

“…Pomocí jazyka Modelica jsme implementovali a rozšířili doposud nejkomplexnější a experimentálně verifikovaný matematický model systémové regulace železa [1], navrhli animované grafické rozhraní a s využitím našeho open-source nástroje BodyLight.js [2] připravili interaktivní e-learning aplikaci. V rámci této aplikace, která je dostupná pomocí běžného www prohlížeče, je možné simulovat aktuální toky atomů železa nejen mezi jednotlivými orgánovými systémy, ale rovněž na buněčné úrovni.…”

“…Během zánětlivých stavů se proto produkce hepcidinu zvyšuje. Hepcidin následně sníží nejen resorpci železa ve střevě, ale zejména redukuje uvolňování železa z makrofágů.Cílem práce bylo implementovat v současné době nejkomplexnější matematický model metabolismu železa ([1]) v jazyce Modelica a s použitím námi vyvinutého nástroje BodyLight.js ([2,3]) připravit interaktivní grafický simulátor pro potřeby výuky. Složitost metabolických drah regulace železa není triviální.…”

Využití Počítačových 3d Modelů Anatomie Člověka

“…Pro účely projektu "Virtuální pacient" byli vybrány data kostry a vnitřních orgánů z repozitáře BodyParts3D [15], některé orgány z repozitáře Sketchfab [11]. Tato hrubá data obsahují jen základní barvy materiálů, pro vytvoření realistické textury kůže, kostry a povrchu tkání byl použit software Zbrush [18][19], Ci-nema4D [20] a plugin GLTF exporter [21]. Během tohoto zpracování byla vytvořena nová topologie, povrchy rozřezány pro tzv.…”

“…Vznikající aplikace simulátoru virtuálního pacienta [23] dává do kontextu anatomické struktury s výkladem fyziologie a patofyziologie vybraných stavů, ve spojení s nástroji Bodylight Simulation Toolchain [21] pak takto vznikající aplikace mohou být podkladem pro výuku ve virtuální, či rozšířené realitě, kde 3D projekce dává kontextovou informaci pro složitý výklad. S pomocí výše dostupných repozitářů volně dostupných dat lze vytvořit dobře vypadající 3D aplikaci zobrazující anatomii člověka.…”

From mathematical model towards educational simulation game of hemodynamics of cardiovascular system

“… Recently we have created a new open‐source technology called BodyLight.js which combines the current standard for web‐based applications including Web‐Assembly for fast computation of mathematical models, web components for building independent transferable objects, and WebGL for involving 3D graphic [1, 2]. We have published methodology and implementation of several models of the cardiovascular system [3]. We have been creating graphical components in 2D and recently in 3D which can be used as animations in simulation application. There are numerous steps involved when going from an idea to a finished project. In this contribution we describe the workflow going from concept to mathematical model and computer graphics to an educational simulation application.…”