CHAPTER I OF III · 100% REAL MATH · 0 LIBRARIES · RUNS IN YOUR BROWSER

HOW
MACHINES
LEARN

A real neural network lives on this page — the same mathematics that powers frontier AI, shrunk to a size you can watch, poke and break. No jargon left unexplained, from the 1958 perceptron to today's trillion-parameter models.

LIVE · TRAINING NOW
DATASET: SPIRALEPOCH 0
01

The neuron: a tiny decision machine

Strip away the mystique and a neural network is built from one absurdly simple part, repeated millions of times. Meet it here — and meet the vocabulary that describes it.

An artificial does three things: it takes some numbers in, multiplies each by a , adds a , and passes the total through an to produce one number out. That's it. That is the atom of all deep learning.

output = f( w₁·x₁ + w₂·x₂ + b )  // f is the activation function

Try it. This neuron decides whether to take an umbrella. Its inputs are how cloudy it is and how humid it feels. The weights are how much the neuron cares about each input; the bias is its baseline reluctance or eagerness before it has seen anything at all.

CONTROLS — YOU ARE THE TRAINING ALGORITHM
Input x₁ — cloud cover 0.70
Input x₂ — humidity 0.40
Weight w₁ — how much clouds matter 2.0
Weight w₂ — how much humidity matters 1.0
Bias b — baseline mood -1.5
Activation function
THE NEURON, COMPUTING
weighted sum z = 0.00  →  output f(z) = 0.00

Notice what the activation function is for. Without it, a neuron is pure arithmetic — its output is always a flat, straight-line function of its inputs. The activation bends that line. This is the entire reason networks can learn curves, spirals and language rather than just straight lines. Flip between the options above and watch the curve change shape.

HISTORY PIN · 1958

The step function is where it all began: Frank Rosenblatt's fired 1 or 0, nothing in between, like a biological neuron either spiking or staying silent. The smooth sigmoid and tanh ruled the 1980s–2000s because learning needs slopes (you'll see why in section 03). The brutally simple ReLU — "if negative, output zero; otherwise pass it through" — took over around 20112012 and remains the default family in frontier models. Sometimes progress looks like less sophistication.

02

Stack neurons, get a network

One neuron draws one straight line. The trick that changed everything: feed neurons into other neurons.

Arrange neurons in . The first layer receives the raw data — the . The last produces the answer — the . Everything in between is a : "hidden" only in the sense that you never directly see its inputs or outputs. Each hidden neuron learns to detect some intermediate pattern, and later neurons combine those patterns into more abstract ones. When a network has many hidden layers we call it deep — that is the entire origin of the phrase .

Watch data flow through this network, left to right. That flow — multiply, add, activate, layer by layer — is called the . When you use a trained model (every time you ask a chatbot something), you are running forward passes. That's also called .

Hover any connection to see its weight

Every connection has its own weight; every neuron its own bias. Together these adjustable numbers are the network's — its entire memory and personality. Count them for the network above:

(2×3 + 3) + (3×3 + 3) + (3×1 + 1) = 25 parameters

Hold that number. The playground network below has around 50–200. GPT-3 2020 had 175,000,000,000. Frontier models are estimated around a trillion. Same atom, same arithmetic — just unimaginably more of it. The overall shape you choose — how many layers, how wide, how they connect — is called the .

03

Learning = measure error, adjust weights

A fresh network is born with random weights — it knows nothing. "Training" is the process of nudging those weights, millions of times, until the outputs stop being wrong. Here is the whole loop.

