Yesterday I was on a call with our grant-writing consultants, prepping our Phase 1 pitch for Project Genesis — a physics-driven, browser-based chemistry learning engine.
They asked me what makes what we've built genuinely different.
My first answer wasn't polymerization. It wasn't LMS embedding. It wasn't even real-time reaction mechanics.
It was this:
Our 3D visualizations show electrons.
I shared my screen — oxygen with two visible lone pairs, a double bond with distinct σ and π electron paths, valence domains rearranging as bonds form — and discussed why we teach with visuals missing such an integral part of chemistry.
They asked:
Wait… WHY DO chemistry visuals rarely include electrons?
If chemistry is electron behavior, why are electrons so rarely shown?
Open PubChem. MolView. ChemDraw's 3D export. Most journal figures. A lecture slide. You get colored spheres, sticks, maybe a ribbon if you're lucky.

The implicit message: atoms are the story.
But atoms aren't the story. Electron interactions are the story.
- Why does oxygen in water carry two lone pairs?
- Why does a carbonyl carbon behave differently from a hydroxyl carbon?
- Why does a π bond exist at all?
Every one of those questions is about where electrons are and how they're shared. Yet, in chemistry, we've normalized a visual language that shows the nuclei and hides the reason the molecule behaves the way it does.
And it's not because chemists don't care. Chemists care BIG TIME. It's because showing electrons correctly in 3D is genuinely hard — and most tools weren't built to try.
5 reasons why it is difficult to visualize electrons:
- Electrons aren't little balls on sticks. Quantum mechanics gives you probability distributions, not fixed coordinates. Classical "two dots between two atoms" is a pedagogical model — and building software that respects that model without pretending to solve the Schrödinger equation for every frame is its own engineering problem.
- Static viewers can't update as chemistry happens. A ball-and-stick export is a snapshot. But bonds form, break, and reorder bond topology in real time. If your electron visuals aren't tied to a live valence graph, they desynchronize the moment anything reacts — one frame of wrong geometry cascades into wrong valence, wrong VSEPR, wrong everything.
- Bond order matters — and most pipelines flatten it. Treating bond order as a property of an element pair (carbon–oxygen is always "single") silently erases the difference between a carbonyl C=O and a hydroxyl C–O. Your electron domains end up on the wrong atom. Reviewers notice. Students internalize the wrong picture.
- Real-time costs real compute. Our early polymerization prototypes ran at 1,300–1,800 ms per frame when every atom in every monomer was fully simulated every tick. That's not a classroom experience — that's a screensaver. Interactive electron visuals only work if you govern the physics with chemistry rules, not brute-force every particle every frame.
- Export and platform constraints. Even when you render electrons beautifully in-engine, shipping them to a web viewer, AR session, or publication figure without shader failures, missing materials, or "magenta blob" artifacts is a separate pipeline problem entirely.
So the industry default became: show the nuclei, annotate the mechanism in 2D arrows, hope for the best.
Given this once-in-a-career chance to learn how to program 3D chemistry visuals, I decided to create what I would have LOVED to have had when I was a chemistry researcher and educator.
What it looks like in practice
Water (H₂O) — Bent geometry with two visible lone pairs on oxygen. Not a ghost lobe. Not a textbook afterthought. Domains placed because VSEPR says AX₂E₂.
Ammonia / H₃O⁺ — Trigonal pyramidal vs. tetrahedral electronic geometry, with lone-pair repulsion you can see — the same repulsion you draw in wedge-dash notation.
Ethene or acetone — Double bonds rendered as σ + π paths, not a thicker stick. Students see why π bonds are orthogonal and reactive.
Polymer reactive sites — Backbone repeat units can render as clean spheres (scenery) while reactive rows keep lone-pair detail at the hydroxyl or carbonyl where proton transfer actually happens. The machine stops treating every repeat unit identically when the pedagogy doesn't.
How I cracked the code on electron visuals:
Project Genesis treats electron-domain geometry as a first-class invariant — not decoration layered on after the fact.
At the core is a valence-topology engine that:
- Computes VSEPR electron-domain state from live bond counts, lone pairs, and unpaired electrons
- Preserves per-bond topological state (single vs. double vs. triple) as molecules assemble and mutate
- Rebuilds electron visuals on every topology change — shells, lone pairs, and bond paths stay synchronized with the graph
Concretely, that means:
ElectronShellController — VSEPR-steered valence dots & lone pairs
We don’t hand-place electrons. Every rebuild takes directions from the atom’s VSEPR geometry and places orbiting valence dots and lone-pair pivots along those axes.
// Steered valence dots + lone-pair orbitals follow VSEPR directions,
// not artist-placed transforms.
[Tooltip("Steered VSEPR valence dots: tangential orbit speed (deg/s).")]
public float steeredValenceDegreesPerSecond = ...;
/// <param name="valenceDotDirectionsLocal">
/// Directions from VSEPR repulsion — converted to shell space before placement.
/// </param>
public void RebuildElectrons(
int electronCount,
int valenceVisibleOverride = -1,
IReadOnlyList<Vector3> valenceDotDirectionsLocal = null,
IReadOnlyList<Vector3> ax2e2LonePairAxesAtomLocal = null)
{
// Scale orbit radius to atom size, place dots on effDirs, spin lone pairs tangentially
}
There's some fancy code in this section, but GIFs of what this looks like in practice can be found a little further down.
SharedElectronPath — σ and π tracks through the bond midpoint
A single bond is one ring in the bond plane. A double adds a second ring orthogonal to it. A triple adds a third — three mutually perpendicular great-circle tracks, same radius, electrons on opposite phases.
/// Bond visualization: single = σ; double = σ + π; triple = three orthogonal paths.
public enum SharedElectronStyle
{
SigmaRing, // σ: circle in the bond plane
PiUpArch, // π₁: circle ⊥ bond axis
PiDownArch // π₂ (triple): third orthogonal plane
}
[Tooltip("Use 0 and π so the two electrons stay on opposite sides of the ring.")]
public float phaseOffset = 0f;
// Geometry at the bond midpoint (â = bond axis, b̂ and ĉ = orthogonal partners):
switch (style)
{
case SharedElectronStyle.SigmaRing:
offset = (cos θ * b̂ + sin θ * â) * radius; // σ
break;
case SharedElectronStyle.PiUpArch:
offset = (cos θ * b̂ + sin θ * ĉ) * radius; // π₁
break;
case SharedElectronStyle.PiDownArch:
offset = (cos θ * â + sin θ * ĉ) * radius; // π₂
break;
}
ElectronDomainState — domain math from valence + bonds
Before we place a single dot, we compute how many electron domains an atom has — bonds, lone pairs, and open slots — from its valence shell. That drives VSEPR placement for every species, including ions like H₃O⁺ and NH₄⁺.
/// VSEPR electron-domain state derived from valence and bonds.
/// Each bond = 1 domain (double/triple still count as 1).
public struct ElectronDomainState
{
public int bondCount;
public int lonePairCount;
public int unpairedCount;
public int domainCount; // → VSEPR geometry (2 = bent, 3 = trigonal, 4 = tetrahedral…)
public static ElectronDomainState Compute(ValenceShell shell)
{
int valence = shell.valenceElectrons;
int charge = /* formal charge on this center */;
valence = Mathf.Max(0, valence - charge);
int electronsInBonds = /* from live bond topology */;
int nonBonding = valence - electronsInBonds;
// Saturated center (octet satisfied):
int lonePairs = nonBonding / 2;
int unpaired = nonBonding % 2;
int domainCount = bondCount + lonePairs + (unpaired > 0 ? 1 : 0);
return new ElectronDomainState { /* … */ };
}
}
This isn't a shader trick on a static mesh. It's chemistry rules running as governing laws inside a real-time engine — validated across 100+ species from diatomics through addition polymerization, field-tested on phones, tablets, and Chromebook-class hardware.
Try it — or let us build one for you
We make these visuals for chemistry research scientists and educators to use in proposals, publications, and presentations.
Explore on your own:
Commission a visual:
| Deliverable | What you get | Price |
|---|---|---|
Custom 3D animation | GIF, MP4, or web-interactive export of your structure with full electron detail | $475 |
Interactive lab simulation | Custom mechanism or puzzle module built in Genesis (~30 hrs dev) | ~$7,000 (billed at $200/hr; university vendor- and audit-friendly) |
We're a certified WOSB/MBE — positioned for university supplier diversity programs alongside direct department partnerships.
Sincerely,
Vanessa Rosa, Ph.D.
Science with Impact | Project Genesis
Building interactive chemistry where the visuals apologize to the science, not the other way around.
P.S. We're currently preparing NSF SBIR Phase 1 work on scaling this valence-topology engine for browser-based LMS deployment — if you're a university chemistry department interested in pilot testing, I'd love to hear from you.


Member discussion