Anatomy Atelier: 3D Anatomy Learning in the Browser
Omoniyi Daniel
Overview
Anatomy Atelier is a browser-based 3D anatomy explorer for students and curious self-learners. It turns flat textbook diagrams into fully rotatable, real-time 3D organ models, paired with structured facts, hotspot annotations, and lessons. No software install and no dissection lab required.
Anatomy Atelier, interactive 3D heart
Category: Educational 3D Web App
Audience: Students and curious self-learners
A gallery, not a textbook
Anatomy Atelier treats organ study like visiting an art gallery rather than opening a dry medical textbook. Each organ is rendered as a fully orbit-able 3D model that a learner can rotate, zoom, and click into. A structured facts panel sits alongside a poetic one-line description, giving each organ a little character before the clinical detail begins.
The product spans nine organs across eight body systems, all built on one consistent interface template.
“The Heart, the tireless pump.” “The Brain, the universe within.” “The Lungs, the breath of life.”
The Challenge
Anatomy is spatial, most anatomy tools aren’t
Traditional anatomy learning leans on flat, static diagrams: a 2D cross-section trying to represent something inherently three-dimensional. Dedicated 3D anatomy software exists, but it is often expensive, installation-heavy, and built for medical professionals instead of students and curious learners.
The challenge was to build a detailed real-time 3D viewer that runs directly in a browser tab, with no plugin or download, while keeping the experience clear as learners move between nine different organs.
Research & Insight
Give the clinical a little humanity
Every organ receives a short, almost literary tagline before the facts begin. That choice creates a deliberate contrast with the sterile tone common in anatomy references.
Heart: “The tireless pump”
Brain: “The universe within”
Liver: “The quiet alchemist”
Pairing a memorable phrase with an organ gives learners an emotional handle for the clinical facts that follow. The effect is subtle: copywriting helps make the experience more approachable without turning it into an explicit “memory trick” feature.
Information Architecture
Organized like the body actually works
The organ library sidebar groups each organ by body system rather than alphabetically, reinforcing that anatomy is systemic rather than a flat list to memorize.
Cardiovascular
Nervous System
Respiratory System
Digestive System
Urinary System
Sensory System
Endocrine System
Integumentary System
A real 3D toolkit
The viewer is designed as a practical exploration tool, not a novelty spinning model. It includes:
Orbit / rotate
Zoom
Isolate
Cross-section view
Export
Compare organs
Notes
Auto-rotate toggle
The Solution
One template, nine organs
Each organ page follows the same reliable structure: a real-time 3D model with clickable hotspot annotations, a Key Facts panel, a medical-importance note, and a “did you know” detail. The system is proven across very different anatomical structures.
3D brain model with hotspot markers and key facts
The Brain, “The universe within”
Nervous system
3D lungs model with color-coded hotspot markers
The Lungs, “The breath of life”
Respiratory system
3D liver model showing internal structure
The Liver, “The quiet alchemist”
Digestive system
Detailed 3D eye model
The Eye, “A window made of light”
Sensory system
Depth without leaving the page
Below each 3D viewer, secondary cards offer deeper paths into the same organ without forcing the learner to navigate away:
Microscopic View
Compare Organs
Function Animation
Clinical Notes
Where It Works
Impact & Results
What is demonstrable
This completed build is shown through a demo walkthrough. The figures below describe the build itself, not public usage or learner-outcome data.
9 organs modeled in real-time 3D: Heart, Brain, Lungs, Liver, Kidneys, Eye, Intestine, Pancreas, and Skin
8 body systems represented: Cardiovascular, Nervous, Respiratory, Digestive, Urinary, Sensory, Endocrine, and Integumentary
8 distinct interaction tools included in the viewer toolbar
Key Takeaways
A single well-designed template, proven across nine very different organs, demonstrates a real design system rather than one polished screen.
Grouping content by how the body actually works, rather than alphabetically, strengthens the mental model the product is designed to teach.
A little literary voice in otherwise clinical content, through a tagline or a “did you know” detail, helps make the experience more approachable.
Anatomy Atelier doesn’t just show learners a heart. It lets them hold one.
Like this project
Posted Aug 11, 2026
A browser-based 3D anatomy explorer built with Three.js and WebGL, pairing interactive organ models with facts, annotations, and lessons.
Likes
0
Views
0