Step 1 — measure the error. Show the network an example where you know the right answer (that's ), compare its output to the truth, and boil the difference down to a single number: the . High loss = badly wrong. Zero loss = perfect. Training has exactly one goal: make this number go down.

Step 2 — find which way is downhill. Imagine a landscape where every possible setting of the weights is a location, and the altitude at each location is the loss. Learning is finding a low point in that landscape. The is the local slope — it tells you, for every single weight, which direction makes the loss worse. So you step the other way. Do this over and over and you are performing , the algorithm at the heart of essentially all modern AI.

Step 3 — take a step of the right size. How big a step? That's the — the single most temperamental dial in the field. Try it yourself:

GRADIENT DESCENT — ROLL THE BALL DOWNHILL
current weightprevious steps
CONTROLS
Learning rate 0.10
weight w2.60
loss L(w)
gradient dL/dw

Try LR ≈ 0.05 (slow crawl), ≈ 0.6 (efficient), ≈ 1.3 (overshoots and ricochets). Reset a few times — from some starting points the ball settles in the shallow dip on the left: a .

Step 4 — assign the blame. One puzzle remains, and it stalled the field for decades: in a deep network, how do you know how much each individual weight — including ones buried in hidden layers — contributed to the final error? The answer is : after the forward pass, walk the error backwards through the network, layer by layer, using calculus's chain rule to split the blame at every connection. It's an accounting trick, really — a supremely efficient way to compute the gradient for every parameter at once. Popularized in 1986, it is still how every frontier model learns today.

Two last pieces of vocabulary and the loop is complete. In practice you don't compute the error on one example at a time but on a small of them (this page uses 16). One full pass through the entire training set is an . Training a model means running this loop — forward pass, loss, backpropagation, weight update — for thousands or, at frontier scale, trillions of steps. Because each batch is a random sample, the method is properly called .

HISTORY PIN · 1974 / 1986

Paul Werbos worked out backpropagation in his 1974 Harvard PhD thesis — and it was largely ignored. Only when Rumelhart, Hinton and Williams published their 1986 paper showing hidden layers learning useful internal representations did the field wake up. The lesson recurs constantly in AI history: the ideas often arrive long before the moment is ready for them.

04

The playground: train a real network

Everything from sections 01–03, live. The network below is genuinely training in your browser — real forward passes, real backpropagation, dozens of times a second. Your job: get the coloured background to match the dots.

Each dot is a training example with two input numbers (its x and y position) and a (red or blue). The network's task is : predict the label from the position. The painted background shows its current opinion about every point in the plane — the is where the colour flips. Hollow dots are : examples the network never trains on, kept aside to check it has genuinely rather than memorized.

BUILD
Dataset
Hidden layers
Activation (hidden layers)
Learning rate
THE NETWORK — WEIGHTS MADE VISIBLE
positive weightnegative weightthickness = strength · each hidden neuron shows the pattern it has learned to detect
OUTPUT — DECISION BOUNDARY
class redclass bluehollow = test data
LOSS — THE ERROR, FALLING
training losstest loss
epoch0
parameters
train loss
test loss
test accuracy — the score that actually matters

Experiments worth running

  • Delete all hidden layers (− LAYER twice) on BLOBS: still solves it. One layer can draw one straight line, and a line is all blobs need. This is 1958 in miniature.
  • Now switch to XOR with no hidden layers. It flails forever — no straight line separates a checkerboard. This precise failure, published in 1969, helped freeze neural-network funding for a decade.
  • Add one hidden layer back. XOR falls in seconds. Hidden layers + backpropagation = the 1986 comeback.
  • Set activation to LINEAR on the spiral, with 3 big hidden layers. Watch it fail no matter how deep: stacked linear layers collapse into one straight line. Depth is worthless without nonlinearity.
  • Race TANH vs RELU on the spiral (2 layers of 8). ReLU usually trains visibly faster — a small taste of why it helped ignite the deep-learning boom in 2012.
  • Crank the learning rate to 3.0. The loss curve goes feral. You've met this ball before, in section 03.
05

Teach it yourself, with your own data

So far the datasets were manufactured. This time you are the dataset. Draw examples of two shapes, train a network on your drawings, and test whether it truly learned — or merely memorized.

To a network, your drawing is just numbers: the 8×8 pad below becomes 64 inputs, each 0 (empty) or 1 (inked). Those 64 numbers are the . A [64 → 12 → 1] network — 64 inputs, 12 hidden neurons, 1 output — will learn to map them to a class. That is, at miniature scale, exactly how early neural networks read handwritten ZIP codes for the US postal service in the 1990s.

How to play: draw a shape (say, an ✕) on the pad, add it to CLASS A. Draw an ○, add to CLASS B. Give each class at least 3–4 varied examples, hit TRAIN, then draw fresh shapes on the test pad and watch the network's live verdict.

1 · DRAW AN EXAMPLE

CLASS A · 0 EXAMPLES

CLASS B · 0 EXAMPLES

2 · TRAIN, THEN 3 · TEST
epoch
loss

Add at least 2 examples to each class to unlock training.

Test pad — draw here after training
TRAIN FIRST

What this teaches (and what breaks)

  • With 3 examples per class, the network can ace its training set while understanding nothing. Perfect scores on data it has already seen prove little — that failure mode is , and it's why the test pad exists.
  • Draw your test ✕ shifted one pixel to the corner. It will often fail — this network has no idea that a shape moved sideways is the same shape. Fixing exactly that weakness is why were invented in 1989: they scan for patterns everywhere in an image instead of memorizing pixel positions.
  • More varied examples → better generalization. You have just discovered the most reliable law in machine learning: data quality and quantity usually beat cleverness.
06

From this page to the frontier

Here is the honest, slightly unsettling truth: the gap between the toy network you just trained and a frontier model is less about new magic than about staggering scale — plus three big ideas.

What is identical. Frontier models are made of the same neurons computing weights-times-inputs-plus-bias. They learn by the same loop: forward pass, loss, backpropagation, gradient descent (with a smarter step-size scheme called , from 2014). If you followed sections 01–04, you understand the core mechanism of a trillion-dollar industry. Genuinely.

What is different. Three things, mainly:

  • Architecture. Modern language models are 2017, whose key component — — lets every word in a sentence look directly at every other word and decide which ones matter for interpreting it — WATCH IT HAPPEN →. Words enter the network as : learned lists of numbers where similar meanings sit near each other, just as your drawings entered as 64 pixel numbers. How raw text becomes those numbers at all is its own story — SEE TEXT BECOME TOKENS →
  • Scale. Researchers found that loss falls with eerie predictability as you grow the model, the data and the compute together — the 2020. That discovery turned "build a bigger one" from a hunch into an investment thesis, and it is why training runs now consume city-scale quantities of compute.
  • Training recipe. A modern assistant is built in stages: (predict the next word across a huge slice of human text — gradient descent on trillions of examples), then on demonstrations, then — reinforcement learning from human feedback 2017–22 — where human preferences steer the model toward being helpful rather than merely predictive.

To feel the scale, count parameters — every bar below is on a logarithmic axis, where each gridline is 10× the last. On a linear chart, every bar except the final two would be invisibly thin.

PARAMETER COUNTS, 1958 → NOW (LOG SCALE)

Each step on the axis = ×10 parameters. Frontier figures are estimates; labs no longer publish them.

KEEP YOUR FOOTING

Scale changed what these systems can do, not what they are. When you read that a model "has 1 trillion parameters", you now know exactly what that sentence means: one trillion adjustable weights and biases, every single one nudged downhill by the same gradient descent you ran on a pixel ball in section 03.

Two more labs complete the language story

This page taught the universal machinery: neurons, layers, gradient descent. Language models add two mechanisms of their own — how text becomes numbers, and how words decide which other words matter. Each now has its own live laboratory, built with the same rules: real math, no libraries, view source.

07

The timeline: 1943 → now

Eighty years from a paper about idealized brain cells to machines that write and reason. Round markers are the era-defining moments. Where history can be re-enacted on this page, hit TRY IT — it loads the exact experiment into the playground.

08

The glossary: every term, unpacked

Every dotted-underline term from this page, in one place. The year notes when the idea entered the field.