WEBVTT 00:00:08.683 --> 00:00:11.616 Hi everyone, and welcome to the C2HO workshop 00:00:11.616 --> 00:00:17.483 on the Ml5 library for running machine learning models in your browser. 00:00:17.549 --> 00:00:21.283 Ml5 is a beginner friendly library that enables you 00:00:21.283 --> 00:00:25.966 to utilize machine learning directly in your web browser. 00:00:26.049 --> 00:00:29.799 The library provides access to machine learning algorithms and models in the 00:00:29.799 --> 00:00:32.799 browser building on top of TensorFlow JS 00:00:32.799 --> 00:00:35.733 with no other external dependencies, 00:00:35.733 --> 00:00:39.599 so it includes Pre-trained models that allow for recognizing images, 00:00:39.666 --> 00:00:44.349 detecting human poses, generating text, and more 00:00:44.433 --> 00:00:47.049 so in these sessions will be exploring 00:00:47.049 --> 00:00:51.766 some of the things that we can do with Ml5 00:00:51.849 --> 00:00:54.099 in our first session will be implementing 00:00:54.099 --> 00:00:57.216 a simple neural net for classifying 00:00:57.216 --> 00:01:00.216 our RGB colors. 00:01:00.466 --> 00:01:03.916 So why don't we start with a basic P5 script. 00:01:03.916 --> 00:01:07.666 It contains a set up and a draw function. 00:01:07.749 --> 00:01:10.549 Now the setup function is the first function that runs 00:01:10.549 --> 00:01:15.249 when the code is started, and here we can define different variables 00:01:15.249 --> 00:01:19.549 that we don't need to change during the execution of the code. 00:01:19.633 --> 00:01:21.916 Now the setup function automatically includes 00:01:21.916 --> 00:01:26.482 this create canvas function, which is used to specify 00:01:26.566 --> 00:01:30.049 the width and height of the canvas that we'll be drawing on, 00:01:30.132 --> 00:01:33.316 and the draw function runs continuously in a loop 00:01:33.316 --> 00:01:36.799 until the program is terminated. 00:01:36.882 --> 00:01:39.816 As we can see here, or draw 00:01:39.816 --> 00:01:43.866 function only draws a background on our canvas. 00:01:43.866 --> 00:01:48.549 So for now it takes these three values and they're all set to zero, 00:01:48.732 --> 00:01:51.949 which gives us a black square. 00:01:52.016 --> 00:01:55.082 If we instead change one of these values 00:01:55.082 --> 00:01:59.882 to a to 55, we see that the color changes. 00:02:00.132 --> 00:02:04.982 So what the background function is, taking it as its inputs 00:02:04.982 --> 00:02:09.016 Here is basically our B color values. 00:02:09.016 --> 00:02:12.649 So red, green and blue. 00:02:12.732 --> 00:02:17.666 Now each of these parameters defines the intensity of the color 00:02:17.732 --> 00:02:21.349 with a value between zero and 255. 00:02:21.432 --> 00:02:24.166 So for example, RG B 00:02:24.166 --> 00:02:27.699 255, 0, 0 is displayed as red 00:02:27.816 --> 00:02:31.032 because red is set to the highest value 00:02:31.116 --> 00:02:36.466 and the two other parameters, green and blue are set to zero. 00:02:36.549 --> 00:02:37.082 So in this 00:02:37.082 --> 00:02:40.149 session we will be training our neural network 00:02:40.149 --> 00:02:45.682 to recognize these three values and print the name of the color 00:02:45.766 --> 00:02:51.132 for a specific combination of these RG B values. 00:02:51.215 --> 00:02:54.782 Now to do that, we will need to define some attributes 00:02:54.782 --> 00:02:58.065 of our ML five neural network, and we'll do that 00:02:58.065 --> 00:03:01.715 in our setup function. 00:03:01.799 --> 00:03:04.815 So this includes the type of machine 00:03:04.815 --> 00:03:07.815 learning model that we want to use 00:03:08.032 --> 00:03:10.732 details about the models layers, 00:03:10.732 --> 00:03:14.632 the network's size and the layers activation functions. 00:03:14.782 --> 00:03:19.465 So let's define an object called 00:03:19.515 --> 00:03:23.649 neural network options 00:03:23.715 --> 00:03:28.599 like so 00:03:28.665 --> 00:03:31.365 I'm going to fill in our values here. 00:03:31.365 --> 00:03:35.182 So first off, we're going to define what kind of a task 00:03:35.182 --> 00:03:39.415 it is that we want This neural network to solve. 00:03:39.499 --> 00:03:42.015 And M.L., five neural networks 00:03:42.015 --> 00:03:45.365 allow us to choose between two tasks, 00:03:45.449 --> 00:03:48.865 one being classification and the other regression. 00:03:48.949 --> 00:03:55.615 So to begin, we're going to start with a classification task 00:03:55.699 --> 00:03:58.549 because we want it to be able to classify 00:03:58.549 --> 00:04:04.049 different B values as belonging to a certain color. 00:04:04.132 --> 00:04:04.949 The second thing 00:04:04.949 --> 00:04:08.515 we want to add to our annual network options 00:04:08.599 --> 00:04:14.065 is the layers of the network. 00:04:14.148 --> 00:04:16.198 So we are going to define that 00:04:16.198 --> 00:04:21.165 as so we're going to give it a list of layers 00:04:21.198 --> 00:04:25.048 because we want more than one. 00:04:25.132 --> 00:04:27.415 The first one 00:04:27.415 --> 00:04:31.298 we are going to define its type. 00:04:31.365 --> 00:04:38.132 Let's set that to a dense layer for now, 00:04:38.215 --> 00:04:42.498 and we need to define how many units, 00:04:42.498 --> 00:04:48.815 how many artificial neurons will exist on in this dense layer. 00:04:48.898 --> 00:04:50.965 So let's set that to 16. 00:04:50.965 --> 00:04:53.965 For example. 00:04:54.015 --> 00:04:55.615 And finally, for each layer, 00:04:55.615 --> 00:04:59.815 we need to define its activation. 00:04:59.898 --> 00:05:02.365 And so let's do that for this one. 00:05:02.365 --> 00:05:06.565 Let's set it to really draw a lot of different options. 00:05:06.565 --> 00:05:10.448 I've linked on our web page to 00:05:10.515 --> 00:05:13.615 the documentation for the M5 neural network, 00:05:13.615 --> 00:05:16.198 so you can have a play around and look at the different 00:05:16.198 --> 00:05:18.965 options you can put in here. 00:05:19.048 --> 00:05:22.048 So yeah, that's our first layer for our network. 00:05:22.065 --> 00:05:24.982 And of course we can add some more. 00:05:24.982 --> 00:05:27.915 So let's just copy and paste 00:05:27.915 --> 00:05:31.115 this previous layer 00:05:31.198 --> 00:05:34.915 and say that we want another one and another one. 00:05:34.915 --> 00:05:38.398 Why not this last layer? 00:05:38.398 --> 00:05:44.648 We're going to use a slightly different activation four for this layer, 00:05:44.715 --> 00:05:48.815 we're going to choose a sigmoid. 00:05:48.898 --> 00:05:52.115 We will change one last thing about this last layer. 00:05:52.198 --> 00:05:55.798 Instead of having its units set to 16, 00:05:55.798 --> 00:05:58.798 we're just going to remove this one altogether. 00:05:58.798 --> 00:06:01.315 This makes it so that the network will 00:06:01.315 --> 00:06:05.098 give this final layer the same amount of units 00:06:05.248 --> 00:06:08.131 as classes in our training data, 00:06:08.131 --> 00:06:11.648 which is very useful. 00:06:11.731 --> 00:06:17.681 We can also add a variable debug and set that to true. 00:06:17.765 --> 00:06:23.865 This allows us to see some of the things going on during training. 00:06:23.948 --> 00:06:27.515 See as the the model starts learning things. 00:06:27.598 --> 00:06:31.315 It's also very helpful way of visualizing what's going on 00:06:31.315 --> 00:06:36.048 in the case that things aren't working as expected. 00:06:36.115 --> 00:06:40.565 To train our neural network to recognize which RTP values 00:06:40.565 --> 00:06:45.131 correspond to which colors will need to create some training data. 00:06:45.215 --> 00:06:50.865 So our dataset will look something like this where we have 00:06:50.948 --> 00:06:53.665 let's just make this a comment. 00:06:53.665 --> 00:06:56.848 So we have different values 00:06:56.964 --> 00:07:01.398 for the different, uh. 00:07:01.464 --> 00:07:06.548 RG and B indicators. 00:07:06.631 --> 00:07:08.814 And then 00:07:08.814 --> 00:07:12.098 each set of these, 00:07:12.181 --> 00:07:14.198 these three values 00:07:14.198 --> 00:07:18.564 we will have a label, the corresponding label which will say 00:07:18.564 --> 00:07:24.581 something like This is mostly blue, so it'll say something like 00:07:24.664 --> 00:07:26.548 Bluish. 00:07:26.548 --> 00:07:31.864 So this data is saved in a file 00:07:31.948 --> 00:07:34.431 which has been added to our project. 00:07:34.431 --> 00:07:38.781 The file is adjacent file called Color Data Dot. 00:07:38.781 --> 00:07:45.481 Jason It's a bit larger than allowing us to to view it right now, 00:07:45.564 --> 00:07:53.764 but it looks something like this with RG and B and A corresponding label. 00:07:53.848 --> 00:07:56.548 So since this data is 00:07:56.548 --> 00:08:02.664 saved in a JSON file in our project, we will add a description 00:08:02.781 --> 00:08:06.731 of where this data can be found 00:08:06.798 --> 00:08:09.898 and what the inputs and outputs are. 00:08:09.898 --> 00:08:15.748 We'll add that to all our variable and then options in our setup function. 00:08:15.831 --> 00:08:20.531 So we have the data URL, 00:08:20.597 --> 00:08:25.231 which in our case it's in a folder 00:08:25.314 --> 00:08:27.931 in this project 00:08:27.931 --> 00:08:30.864 called Color Data dot. 00:08:30.864 --> 00:08:33.864 Jason 00:08:33.981 --> 00:08:35.297 added a little color 00:08:35.297 --> 00:08:38.631 so that the editor doesn't complain. 00:08:38.697 --> 00:08:44.314 Then we'll need to define the inputs. 00:08:44.397 --> 00:08:50.347 As I said, the inputs are in the form of 00:08:50.431 --> 00:08:55.264 three values or denotes a red value. 00:08:55.347 --> 00:08:58.014 B denotes blue value 00:08:58.014 --> 00:09:02.197 and g denotes our green value 00:09:02.281 --> 00:09:05.997 and then our outputs 00:09:06.081 --> 00:09:09.031 will be denoted 00:09:09.031 --> 00:09:13.081 by the word label, 00:09:13.164 --> 00:09:14.931 like so. 00:09:14.931 --> 00:09:19.231 So now we can declare our neural network, 00:09:19.314 --> 00:09:22.314 let's just call it and then for short 00:09:22.314 --> 00:09:26.831 and it is an email five 00:09:26.914 --> 00:09:31.031 dot neural 00:09:31.114 --> 00:09:33.747 network 00:09:33.747 --> 00:09:38.464 and it's going to take two arguments 00:09:38.547 --> 00:09:39.381 as its input. 00:09:39.381 --> 00:09:42.714 The first is R and then oops R, 00:09:42.814 --> 00:09:48.097 and then options. 00:09:48.180 --> 00:09:53.080 And the second is actually a function 00:09:53.164 --> 00:09:57.547 which we will call model ready, 00:09:57.630 --> 00:10:03.514 which will be handling the training of our model. 00:10:03.597 --> 00:10:07.530 So let's define that straightaway. 00:10:07.614 --> 00:10:15.130 Underneath R and R sets up function. 00:10:15.214 --> 00:10:18.864 So the way we define a function in P 00:10:18.864 --> 00:10:22.797 five is basically just the word function. 00:10:22.797 --> 00:10:26.114 And then we're going to give it our name 00:10:26.180 --> 00:10:29.014 model ready. 00:10:29.014 --> 00:10:32.414 It itself does not take any arguments, 00:10:32.480 --> 00:10:35.480 so just an empty parentheses 00:10:35.614 --> 00:10:40.230 and here will do the things that we want to get done for training the model. 00:10:40.314 --> 00:10:43.430 So one of the things that we want to define here 00:10:43.430 --> 00:10:48.747 are the options for how we want training to go down. 00:10:48.747 --> 00:10:53.164 So we're going to make a constant 00:10:53.247 --> 00:11:02.130 called training options 00:11:02.214 --> 00:11:06.247 and let's see, we'll do it like this. 00:11:06.330 --> 00:11:09.147 So we're going to give it a couple of values. 00:11:09.147 --> 00:11:13.713 So we want to let the model know how long it should be training. 00:11:13.797 --> 00:11:16.463 So that is kept in this variable 00:11:16.463 --> 00:11:19.047 with the key name epochs 00:11:19.047 --> 00:11:22.530 that denotes how many times we want the model 00:11:22.530 --> 00:11:25.530 to traverse the entire dataset 00:11:25.647 --> 00:11:28.463 before training ends. 00:11:28.463 --> 00:11:34.363 And the second value is batch size, 00:11:34.430 --> 00:11:37.280 which refers to how many examples 00:11:37.280 --> 00:11:40.280 we want the model to look at in 00:11:40.380 --> 00:11:44.163 in one go before doing any updates. 00:11:44.247 --> 00:11:48.313 So let's set that to 64. 00:11:48.380 --> 00:11:52.813 Again, these are all values that we would call hyper parameters, 00:11:52.880 --> 00:11:56.997 meaning that you can try out different things, they'll have different effects 00:11:56.997 --> 00:12:01.463 on how quickly the model trains and things like that. 00:12:01.463 --> 00:12:05.280 So feel free to play around with these values as well as 00:12:05.363 --> 00:12:10.930 the layers that we have defined in R and in options. 00:12:11.013 --> 00:12:14.130 So the final thing we want to add to this model 00:12:14.163 --> 00:12:19.230 ready function is that we want to start training. 00:12:19.313 --> 00:12:25.380 So we will use our model and then 00:12:25.463 --> 00:12:28.930 and simply call the function train. 00:12:29.013 --> 00:12:31.813 And we want that function to take 00:12:31.813 --> 00:12:35.013 our training 00:12:35.096 --> 00:12:37.880 options 00:12:37.880 --> 00:12:39.963 variable 00:12:39.963 --> 00:12:44.230 as its argument. 00:12:44.313 --> 00:12:45.813 Now since 00:12:45.813 --> 00:12:49.080 and then our neural network 00:12:49.080 --> 00:12:54.080 will be reference throughout this program, we want to be able to call it 00:12:54.080 --> 00:12:59.613 from different functions in our draw function, maybe in our model ready, 00:12:59.696 --> 00:13:02.696 we should define it 00:13:02.846 --> 00:13:06.613 at the very top of our program 00:13:06.680 --> 00:13:11.246 so that this variable and then is recognizable. 00:13:11.330 --> 00:13:15.896 The final thing that I would recommend doing in this function model already 00:13:15.980 --> 00:13:25.196 is to let the model normalize its data. 00:13:25.280 --> 00:13:28.096 So there is an MFI function called 00:13:28.096 --> 00:13:34.830 normally normalized data, which will do all this 00:13:34.913 --> 00:13:38.646 on our behalf, which is good. 00:13:38.713 --> 00:13:43.696 There are many reasons why we would want to normalize data, 00:13:43.696 --> 00:13:49.113 especially if our values can have very different ranges. 00:13:49.196 --> 00:13:52.880 In our case, all our data is in the range of zero 00:13:52.880 --> 00:13:57.313 and to 55, but in general it's a good rule of thumb 00:13:57.313 --> 00:14:01.279 to make sure that the data is normalized, even though the variables 00:14:01.279 --> 00:14:03.613 are quite consistent 00:14:03.613 --> 00:14:07.796 and many machine learning algorithms will work better 00:14:07.796 --> 00:14:11.896 when the input data is normalized and it can lead to foster training 00:14:11.896 --> 00:14:16.779 and better performance overall. 00:14:16.863 --> 00:14:18.513 So now that we have defined 00:14:18.513 --> 00:14:23.646 and trained our model, we can give it some data to classify. 00:14:23.729 --> 00:14:27.213 And since we are working in P5, 00:14:27.296 --> 00:14:30.996 it makes sense for us to make it 00:14:30.996 --> 00:14:35.913 so that we can enter these RTP values interactively. 00:14:35.946 --> 00:14:38.913 For example, using sliders. 00:14:38.996 --> 00:14:42.513 So in our setup function, 00:14:42.596 --> 00:14:45.929 we are going to define three sliders, 00:14:46.079 --> 00:14:48.929 one for red, one for green and one for blue. 00:14:48.929 --> 00:14:52.146 So let's call it our slider 00:14:52.229 --> 00:14:54.713 for the first one 00:14:54.713 --> 00:15:00.396 and we use the P5 function create slider. 00:15:00.479 --> 00:15:01.979 And as we can see here, 00:15:01.979 --> 00:15:05.763 it takes in two values 00:15:05.846 --> 00:15:09.796 that are required, which is the main and the max of the slider. 00:15:09.863 --> 00:15:14.796 And since our RGV values can range from 0 to 255, 00:15:14.879 --> 00:15:17.579 that's what we want. 00:15:17.579 --> 00:15:21.879 So we simply put in zero and two, five, five, 00:15:21.962 --> 00:15:24.596 and then we're going to make two more of these. 00:15:24.596 --> 00:15:29.012 So let's just do that like this. 00:15:29.096 --> 00:15:32.612 Then we rename them so we have red slider, 00:15:32.846 --> 00:15:37.262 green slider, blue slider like so. 00:15:37.346 --> 00:15:41.562 And we also need to place these sliders on our 00:15:41.629 --> 00:15:46.079 campus so we can do that by 00:15:46.162 --> 00:15:50.829 referring to its position. 00:15:50.912 --> 00:15:53.396 Like so 00:15:53.396 --> 00:15:56.396 our sliders position 00:15:56.462 --> 00:16:01.112 should be at the top of the screen, 00:16:01.196 --> 00:16:06.912 which means that we want it to have quite a low 00:16:06.979 --> 00:16:11.046 height value because we count zero 00:16:11.129 --> 00:16:15.012 zero is the position of this top corner of our campus. 00:16:15.079 --> 00:16:17.329 That can take some getting used to. 00:16:17.329 --> 00:16:21.179 If your if you're like me and feel like it makes more sense for zero 00:16:21.179 --> 00:16:25.262 zero to be down here. 00:16:25.346 --> 00:16:25.612 Yeah. 00:16:25.612 --> 00:16:29.279 So that's our red slider position. 00:16:29.362 --> 00:16:31.946 Do the same with our 00:16:31.946 --> 00:16:34.046 green slider. 00:16:34.046 --> 00:16:37.362 This one can be a little bit further down, 00:16:37.429 --> 00:16:40.895 so let's give it 00:16:40.979 --> 00:16:44.829 a bit higher of a Y value. 00:16:44.912 --> 00:16:48.462 And finally, our Blue Slider 00:16:48.529 --> 00:16:52.795 has to be, again, 00:16:52.795 --> 00:16:56.762 slightly lower on the screen. 00:16:56.845 --> 00:17:00.279 Something like this maybe. 00:17:00.362 --> 00:17:03.262 Let's see, 00:17:03.262 --> 00:17:05.512 So now we can see that we have our three 00:17:05.512 --> 00:17:10.129 sliders here at the on the top left corner 00:17:10.212 --> 00:17:15.712 and we can see some of our debug information here on the right. 00:17:15.795 --> 00:17:20.479 Now we can also hide this if we are done looking at it 00:17:20.562 --> 00:17:21.862 or if we don't want it at all. 00:17:21.862 --> 00:17:27.929 We can set debug to false like so 00:17:28.012 --> 00:17:32.395 now we just get our canvas instead. 00:17:32.479 --> 00:17:34.245 Now I'm also going to set 00:17:34.245 --> 00:17:38.745 a couple of variables in our setup function 00:17:38.745 --> 00:17:43.729 that will help us to define the text that we want to display. 00:17:43.729 --> 00:17:47.679 We want the model to display the label 00:17:47.679 --> 00:17:51.379 and the confidence in its predictions, 00:17:51.462 --> 00:17:54.279 and probably it's also useful 00:17:54.279 --> 00:17:58.529 to label these RG B sliders as well. 00:17:58.612 --> 00:18:02.229 So we're going to set some variables 00:18:02.229 --> 00:18:05.912 just defining our text. 00:18:05.978 --> 00:18:08.978 The first one is text size, 00:18:09.012 --> 00:18:11.745 which we will set quite large, I think. 00:18:11.745 --> 00:18:14.745 Let's try it out 00:18:14.862 --> 00:18:19.345 and then we want to 00:18:19.428 --> 00:18:24.178 fill that text with a white background 00:18:24.262 --> 00:18:27.078 that just 00:18:27.078 --> 00:18:28.062 by setting two, five, 00:18:28.062 --> 00:18:34.878 five in our fill function, 00:18:34.962 --> 00:18:39.262 we're setting our stroke to zero 00:18:39.345 --> 00:18:42.345 and our stroke weight 00:18:42.378 --> 00:18:47.578 to four. 00:18:47.662 --> 00:18:50.228 That'll hopefully give us a white text 00:18:50.228 --> 00:18:54.428 quite large and outlined in like 00:18:54.495 --> 00:19:00.145 so now we can change our draw function 00:19:00.228 --> 00:19:04.228 so that it displays both our slider labels 00:19:04.312 --> 00:19:08.462 and the model's predictions. 00:19:08.545 --> 00:19:13.895 So we do that by adding some text. 00:19:13.978 --> 00:19:17.945 The reason we want to add this in our draw function 00:19:18.028 --> 00:19:22.145 is that if we had added this 00:19:22.228 --> 00:19:25.228 in our set up function, it'll only be run 00:19:25.245 --> 00:19:29.428 once and the draw function, which is run on a loop, 00:19:29.511 --> 00:19:34.695 would basically just draw a background to cover up our text. 00:19:34.695 --> 00:19:37.011 So we want it to be drawn 00:19:37.011 --> 00:19:38.661 consistently. 00:19:38.661 --> 00:19:40.845 So with the text 00:19:40.845 --> 00:19:44.511 we need to give it the actual text to be displayed, 00:19:44.695 --> 00:19:48.328 which here for our first 00:19:48.411 --> 00:19:50.961 label is just for the red slider. 00:19:50.961 --> 00:19:55.278 So we're just going to label it all and we need to give it a position. 00:19:55.495 --> 00:20:00.095 So we're going to use the position of the Red slider, 00:20:00.178 --> 00:20:08.461 its position in the X dimension, 00:20:08.545 --> 00:20:14.428 and we want it to be 00:20:14.511 --> 00:20:16.611 about double that and we want to add 00:20:16.611 --> 00:20:19.611 the the sliders width. 00:20:19.611 --> 00:20:24.445 So to refer to the R slider like so 00:20:24.528 --> 00:20:30.961 and we can get the size of it like this 00:20:31.045 --> 00:20:32.628 and then let's place it 00:20:32.628 --> 00:20:37.861 slightly, slightly more to the right 00:20:37.945 --> 00:20:40.095 now. Sorry, 00:20:40.095 --> 00:20:43.695 slightly further down 00:20:43.778 --> 00:20:44.278 There we go. 00:20:44.278 --> 00:20:49.061 And we are going to 00:20:49.145 --> 00:20:51.328 add these for each 00:20:51.328 --> 00:20:56.228 of our red, green, blue sliders. 00:20:56.311 --> 00:20:58.894 So let's just change 00:20:58.894 --> 00:21:02.178 our valuable variable names 00:21:02.244 --> 00:21:08.678 to correspond to the right slider. 00:21:08.761 --> 00:21:09.778 There we go. 00:21:09.778 --> 00:21:13.211 And we are going to 00:21:13.294 --> 00:21:17.978 let's just see how this looks, placing them 00:21:18.061 --> 00:21:20.494 around. So 00:21:20.494 --> 00:21:22.444 the final thing 00:21:22.444 --> 00:21:24.744 we will be changing here 00:21:24.744 --> 00:21:27.744 is our background color. 00:21:27.878 --> 00:21:31.111 So instead of it being a static color like this, 00:21:31.111 --> 00:21:35.894 we want it to reflect the slider values instead. 00:21:35.978 --> 00:21:40.661 So let's change that. 00:21:40.744 --> 00:21:43.744 So we want our background 00:21:43.778 --> 00:21:50.028 to take its red value from our red slider. 00:21:50.094 --> 00:21:52.411 So we simply call 00:21:52.411 --> 00:21:55.594 value like so 00:21:55.678 --> 00:22:00.761 and then we do the same for our green slider 00:22:00.844 --> 00:22:02.994 dot value 00:22:02.994 --> 00:22:06.278 and blue slider 00:22:06.361 --> 00:22:10.478 dot value. 00:22:10.561 --> 00:22:17.294 So let's run it. 00:22:17.377 --> 00:22:20.644 We go, I see our G has 00:22:20.727 --> 00:22:21.627 it's a bit too high. 00:22:21.627 --> 00:22:24.177 Let's try 65 instead. 00:22:24.177 --> 00:22:26.227 Run again. 00:22:26.227 --> 00:22:28.527 Yeah, looks pretty good. 00:22:28.527 --> 00:22:32.494 And if we now change the sliders, 00:22:32.577 --> 00:22:35.094 you see that our background color changes as well. 00:22:35.094 --> 00:22:38.244 So this will now be the input to our model. 00:22:38.344 --> 00:22:41.611 Also. 00:22:41.694 --> 00:22:44.644 So in order to actually get our model to 00:22:44.644 --> 00:22:51.277 to classify some data, we're going to define a function 00:22:51.361 --> 00:22:56.861 which is called classify. 00:22:56.944 --> 00:22:59.427 And inside here 00:22:59.427 --> 00:23:09.694 we're going to define our inputs 00:23:09.777 --> 00:23:15.494 as a list of our 00:23:15.561 --> 00:23:18.094 values that we read directly from the slider. 00:23:18.094 --> 00:23:24.577 So are should correspond to the value of our 00:23:24.661 --> 00:23:31.694 red slider. 00:23:31.761 --> 00:23:38.160 We should refer to our Blue slider 00:23:38.244 --> 00:23:42.994 and its value 00:23:43.077 --> 00:23:46.077 and then g 00:23:46.110 --> 00:23:48.894 for our green slider 00:23:48.894 --> 00:23:51.894 and its value. 00:23:51.960 --> 00:24:00.994 So commas here 00:24:01.077 --> 00:24:03.960 and then we will call 00:24:03.960 --> 00:24:07.860 the classify function of ml5. 00:24:07.944 --> 00:24:11.694 So now that we have organized what our inputs look like, 00:24:11.694 --> 00:24:16.477 we can use our neural net and call 00:24:16.560 --> 00:24:19.560 classify 00:24:19.610 --> 00:24:24.160 and classify will take to 00:24:24.244 --> 00:24:25.594 arguments. 00:24:25.594 --> 00:24:31.544 The first is are inputs. 00:24:31.610 --> 00:24:36.127 And the second is our. 00:24:36.210 --> 00:24:39.844 We need to define a function to basically handle 00:24:39.844 --> 00:24:43.844 the results of our neural nets classifications. 00:24:43.910 --> 00:24:48.360 So first off, we want to place 00:24:48.444 --> 00:24:53.827 inputs in a list like so. 00:24:53.910 --> 00:24:58.694 So inputs 00:24:58.760 --> 00:25:06.543 red inputs, 00:25:06.627 --> 00:25:15.843 green and inputs 00:25:15.927 --> 00:25:17.143 green, which I already did. 00:25:17.143 --> 00:25:20.743 So that's 00:25:20.810 --> 00:25:23.277 I just realized that these are in the wrong order. 00:25:23.277 --> 00:25:25.827 I think that should be okay. 00:25:25.827 --> 00:25:29.510 So yeah, it takes our inputs in, in this format as a list 00:25:29.510 --> 00:25:34.777 and then we need to have a function to handle the results of, of classify. 00:25:34.860 --> 00:25:35.877 So let's just call that one. 00:25:35.877 --> 00:25:39.243 Got results 00:25:39.327 --> 00:25:42.477 not get because we already got. 00:25:42.660 --> 00:25:44.960 So got results. 00:25:44.960 --> 00:25:54.027 Let's define that function now. 00:25:54.110 --> 00:25:58.010 So the got results function 00:25:58.093 --> 00:26:02.477 is going to take two arguments. 00:26:02.560 --> 00:26:05.477 The first is 00:26:05.477 --> 00:26:09.860 an error and the second is that we got some results. 00:26:09.943 --> 00:26:12.877 So it's good good policy 00:26:12.877 --> 00:26:17.327 to handle this error in some way. 00:26:17.410 --> 00:26:19.960 So if there is one, 00:26:19.960 --> 00:26:25.376 we simply want to 00:26:25.460 --> 00:26:26.743 print whatever 00:26:26.743 --> 00:26:31.310 the errors to our console, which is down here. 00:26:31.393 --> 00:26:33.193 So to do that, 00:26:33.193 --> 00:26:40.193 we simply write console dot log 00:26:40.276 --> 00:26:42.826 and then error 00:26:42.826 --> 00:26:45.643 like so. 00:26:45.643 --> 00:26:47.076 And if we don't get an error 00:26:47.076 --> 00:26:50.476 and everything is good and fine, 00:26:50.560 --> 00:26:55.843 then we want to deal with our results in some way. 00:26:55.926 --> 00:26:59.226 So one thing that we might want to do with our results 00:26:59.226 --> 00:27:03.943 is, is basically to just print them on our canvas. 00:27:04.026 --> 00:27:06.610 So first off, let's 00:27:06.610 --> 00:27:12.043 get a hold of these these results, whatever they may be. 00:27:12.126 --> 00:27:14.593 So we place 00:27:14.593 --> 00:27:23.176 the label of our results 00:27:23.260 --> 00:27:24.760 in this variable. 00:27:24.760 --> 00:27:27.193 Raise, 00:27:27.193 --> 00:27:30.226 and we also get access 00:27:30.226 --> 00:27:35.426 to the confidence of the model for a given prediction. 00:27:35.493 --> 00:27:41.593 So we can save that as well. 00:27:41.676 --> 00:27:44.626 So within our results, 00:27:44.626 --> 00:27:46.993 we want the 00:27:46.993 --> 00:27:52.843 the first results always 00:27:52.926 --> 00:27:56.876 we can access this variable confidence 00:27:56.943 --> 00:27:58.693 and this will be 00:27:58.693 --> 00:28:02.409 probably given with a lot of decimals. 00:28:02.643 --> 00:28:07.243 And so let's limit that by using the function 00:28:07.326 --> 00:28:17.876 to fixed and set that to a maximum of of two decimals. 00:28:17.943 --> 00:28:19.726 Good. 00:28:19.726 --> 00:28:22.126 The final thing we want to do is 00:28:22.126 --> 00:28:25.126 we have got some results 00:28:25.176 --> 00:28:30.743 is that we want to continue classifying. 00:28:30.826 --> 00:28:32.476 So we simply call 00:28:32.476 --> 00:28:35.476 the classify function that we defined. 00:28:35.676 --> 00:28:37.276 Again. 00:28:37.276 --> 00:28:41.576 So if we want to print the resulting label 00:28:41.659 --> 00:28:45.726 from the model and the confidence, we will need to access this, 00:28:45.793 --> 00:28:49.676 these variables, Reds and Kongs inside the draw function. 00:28:49.759 --> 00:28:56.759 So let's go away to the top of our script and 00:28:56.843 --> 00:29:01.359 make them globally accessible 00:29:01.426 --> 00:29:02.726 like so. 00:29:02.726 --> 00:29:07.259 And then inside our draw function, we can add 00:29:07.343 --> 00:29:11.909 another piece of text 00:29:11.992 --> 00:29:14.059 where we will 00:29:14.059 --> 00:29:18.642 be printing these these results. 00:29:18.726 --> 00:29:21.992 So the way that will do that is by adding 00:29:22.226 --> 00:29:25.776 a kind of special looking 00:29:25.859 --> 00:29:29.909 type of text so that we can get these variables 00:29:29.909 --> 00:29:34.142 printed every time we, we call the draw function. 00:29:34.226 --> 00:29:38.892 So we're going to use these sort of special case. 00:29:38.976 --> 00:29:42.192 You can see that the color here is different 00:29:42.276 --> 00:29:45.992 from the B text in the slider. 00:29:46.076 --> 00:29:50.626 It's because I'm using a slightly different quotation mark, 00:29:50.692 --> 00:29:52.776 the one that leans 00:29:52.776 --> 00:29:54.592 leans backward. 00:29:54.592 --> 00:29:56.826 So the way that we access 00:29:56.826 --> 00:30:01.226 them is using a dollar sign. 00:30:01.226 --> 00:30:06.309 And then these curly brackets, 00:30:06.392 --> 00:30:08.642 and then we refer to our 00:30:08.642 --> 00:30:14.326 a variable name, which was raise. 00:30:14.392 --> 00:30:19.326 And then let's see. 00:30:19.409 --> 00:30:28.742 So and we want our confidence as well. 00:30:28.826 --> 00:30:34.275 So dollar sign and. 00:30:34.342 --> 00:30:37.725 I was not raised with the. 00:30:37.792 --> 00:30:40.992 It was like so. 00:30:41.075 --> 00:30:43.409 And then we want to close it off 00:30:43.409 --> 00:30:47.192 with the same leaning back 00:30:47.275 --> 00:30:54.275 quotation mark. 00:30:54.359 --> 00:30:59.192 They can be a bit finicky. 00:30:59.275 --> 00:31:00.475 There you go. 00:31:00.475 --> 00:31:04.542 And we need to place it on r canvas. 00:31:04.625 --> 00:31:11.942 So we want it to be the same distance from the margin as R 00:31:12.025 --> 00:31:14.975 as our slider values. 00:31:14.975 --> 00:31:17.092 So that was T, if you remember. 00:31:17.092 --> 00:31:20.009 If not, you can see it here. 00:31:20.009 --> 00:31:24.242 We defined them in our setup function 00:31:24.325 --> 00:31:29.559 and we want them say halfway up or canvas. 00:31:29.642 --> 00:31:32.725 So we can use, uh, we know that our canvas 00:31:32.725 --> 00:31:36.375 size is 400 by 400. 00:31:36.442 --> 00:31:40.475 So 200 should be halfway up the canvas. 00:31:40.525 --> 00:31:46.325 Then we can try to run a code and see. 00:31:46.409 --> 00:31:48.125 Yeah. 00:31:48.125 --> 00:31:51.142 See that the confidence value has been cut off a bit here. 00:31:51.142 --> 00:31:53.375 So let's. 00:31:53.375 --> 00:31:56.609 Let's just change the size of our canvas 00:31:56.609 --> 00:31:59.608 to make it slightly easier to see. 00:31:59.675 --> 00:32:05.708 It's double the size. 00:32:05.792 --> 00:32:07.942 And then try again. 00:32:07.942 --> 00:32:10.075 There we go. 00:32:10.075 --> 00:32:10.525 Nice. 00:32:10.525 --> 00:32:14.442 Big color block. 00:32:14.525 --> 00:32:17.542 Now, the last thing that we want to do 00:32:17.575 --> 00:32:21.742 to sort of get everything going from the beginning 00:32:21.742 --> 00:32:26.192 says you can see now the label and the confidence is undefined. 00:32:26.275 --> 00:32:29.975 Even if we change our P values. 00:32:30.058 --> 00:32:30.875 So the first thing that 00:32:30.875 --> 00:32:34.975 we want to do is to add this call 00:32:34.975 --> 00:32:39.292 to our classify function as the last step of model. 00:32:39.292 --> 00:32:39.825 Ready. 00:32:39.825 --> 00:32:43.958 So after training, 00:32:44.042 --> 00:32:50.258 we call our classify function. 00:32:50.342 --> 00:32:54.592 So now we should be ready to try and train our model 00:32:54.592 --> 00:32:59.225 and give it some values to classify on the fly. 00:32:59.308 --> 00:33:01.225 So let's go. 00:33:01.225 --> 00:33:04.442 We press play and we can see that 00:33:04.442 --> 00:33:08.292 it is changing its mind a bit 00:33:08.375 --> 00:33:12.225 and the confidence and label is changing. 00:33:12.292 --> 00:33:21.941 We can also change the values as it's training. 00:33:22.025 --> 00:33:25.575 That's pretty good. 00:33:25.641 --> 00:33:26.475 Beg to differ. 00:33:26.475 --> 00:33:30.275 I would say that this is still pink, but 00:33:30.358 --> 00:33:33.358 yeah, it's now doing quite a good job 00:33:33.541 --> 00:33:39.308 and if we want we can change the debug value to true 00:33:39.391 --> 00:33:45.675 so that we can actually see what's going on during training. 00:33:45.741 --> 00:33:46.741 So on the bottom here, we 00:33:46.741 --> 00:33:51.425 have the number of epochs that it should run for. 00:33:51.658 --> 00:33:54.658 So how many times it should go through all the data 00:33:54.875 --> 00:33:58.475 and then we have the loss value or 00:33:58.558 --> 00:34:04.708 basically just a measure of how much the model is improving and that should be 00:34:04.708 --> 00:34:09.275 if the model is training correctly, this should be a downward 00:34:09.358 --> 00:34:11.991 tendency, which it is. 00:34:11.991 --> 00:34:14.841 Now the model seems to be done so we can change it 00:34:14.841 --> 00:34:18.375 around change of values 00:34:18.441 --> 00:34:21.291 and see if the model is able to predict 00:34:21.291 --> 00:34:30.791 in a way that we agree with. 00:34:30.875 --> 00:34:33.725 So now that we have a model that can guess 00:34:33.725 --> 00:34:37.908 a color label based on our RTP values, 00:34:37.991 --> 00:34:40.475 let's flip the problem around 00:34:40.475 --> 00:34:44.458 and make a model that can generate color, i.e. 00:34:44.458 --> 00:34:50.091 a set of RTP values based on our labels instead. 00:34:50.158 --> 00:34:51.191 So first, we're 00:34:51.191 --> 00:34:54.958 going to need to change some of the values in our 00:34:54.958 --> 00:35:00.341 and then options variable, which defines the structure and parameters 00:35:00.341 --> 00:35:02.374 of our neural network. 00:35:02.374 --> 00:35:05.824 So the first thing we can do is we're no longer doing a classification 00:35:05.824 --> 00:35:06.491 task. 00:35:06.491 --> 00:35:12.374 We are now doing a regression task. 00:35:12.458 --> 00:35:15.491 The second thing that we want to change 00:35:15.491 --> 00:35:20.091 is that we want to flip around our inputs and outputs. 00:35:20.158 --> 00:35:24.941 So now our inputs should be 00:35:25.024 --> 00:35:27.808 the label 00:35:27.808 --> 00:35:32.374 and our outputs should be these RG B values. 00:35:32.374 --> 00:35:41.958 Instead, 00:35:42.041 --> 00:35:48.408 like so. 00:35:48.491 --> 00:35:52.208 So now that we are going to be changing it 00:35:52.208 --> 00:35:56.241 to a regression task, we can still keep our three layers. 00:35:56.258 --> 00:36:01.208 But for the best results I suggest that we switch 00:36:01.291 --> 00:36:05.091 from our really activation functions 00:36:05.158 --> 00:36:08.074 to sigmoid across all. 00:36:08.074 --> 00:36:11.157 Now again, this is a hyper parameter, so you can 00:36:11.157 --> 00:36:16.507 absolutely try some different things and see how they work for you. 00:36:16.591 --> 00:36:17.841 Now, since we 00:36:17.841 --> 00:36:21.724 are going to be giving the model labels 00:36:21.807 --> 00:36:26.907 instead of our RG P values, let's change 00:36:26.974 --> 00:36:30.841 the inputs to our 00:36:30.924 --> 00:36:32.491 to our model. 00:36:32.491 --> 00:36:34.941 Instead of having sliders, 00:36:34.941 --> 00:36:38.407 let's instead use a dropdown menu. 00:36:38.474 --> 00:36:43.407 So the first thing we are going to do is we're going to define a dropdown 00:36:43.407 --> 00:36:50.257 menu variable and we can remove our sliders 00:36:50.324 --> 00:36:53.791 and instead we're going to do 00:36:53.874 --> 00:36:57.391 dropdown. 00:36:57.474 --> 00:36:59.424 And this is a variable that we are going to 00:36:59.424 --> 00:37:03.424 be using across the entire script. 00:37:03.507 --> 00:37:08.857 So let's define it again outside our 00:37:08.924 --> 00:37:11.924 setup function 00:37:12.024 --> 00:37:15.274 so that we can access it wherever. 00:37:15.357 --> 00:37:18.024 And while we're here, let's also 00:37:18.024 --> 00:37:21.807 define our list of possible labels 00:37:21.974 --> 00:37:25.624 which we can choose from to have the model try and generate. 00:37:25.707 --> 00:37:29.674 We can call this variable color labels, 00:37:29.757 --> 00:37:32.990 and I have a little sheet here 00:37:32.990 --> 00:37:37.657 just to get all these labels in. 00:37:37.724 --> 00:37:42.257 There we go. 00:37:42.340 --> 00:37:45.740 So in our setup function, 00:37:45.824 --> 00:37:51.140 we can define our dropdown menu 00:37:51.224 --> 00:38:00.524 using p five create select function. 00:38:00.607 --> 00:38:04.824 We also have to place our dropdown menu, 00:38:04.907 --> 00:38:12.590 so we give it a position 00:38:12.674 --> 00:38:14.807 and let's place it 00:38:14.807 --> 00:38:19.557 around about the same spot where we had all 00:38:19.624 --> 00:38:22.540 and sliders. 00:38:22.540 --> 00:38:25.207 So let's go the height of the canvas 00:38:25.207 --> 00:38:28.874 which is 800. 00:38:29.007 --> 00:38:31.540 About halfway down 00:38:31.540 --> 00:38:34.540 our canvas will place our dropdown menu 00:38:34.774 --> 00:38:41.274 and these are usually quite small, 00:38:41.357 --> 00:38:43.457 so let's 00:38:43.457 --> 00:38:47.024 set its size a little bit larger. 00:38:47.107 --> 00:38:50.024 So again it's the width and height, 00:38:50.024 --> 00:38:55.040 so let's set it around here somewhere and have a look. 00:38:55.123 --> 00:38:57.907 And now we need to populate our dropdown menu. 00:38:57.907 --> 00:39:01.723 So the easiest way of doing that is when you have a fair 00:39:01.723 --> 00:39:05.390 amount of values that you want to be available in your dropdown 00:39:05.473 --> 00:39:07.773 is to do it with a four loop. 00:39:07.773 --> 00:39:16.190 So let's set up a four loop that iterates through all 00:39:16.273 --> 00:39:21.973 through our list of colors. 00:39:22.057 --> 00:39:24.607 So for our constant 00:39:24.607 --> 00:39:30.473 label of our color labels list, 00:39:30.557 --> 00:39:35.607 we want to do 00:39:35.673 --> 00:39:38.557 set the dropdown 00:39:38.557 --> 00:39:41.557 option 00:39:41.557 --> 00:39:46.540 to that label. 00:39:46.623 --> 00:39:50.173 Now we can replace or classify function 00:39:50.240 --> 00:39:53.790 with a predicted function instead. 00:39:53.873 --> 00:39:59.857 So let's remove the classify function 00:39:59.940 --> 00:40:07.240 and instead to function predict 00:40:07.323 --> 00:40:08.573 and predict 00:40:08.573 --> 00:40:11.573 should then choose 00:40:11.690 --> 00:40:16.123 the currently selected dropdown value. 00:40:16.190 --> 00:40:21.340 So that's let's call it label selected 00:40:21.423 --> 00:40:27.490 and set that to be the current value 00:40:27.573 --> 00:40:31.873 of our dropdown menu. 00:40:31.940 --> 00:40:37.740 Oh sorry, not label should be value 00:40:37.823 --> 00:40:44.590 like so. 00:40:44.673 --> 00:40:47.340 And then we can call 00:40:47.340 --> 00:40:51.906 predict meal five's predict function. 00:40:51.990 --> 00:40:55.556 And again we have to sort of wrap that in a little list. 00:40:55.556 --> 00:40:59.673 So that's our label selected variable 00:40:59.756 --> 00:41:02.273 that will be the input to our model. 00:41:02.273 --> 00:41:05.523 And we remember from our classify function 00:41:05.606 --> 00:41:11.823 that we need some method of handling the results from the model. So 00:41:11.906 --> 00:41:20.190 let's keep our got results function. 00:41:20.273 --> 00:41:23.273 We do, however, have to make some changes 00:41:23.273 --> 00:41:27.823 since now our results will look a little bit different. 00:41:27.890 --> 00:41:32.790 So previously we had these result and comp variables. 00:41:32.790 --> 00:41:36.423 They were declared here outside in the global scope. 00:41:36.506 --> 00:41:38.523 So let's now, 00:41:38.523 --> 00:41:41.306 since we're no longer just getting one result, 00:41:41.306 --> 00:41:44.306 we're going to get three values instead of a label. 00:41:44.373 --> 00:41:48.906 So let's define these result values. 00:41:48.989 --> 00:41:52.623 So let's say results 00:41:52.706 --> 00:41:55.406 are four are 00:41:55.406 --> 00:41:58.106 a red prediction 00:41:58.106 --> 00:42:03.289 and the same for 00:42:03.373 --> 00:42:09.839 B or blue and green, 00:42:09.923 --> 00:42:12.606 right? So 00:42:12.606 --> 00:42:14.223 so now if we have a look at 00:42:14.223 --> 00:42:19.689 what these results look like, we can see that we will get 00:42:19.773 --> 00:42:24.106 three different predictions for 00:42:24.189 --> 00:42:27.406 one for each of our RG B color values. 00:42:27.489 --> 00:42:31.123 So if there has not been an error, 00:42:31.206 --> 00:42:37.689 we need to pick up these values. 00:42:37.773 --> 00:42:41.956 So we do that from our 00:42:42.039 --> 00:42:46.239 results variable which we get as an input to this. 00:42:46.239 --> 00:42:49.723 Got results function. 00:42:49.806 --> 00:42:51.689 And previously 00:42:51.689 --> 00:42:55.889 we could just sort of bother with the first result. 00:42:56.039 --> 00:43:00.406 But here since we get three, we're going to go 00:43:00.489 --> 00:43:04.906 a result. G 00:43:04.989 --> 00:43:07.139 comes from 00:43:07.139 --> 00:43:11.239 the second 00:43:11.306 --> 00:43:13.389 result value 00:43:13.389 --> 00:43:20.356 and the last one 00:43:20.439 --> 00:43:22.472 like so. 00:43:22.472 --> 00:43:27.389 And we also get with these results as with our classification results, 00:43:27.639 --> 00:43:32.022 we get a lot of extra information regarding confidence and things like that. 00:43:32.106 --> 00:43:34.922 But right now we just need the results themselves 00:43:34.922 --> 00:43:38.739 so that the model can generate the color. 00:43:38.822 --> 00:43:43.956 So we need to specify the value that we want to pick up. 00:43:44.039 --> 00:43:50.889 So in this case, the red value is results zero 00:43:50.972 --> 00:43:54.189 and its corresponding R value 00:43:54.272 --> 00:43:57.306 and green for green 00:43:57.389 --> 00:44:03.789 and of course blue for blue. 00:44:03.872 --> 00:44:04.472 And again, 00:44:04.472 --> 00:44:08.789 we want to end the results function with a new call 00:44:08.972 --> 00:44:13.039 not to classify, but to predict. 00:44:13.106 --> 00:44:16.106 And finally, we want to change our draw function. 00:44:16.239 --> 00:44:20.889 So let's remove this slider related text 00:44:20.972 --> 00:44:25.006 and we want our background 00:44:25.089 --> 00:44:27.989 to generate 00:44:27.989 --> 00:44:31.272 a color based on the model's predictions. 00:44:31.355 --> 00:44:35.439 So let's use our predicted values 00:44:35.522 --> 00:44:45.855 as the input to our background function 00:44:45.939 --> 00:44:53.655 and let's see what happens. 00:44:53.739 --> 00:44:54.989 We've already 00:44:54.989 --> 00:44:58.989 spotted a place where we forgot to change 00:44:58.989 --> 00:45:02.322 from classify function to predict function. 00:45:02.489 --> 00:45:07.005 So let's change that right off the bat 00:45:07.089 --> 00:45:09.539 and run it again. 00:45:09.539 --> 00:45:11.522 We can also remove 00:45:11.522 --> 00:45:16.189 or debug, set that to false 00:45:16.272 --> 00:45:19.539 so that we can get a better view of what's actually going on. 00:45:19.622 --> 00:45:23.522 So here we can see that the model is still predicting, 00:45:23.522 --> 00:45:26.672 still learning since the color is changing. 00:45:26.672 --> 00:45:30.005 And if we change the tag, we'll see it changed 00:45:30.005 --> 00:45:33.789 to a bluish color, but it's still sort of figuring it out and generating 00:45:33.789 --> 00:45:37.189 slightly different variations of blue 00:45:37.272 --> 00:45:39.639 when the model is done training, 00:45:39.639 --> 00:45:45.322 we will see it stabilize and not change around as much. 00:45:45.389 --> 00:45:47.255 So now we have 00:45:47.255 --> 00:45:52.155 a trained model and it is generating 00:45:52.238 --> 00:45:54.988 colors that suit our labels. 00:45:54.988 --> 00:45:56.772 Hopefully 00:45:56.772 --> 00:45:58.422 it's done a pretty good job. 00:45:58.422 --> 00:45:59.705 We can check all of the colors. 00:45:59.705 --> 00:46:02.338 Gray Brown seemed to make sense. 00:46:02.338 --> 00:46:04.438 Orange 00:46:04.438 --> 00:46:06.338 makes sense. 00:46:06.338 --> 00:46:09.222 I agree that that's pink, 00:46:09.222 --> 00:46:11.438 yellow and orange 00:46:11.438 --> 00:46:16.122 slightly similar, but I guess they they can be 00:46:16.205 --> 00:46:17.638 red is very red. 00:46:17.638 --> 00:46:22.672 Blue is very blue, green and purple as well. 00:46:22.738 --> 00:46:26.188 So we've now gone through both a classification task 00:46:26.188 --> 00:46:29.488 and a regression task with a neural network 00:46:29.488 --> 00:46:32.505 that we've been training on the fly in our browser.