A fly embryo's gene network paints seven even-skipped stripes, nucleus by nucleus.
A fruit fly embryo seen as a fluorescence micrograph during its first three hours. Bicoid protein falls off exponentially from the head and Nanos from the tail, with Caudal and the terminal genes tailless and huckebein as further inputs, and every nucleus runs the same gene regulatory network as rate equations with Hill-function activation and repression: the gap genes hunchback, Kruppel, knirps and giant cross-repress (hardest between genes whose domains never touch) until they settle into overlapping bands. even-skipped reads them through five enhancers, each active only in a window between two repressors, and resolves into seven crisp stripes. The nuclei sit on a hexagonal lattice wrapped over an ellipsoid, and nuclear cycles 10 to 14 double the lattice in mitotic waves that run from both poles, each daughter inheriting its parent's proteins, with diffusion between neighbors and a confocal-style tone curve and bloom.
Try it. Click the embryo to inject Bicoid mRNA there and watch the stripes bend and shift around the new gradient; click an injection mark to remove it. The arrows step through classic experiments (Kruppel, knirps and giant mutants, double Bicoid, a posterior Bicoid source), the buttons or keys 1 to 4 switch between all genes, gap genes, even-skipped and the maternal gradients, R or Space restarts development and C clears the injections.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build a simulation of how a fruit fly embryo paints its first stripes, using JavaScript and the HTML canvas element. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple:
- Make a canvas that fills the window, stays sharp on high-DPI screens, and resizes with it. Use a black background, like a fluorescence microscope.
- Model the embryo as a row of 200 nuclei along its length, x from 0 (head) to 1 (tail). Give each nucleus a maternal Bicoid level, bcd = exp(-x / 0.2).
- Each nucleus holds four gap gene levels: hunchback, Kruppel, knirps and giant. Write a Hill function h(v, k, n) = v^n / (v^n + k^n) and its repressing form 1 - h. Every step, compute each gene's target as a product of activations and repressions (hunchback needs high Bicoid; Kruppel needs some Bicoid but is shut off by high hunchback and by giant; knirps lives where Bicoid is low), then move each level toward its target and add a little diffusion from the neighbors.
- Draw the embryo as an ellipse of glowing dots, one column per nucleus, each gene in its own color added together. Tune thresholds until the gap genes settle into neighboring bands.
Once that works, make it beautiful:
- Add even-skipped, read through separate enhancers. Each is on only in a window between two repressors (stripe 2 sits between giant and Kruppel; stripes 3 and 7 between hunchback and knirps), so together they give seven stripes.
- Make it 2D: nuclei on a hexagonal grid inside the ellipse, and nuclear divisions that double the grid every few seconds, each daughter copying its parent.
- Let a click add a local Bicoid source, and add buttons for mutants that delete one gap gene, so you can watch stripes shift and fuse.
Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as wrapping the grid over a 3D ellipsoid, a mitotic wave that sweeps in from the poles, or the segment polarity genes that turn seven stripes into fourteen.
