Omid Farhang
Table of Contents
I write a lot about Angular platforms, monorepos, and production frontends. Bio-Dynamics is different: a browser-only educational lab where you rotate a 3D body map, zoom into tissue, and run deterministic probiotic scenarios tied to health articles on omid.dev.
It started for three reasons — a human one, a developer-story one, and a career one. This post is the anchor for that project. Deeper technical posts follow in a short series linked at the end.
Educational model — not medical advice. Strain names, counts, and biome effects are illustrative. Do not use this lab to make health decisions.
Three reasons I built it
1. A useful human cause
Probiotic concepts are abstract: barrier defense, pH balance, pre → pro → postbiotic chains. Text helps, but readers still imagine the mechanics.
Bio-Dynamics is a visual companion to five health posts on allergies, candidiasis, life-stage microbiome training, and the biotics lifecycle. Each preset opens the lab at the right tissue with the right scenario framing — for example, nasal barrier stress for allergies or gut lifecycle for SCFA production.
The goal is intuition, not diagnosis. If someone leaves understanding that inflammation can emerge from sustained pressure rather than a single button press, the lab did its job.
2. A honest development story
I wanted a project where I could document how an app like this is built — simulation choices, Three.js structure, catalog-driven UI, golden tests — without pretending it is a clinical engine.
The repository includes architecture notes, simulation specs, and extension guides: docs/README.md. The follow-up posts in this series unpack the layers for developers who want to reuse the patterns.
3. Resume signal in newer fields
Most of my public work is enterprise Angular. Bio-Dynamics lets me show TypeScript + Three.js + deterministic modeling + ed-tech UX in one shipped artifact — with i18n (en/de/fa), accessibility on the control surface, shareable URL state, and CI that runs golden snapshot tests.
It is tagged Case Study on omid.dev the same way as my collaborative editor and production migration posts — one anchor article, not a separate project page type.
What the lab actually is
| Layer | Role |
|---|---|
| Macro view | Low-poly body with seven clickable tissue hotspots |
| Micro view | Animated zoom into region-specific cross-sections |
| Simulation | 30 Hz tick engine — populations, barrier integrity, emergent inflammation, pH, biotics |
| Dashboard | Stats, env sliders, 82 stressors, strain/product catalogs, action impact preview |
Stack: TypeScript, Vite, Three.js (only runtime npm dependency), Vitest. No React, no backend, no Python in production. The lab deploys on every merge to playground.omid.dev.
Overview: docs/overview.md
Architecture in one diagram
| |
App.ts owns the frame loop: advance simulation, push snapshot to scene and dashboard, autosave lab state. Region and preset changes reset or re-seed from typed catalogs in src/data/.
System overview: architecture/system-overview.md
What I deliberately did not build
The assumptions and limits doc is part of the product:
- No pharmacokinetics or personalized medicine
- Postbiotics as a scalar, not individual agents
- Random positions in a unit box, not anatomical niches
- Population display ×1000 for readable dashboard numbers
Saying “educational abstraction” in the UI is an architectural constraint, not fine print.
Outcomes
- Live demo on playground with preset deep links from health articles
- 7 regions, 3 presets, 82 stressors, 20 strains, golden tests + CI
- Shareable lab state via
?lab=URL encoding and localStorage resume - Open source in example-projects
Technical deep-dives (series)
- Designing a deterministic microbiome simulation — tick engine, emergent inflammation, golden tests
- Macro/micro 3D: one scene graph, seven tissue builders — Three.js visualization
- Catalog-driven dashboard: strains, stressors, and action impact — data-first UI
- i18n, a11y, and shareable lab state — locales, keyboard paths, URL checkpoints
Health article companions
The lab links back to omid.dev health writing:
- How Probiotics Help with Allergies
- How Probiotics Help with Candidiasis
- Unlocking Prebiotics, Probiotics, and Postbiotics
- Probiotics Through the Ages
Clone the repo, open the demo, read a health post, then change something in the simulation and watch the event log narrate what happened. That is the loop I wanted readers to have.