ES
← Back to Portfolio
Education & Outreach September 2026

Floraria, a Continuous Botanical Scene from Museum Scans to Cells

Point and scroll, or pinch, to open enclosing structures and approach tissues, cells and compartments of a flower in one continuous scene. Five Smithsonian CC0 bloom specimens at two delivery fidelities, two authored educational component models (a general flower and an orchid) with named structures, assembly and explosion, and twelve guided investigations that connect inspection, morphology, comparisons and the documented evidence, in English and Spanish, light and dark, with keyboard and touch controls, shareable selections and JSON and PNG export. The real-scan and authored-model lanes stay visibly labelled everywhere: museum scans show outer surfaces and establish no internal organ, no segmentation and no physical measurement. Lifecycle: building.

Data
5 Smithsonian CC0 bloom specimens at 2 fidelities; 2 authored educational models (general flower, orchid); museum data keeps its recorded source rights
Interaction
Continuous level change by wheel or pinch; named structures, assembly and explosion, isolation views; keyboard and touch; persistent preferences, bookmarks, shareable selections; JSON and PNG export; EN and ES, light and dark
Verification
160 frontend and 56 Python tests; a 31-scenario, 126-check browser suite; phone-pointer navigation at 390 by 844; exact artifacts and public downloads verified on the custom domain
Not claimed
Internal organs, tissue segmentation or physical measurement from a scan; a shared physical scale; growth prediction or plant identification; adoption, learning outcome, owner visual acceptance
Deploy and licence
GitHub Pages at a custom domain; version 0.06.000; Apache-2.0 code; lifecycle building
Architecture diagram of Floraria, a Continuous Botanical Scene from Museum Scans to Cells
#botany #education #3d-visualization #museum-data #three-js #spatial-atlas #science-outreach

Business Context

For a teacher or a museum educator the value is one instrument that goes from the specimen a visitor can recognise to the compartment a textbook names, without changing pictures, and that never claims more than its data allows: normalized framing is not a shared physical scale, lifecycles and morphology explain concepts and do not predict growth or identify plants, and the real-scan and authored-model lanes are labelled in the interface and in every export. The museum data keeps its recorded source rights; the code is Apache-2.0.

Strategic Value

Floraria was rebuilt twice on its owner's verdict and each rebuild kept the previous release reachable rather than erasing it: the 0.02.000 studio, the 0.03.000 checkpoint and the 0.06.000 continuous scene are all recorded with their exact main commits, release identifiers and the Quality and Pages runs that verified them (Node 22 and 24 source, production build, exact-artifact Chromium, custom-domain and publication gates). 160 frontend and 56 Python tests, a 31-scenario browser suite of 126 checks, and phone-pointer navigation at 390 by 844 are part of the release acceptance. What is not claimed is written down: no measured adoption, no learning outcome, no owner visual acceptance; the lifecycle stays building.

The Challenge

Teaching what a flower is made of usually means a labelled drawing at one scale. A learner who wants to go from the whole bloom to a tissue, from the tissue to a cell and from the cell to a compartment has to change books, and none of the pictures agree on where they are on the same plant. The museum world has open, photographed specimens, but a scan is an outer surface: it establishes nothing about the inside, and an instrument that mixes a real scan with an authored diagram has to keep the two visibly apart or it teaches something false. The first two versions of this product, a studio of separate views, were judged below the bar by their owner; the third is a single continuous scene.

Our Approach

The root is the spatial whole-plant experience: a continuous scene where the wheel or a pinch changes the level, opening enclosing structures and approaching tissues, cells and compartments, with three floral constructions and four connected pathways that reveal geometry, qualitative processes and sourced context automatically. The data lanes are separate and labelled: five distinct Smithsonian CC0 bloom specimens, each exported at two delivery fidelities (five biological examples, not ten), and two authored educational component models, the general flower and the orchid, with named structures, assembly and explosion, isolation and explanatory views, diagrams and not segmented scans. Twelve guided investigations connect inspection, morphology, comparisons and the documented evidence. The browser is React 19, TypeScript, Vite and Three.js; the offline pipeline is plain Python scripts with no internal installable package; both languages and themes, persistent local preferences, local bookmarks, shareable selections, JSON and PNG export. The product follows the curated spatial knowledge atlas archetype rather than the six-page science shell, and the record says so.

Key Performance Indicators

KPIBaselineResultImpact
One scene, every scaleA labelled drawing per scale, in different booksA continuous scene from the bloom to tissues, cells and compartments, opened by scroll or pinch; three constructions, four pathways, twelve guided investigationsThe learner never changes pictures
Real scan and authored model, kept apartA diagram presented as a specimenFive Smithsonian CC0 specimens (outer surfaces only) and two authored component models, labelled as such in the interface and in every exportNothing internal is claimed from a scan
Rebuilt on the owner's verdict, history keptA first studio of separate views, twice below the bar0.02.000, 0.03.000 and 0.06.000 each recorded with exact commits, release identifiers and verified Quality and Pages runsEvery earlier release stays reachable

Architecture

floraria pipeline

floraria pipeline

Technology Stack

TypeScript React Vite Three.js Zustand KaTeX Python

Application Screenshots

Floraria, a Continuous Botanical Scene from Museum Scans to Cells
Floraria, a Continuous Botanical Scene from Museum Scans to Cells