Neural Playground
- 4 Devlogs
- 4 Total hours
I'm building a neural network visualizer to help you see how the network trains itself
I'm building a neural network visualizer to help you see how the network trains itself
I added a reset button so users will be able reset the network, and train the data again without having to close the app and run again. Clicking the button creates a new NeuralNetwork object, tells the canvas to swap in the new network and redraw, and resets the loss label back to blank.
Today I got the Train button actually working. Clicking it runs the network through 3000 epochs(1 epoch is one full pass through of all the data) of training, then redraws the canvas with the updated weights and shows the current loss number, you can now visually see the colors and thickness of the lines changing. I also added a loss counter on the right of the screen to show the amount of loss, and how each time you click train the loss goes down until it reaches near zero(0.0001, it will never reach 0, it will just infinitely go toward zero, but we won’t be able to see the change).The hardest part was that nothing visually changed on screen, and I assumed it was a color/contrast problem with how I was rendering the weights. I spent time tuning the color logic before realizing the bug: I had written using the wrong method leading to it not updating the visuals. Once I fixed that line, the canvas started updating correctly and the color changes I’d built earlier were finally visible. Next I am going to add a reset button and possibly live animation during training instead of only seeing the result after it finishes.
I updated the UI on the canvas to where it shows circles for neurons, connected by red and blue lines that have differing thicknesses. The red lines are positive weights, and blue lines are negative weights. The thickness of the line shows how much weight it has. Thicker lines have stronger weight magnitude, and thinner lines have weaker weights, the hardest part was actually making it symmetrical and look good, this took an hour to do. Next, I am going to make the train button actually work to show the canvas draw itself out so see the neural network build.
First Devlog!
I’m building a neural network visualizer to help you see how the network trains itself.
Today I finished the math layer of the project such as passing inputs through the network(made up of neurons which decide how strongly to fire based on the inputs), calculating how much weight(How strong a connection is between two neurons) contributed to the error and nudging every weight and bias to reduce the error.
I used NumPy to do this because of speed as it was more efficient at running due to being programmed in C(as well as python) and it had built in matrix math functions.
The hardest part was understanding backpropagation specifically how the error gets calculated backwards through every layer using the chain rule from calculus. I figured it out after I realized that the network was just asking which weights caused the mistake and nudging them in the direction that reduces the error.
Why am I building this? Because you can see more information clearly, and what path and connections the network is using, something a terminal can’t show you. And it just looks cool
To test it works, I trained it on XOR which stands for exclusive or and returns 1 only when one input is 1.
Next up: the UI