Skip to content
Back to Projects
McFly

McFly

Interactive 3D simulation of fruit fly (Drosophila) biomechanics built with FlyGym and Three.js. NeuroMechFly model with 71 mesh body parts, autonomous behaviors (wandering, feeding, drinking, flight), and real-time WebGL visualization you can orbit and explore in the browser.

PythonThree.jsWebGLSimulationFlyGym

What It Is

McFly is a browser-based 3D visualization of the NeuroMechFly model -- a biomechanically accurate simulation of Drosophila melanogaster (the common fruit fly) built on the FlyGym research framework. The project bridges computational neuroscience research and interactive web visualization, making a complex scientific model explorable by anyone with a browser.

The Scientific Foundation

The NeuroMechFly model is a research tool used to study insect locomotion and neural control. It models the fly's body as an articulated hierarchy of 69+ mesh body parts -- thorax, abdomen, head, six legs with multiple segments each (coxa, trochanter, femur, tibia, tarsus), wings, antennae, and proboscis. Each joint has physiologically accurate degrees of freedom, and the model supports 42 independent joint actuators that can be driven by neural control signals.

The Pipeline

The project runs in two phases. First, a Python pipeline using FlyGym and MuJoCo (a physics engine used in robotics research) simulates the fly's biomechanics. The simulation initializes a SingleFlySimulation, then steps through timesteps with 42-element joint action arrays. The simulation outputs joint positions, body part orientations, and contact forces at each step.

Second, this simulation data is exported as JSON -- a model definition file describes the 69-part body hierarchy with positions, quaternions, and mesh references; a step-data file contains per-frame joint states -- and loaded into a Three.js web application. The browser renders the fly's STL mesh parts in their correct hierarchical relationships, with OrbitControls for free camera navigation.

The Visualization

The web interface features a clean, minimal design with a dark glass-effect toolbar. Control buttons let you trigger different autonomous behaviors -- wandering, feeding, drinking, and flight. The Three.js scene renders each body part as a separate mesh loaded from STL files, positioned according to the hierarchical joint tree. GLTFLoader and BufferGeometryUtils handle mesh processing and optimization.

Why It Matters

Most scientific simulations live inside Jupyter notebooks or require installing specialized software. By exporting to a web-native format, McFly makes the NeuroMechFly model accessible to anyone -- educators, students, curious people -- without any installation. It demonstrates that complex biomechanical simulations can be made interactive and explorable in a browser.

Tech Stack

Python (FlyGym, MuJoCo, NumPy), Three.js (WebGL rendering, OrbitControls, GLTFLoader), STL mesh format, JSON data interchange, vanilla JavaScript.