A simple neural network recognises handwritten digits — live in the browser, without installation. Weights, activations and learning progress are visualised in real time.
The app visualises a simple neural network — how it learns and how it works — using the example of recognising handwritten digits. These can be drawn live with the mouse on a simple 5 × 3 pixel grid. The neural network immediately translates the drawn digit into its recognised result. How well this works depends on how well the network has been trained.
Training also happens live in the app through iterative learning cycles. In each cycle, the overall error — derived from comparing the ten training digits in pixel form with the corresponding recognised digit — is progressively reduced. The gradient descent method is used, adjusting the network's parameters at each step to minimise the remaining error as efficiently as possible: a step in the direction of steepest descent through the error landscape. Gradient descent is implemented efficiently via the backpropagation algorithm, an almost magical concept that underpins the power of neural networks.
First, observe how the neural network learns. As the number of learning cycles increases, the overall error the network makes in its predictions decreases continuously. This gradually improves the network's digit recognition performance.
You can test this by drawing a digit with the mouse in the drawing field on the left (red on a blue background) and observing which digit the network recognises (blue field on the right). You can also follow the overall recognition performance in the tabular bar chart: the better trained the network, the larger the bars on the diagonal and the smaller all other bars.
The learning speed can be adjusted via the Learning Rate, which corresponds to the step size in gradient descent. But be careful: too large a learning rate can lead to instabilities. You can also try different neural network architectures by changing the number of hidden layers and their respective neuron counts in the Settings panel — the learning process will then restart from scratch.
Interested in AI visualisations for teaching?
The VisualApps are created as a teaching and transfer project at Reutlingen University and are used in corporate training and talks.
Get in touch