Loading the data

The first thing we need to do is to load the data and display it as a grid. Let’s now refer to each dot as a neuron, notice how they’re in grayscale. We will say the neuron will not just be on or off but instead within a range of +1 (black, on), 0 (grey, partially on/off) and -1 (white, off). Unlike our brain they will stay in whatever state they were last set to.

The full data set contains 10,000 written digits, we will split this in two so we have a training set of 8,000 digits and a testing set of 2,000 digits. When training the network we will use the corresponding numeric label to “teach” it. When testing, the cards will be used as an “exam” question for your computer to see whether it can guess correctly. It will not be given the correct solution.

I don’t think it’s worth covering how we import the data which is presented as a set of raw bytes values, it’s secondary to the function of the algorithm. You can also find the full reference on the NMIST database regarding how to process it. It’s worth pointing out that each digit is represented as an object of the class “Card”. They are all loaded using the function “loadData()” which is called before anything in “setup()” and resides outside of the “Card” class

The input being a 14x14 grid gives us 196 inputs which are stored in a simple array. The output is also stored as an array of 10 possible answer, as +1 if it corresponds to the output of -1 if it doesn’t. We will also store the label as a simple a numeric backup to the outputs using the “label” variable.

Input & Neuron Class

Now we’ve covered how to load our data, let’s refer to each circle drawn on the screen as a neuron.

We’ll start with a very simple “Neuron” class with a display function.

The highlighted calculation inside of “fill()” scales a number from +1 to -1 to a number 0 and 255. There is also an inversion to achieve a pen (black) and paper (white) effect. The firing neurons have a value close to +1 which we want to draw as black or a value of around 0 as black/grey depending on the strength.

Let’s also create a “Network” class which we’ll use to construct each layer. It has three functions:

Network : This is the initialiser, in here we setup a network with a given number of inputs, in this case this will be 196 (one for each pixel).

: This is the initialiser, in here we setup a network with a given number of inputs, in this case this will be 196 (one for each pixel). Respond : In here we respond to a card it gets shown, for now we’ll just copy the input of the card to the output of the card with no calculations.

: In here we respond to a card it gets shown, for now we’ll just copy the input of the card to the output of the card with no calculations. Display: This is used to draw our 196 neurons as a 14x14 grid

Putting everything together in our main tab gives us something that looks like this:

In this main tab we only used the “Network” class, is gets initialised in “setup()” with 196 inputs (14x14). We then feed the testing set with a random “cardNum” which gets generated with a mouse press.