How does the digestive system work?
A thali takes seconds in your mouth, hours in your stomach and small intestine, and a day or two in your colon. Follow it through a see-through body, watch enzymes cut starch, protein and fat into pieces, unfold 30 square metres of gut lining, and meet the nerves, hormones and 38 trillion bacteria that run the whole thing.
▶ Play with it · Read the 60-second explainer · Watch the 40-second video
- One long tube, with helpers. From mouth to anus the digestive tract is about 5 to 7 metres long: oesophagus, stomach, small intestine and colon. The salivary glands, liver, gallbladder and pancreas never touch the food but pour their juices into it; bile and pancreatic juice share one doorway into the duodenum.
- The journey of a thali. About 20 seconds of chewing, 8 seconds down the oesophagus by peristalsis, 2 to 4 hours in the stomach, 3 to 5 hours in the small intestine and usually 10 to 59 hours in the colon. The colon is by far the slowest part.
- Cutting food down to size. Chewing and churning make pieces smaller; enzymes cut the molecules. Amylase turns starch into sugars, pepsin and trypsin cut protein into amino acids, and bile plus lipase turn fat into fatty acids. Pepsin works at stomach pH 1.5 to 3.5; the duodenum is neutralised to about 6 to 7.
- Into the blood. Folds, villi and microvilli give the small intestine about 30 m² of lining, not a tennis court. Sugars and amino acids go by the portal vein to the liver, fats go into the lymph. About 9 litres of water enter the gut a day and only 0.1 to 0.2 leave in stool.
- Nerves, hormones and helpers. A net of 200 to 600 million nerve cells in the gut wall runs it, talking to the brain through the vagus nerve. Gastrin, secretin, CCK and GLP-1 carry messages through the blood, and about 38 trillion bacteria in the colon live on the fibre you eat.
- Keeping it healthy. Acidity, constipation, diarrhoea (where oral rehydration salts save lives), food poisoning, lactose intolerance, IBS, ulcers caused by H. pylori, and colon cancer screening. Blood in stool, black stools or weight loss: see a doctor.
| Term | Meaning |
|---|---|
| Peristalsis | A wave of muscle squeezing that pushes food along the gut. |
| Chyme | The thick, acidic soup of part-digested food that leaves the stomach. |
| Enzyme | A protein that speeds up one reaction, like molecular scissors cutting one kind of bond. |
| Bile | A liquid from the liver, stored in the gallbladder, that breaks fat into tiny droplets. |
| Villi | Tiny finger-like bumps lining the small intestine that make its surface huge. |
| Portal vein | The vein that takes blood from the gut to the liver before anywhere else. |
| Enteric nervous system | The gut's own network of hundreds of millions of nerve cells, its second brain. |
| Gut microbiome | The trillions of bacteria and other microbes living in your gut, mostly in the colon. |
| Oral rehydration salts | Salts and glucose in clean water, absorbed together even in bad diarrhoea. |
From an inner fire to 38 trillion helpers: 2,000 years of working out what happens to a meal.
- 100 BCE · Agni, the digestive fire (Charaka and the Ayurvedic tradition, Ancient India)
- 1752 · A kite swallows metal tubes (René-Antoine Ferchault de Réaumur, Paris)
- 1780 · Spallanzani swallows his own experiments (Lazzaro Spallanzani, Pavia)
- 1822 · A gunshot leaves a window into the stomach (Alexis St. Martin and William Beaumont, Mackinac Island, Michigan)
- 1824 · The acid is hydrochloric acid (William Prout, London)
- 1836 · Pepsin gets its name (Theodor Schwann, Berlin)
- 1902 · Secretin, the first hormone (William Bayliss and Ernest Starling, University College London)
- 1904 · Nobel Prize for the digestive glands (Ivan Pavlov, St Petersburg)
The full story, with 30 moments, charts, people and 55 sources: glassbox.how/e/digestionclear/history. The data lives in history.json.
Made with the Glassbox studio from this box's storyboard (window.glassbox.director). Free to reuse under CC BY 4.0.
| File | What | Size |
|---|---|---|
glassbox/reel.mp4 |
Reel / Short, with captions and soundtrack | 1080×1920 |
glassbox/video.mp4 |
YouTube video, with captions and soundtrack | 1920×1080 |
glassbox/slide-1…10.jpg |
Instagram carousel | 1080×1350 |
glassbox/thumb.jpg |
YouTube thumbnail | 1280×720 |
glassbox/cover.jpg |
Share card and repo social preview | 1200×630 |
glassbox/history-reel.mp4 |
“History in 10 moments” Reel / Short | 1080×1920 |
glassbox/history-slide-*.jpg |
History carousel | 1080×1350 |
glassbox/post.json |
Post copy and schedule used by the publish kit |
This box has no accounts and no ads, and it ships its own fonts and libraries. When you run it yourself it sends nothing anywhere. On glassbox.how, the site's /bar.js also loads Glassbox's analytics: Google Analytics to count visits (it asks first in the EU, UK and Switzerland, and stays off when your browser sends Global Privacy Control or Do Not Track) and ClickTrust to detect bots.
It remembers a few things in your own browser only, and never sends them anywhere:
| Browser storage key | What it holds |
|---|---|
digestionclear.v1 |
Which chapters you have opened, your best quiz scores, and sound on or off. |
Exactly what each one sees is at glassbox.how/privacy.
- Code: MIT. Use it, change it, ship it.
- Explanations, text, images and videos (
glassbox.json,glassbox/): CC BY 4.0. Credit “Glassbox, glassbox.how/e/digestionclear”. - Third-party parts keep their own licences: three.js (MIT), Geist, Instrument Serif (SIL OFL 1.1).
- The Glassbox name and logo aren't covered by either licence. See the terms.
Found a mistake? Open an issue. Corrections happen in public.
It's plain HTML, CSS and JavaScript. No build step and no dependencies. Run locally, it contacts no other website.
python3 -m http.server 8000Three.js and the fonts ship in vendor/ and fonts/, so it also works offline.
Then open http://localhost:8000.
| File | What |
|---|---|
index.html, css/app.css |
The page and its styles |
js/app.js, js/stage.js, js/ui.js, js/kit.js |
The shared Glassbox 3D engine: chapters, 3D stage, controls, quiz, video director |
js/chapters/*.js |
One file per chapter: the 3D model, controls, text, key terms, quiz and video scenes |
js/tract.js |
DigestionClear's shared models: the ghosted body with the whole digestive tract and accessory organs, squeezable tubes, the meal transit-time model (gastric emptying, small-bowel and colon transit, with sources) and shared physiology numbers |
glassbox.json |
Title, question, explainer beats, key terms, browser storage and credits shown on glassbox.how |
reel in each chapter |
The storyboard the Glassbox studio records into short videos |
glassbox/ |
The published video, slides, thumbnail and post copy |
fonts/, vendor/three/ |
Self-hosted Geist and Instrument Serif (SIL OFL 1.1) and three.js (MIT) |