Source: https://mayphus.org/digit-recognition/
Title: How a computer reads a handwritten digit
Metadata: {"category":"tool","id":"digit-recognition","kind":"tool","language":"en","route":"/digit-recognition/","tags":["machine-learning","mathematics","interactive"],"type":"project"}


A digit begins as an image. The computer turns it into 64 brightness numbers, then applies a function whose weights were learned from labeled examples. Try a drawing or load a sample above. The prediction may be wrong, especially when your strokes differ from the training images.

## The mathematical picture

The 8 × 8 image becomes a vector **x = (x₁, …, x₆₄)**. Each value is a pixel brightness from 0 (background) to 1 (ink). In this model, **f(x; θ)** has one hidden layer with 32 units. **θ** means all its learned weights and biases. For hidden unit **j**:

**zⱼ = bⱼ + Σᵢ xᵢWᵢⱼ**, then **aⱼ = max(0, zⱼ)**.

In words: multiply each input pixel by that unit's weight, add all 64 products and its bias, then keep the positive part. Select a hidden unit in the interactive view to inspect that exact calculation. The second layer similarly combines the 32 activations into ten scores, one for each digit. **softmax(score)ₖ = e^(scoreₖ) / Σₗ e^(scoreₗ)** turns those scores into values that sum to 1. These are model probabilities, not guarantees that its answer is correct.

The 8 × 8 grid is the complete 64-dimensional input, arranged like an image so it can be seen. The hidden bars are the actual 32 activations; their positions are a list, not a two-dimensional map of the model's space.

## Learning is different from guessing

During **training**, the model saw labeled 8 × 8 images. It compared its predictions with the correct labels using cross-entropy loss, then adjusted **θ** to reduce that loss. During **inference** here, your pixels move through the fixed weights. Your drawing does not retrain the model.

This small demonstration was trained locally on the [scikit-learn digits dataset](https://scikit-learn.org/stable/modules/generated/sklearn.datasets.load_digits.html), a 1,797-image copy of part of the [UCI Optical Recognition of Handwritten Digits data](https://archive.ics.uci.edu/dataset/80/optical+recognition+of+handwritten+digits) by E. Alpaydin and C. Kaynak (1998), [DOI 10.24432/C50P49](https://doi.org/10.24432/C50P49). The source dataset is [CC BY 4.0](https://creativecommons.org/licenses/by/4.0/); this page uses ten sample images and derived model weights. Its 8 × 8 pixels are integers from 0 to 16. A reproducible 80/20 stratified split held out 360 of the 1,797 images for testing. The model classified **348 of 360 (96.7%)** correctly on that held-out split. This is **not** an accuracy estimate for visitors' drawings. Your drawing is cropped and resized to resemble the training format; handwriting outside that format can behave differently.

All drawing, resizing and inference happen in this browser. No drawing is uploaded, stored or sent to analytics.