title
Teachable Machine 1: Image Classification
description
Introducing Teachable Machine 2.0 (from Google Creative Lab)! Train a computer to recognize your own images, sounds, & poses. In this video, I train an image classifier and import the machine learning model into a p5.js sketch with the ml5.js library. Code: https://thecodingtrain.com/tracks/teachable-machine/teachable-machine/1-image-classification
đ Watch this video ad-free on Nebula https://nebula.tv/videos/the-coding-train-yt-teachable-machine-1-image-classification
p5.js Web Editor Sketches:
đšī¸ Code Template: https://editor.p5js.org/codingtrain/sketches/aRN4PS2Nm
đšī¸ Final Code: https://editor.p5js.org/codingtrain/sketches/PoZXqbu4v
đĨ Next: https://youtu.be/UPgxnGC8oBU?list=PLRqwX-V7Uu6aJwX0rFP-7ccA6ivsPDsK5
đĨ All: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6aJwX0rFP-7ccA6ivsPDsK5
References:
đ Teachable Machine: https://teachablemachine.withgoogle.com/
đž Tensor Flow: https://www.tensorflow.org/js
đģ ml5.js: https://ml5js.org/
đģ Image-Net: https://image-net.org/
đ MobileNets: Efficient Convolutional Neural Networks for Mobile Vision Applications: https://arxiv.org/abs/1704.04861
Videos:
đ ml5.js: Transfer Learning with Feature Extractor: https://youtu.be/kRpZ5OqUY6Y
đ ml5.js: Feature Extractor Classification: https://youtu.be/eeO-rWYFuG0
Timestamps:
0:00 Introduction
0:32 Teachable Machine 2.0
1:06 Training an Image Classification model
3:11 Train model
3:21 High-level overview
5:10 Save your data
6:58 Train the model
7:30 Save the model
8:57 Coding
10:31 Step 1 Load the model
11:19 Step 2 Classify
12:44 Step 3 Get the classification
14:48 Step 4 Draw the label
18:34 The sound classifier
19:19 Train a model that can be a game controller
Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound
đ Website: https://thecodingtrain.com/
đž Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
đŠ Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
đĄ GitHub: https://github.com/CodingTrain
đŦ Discord: https://thecodingtrain.com/discord
đ Membership: http://youtube.com/thecodingtrain/join
đ Store: https://standard.tv/codingtrain
đī¸ Twitter: https://twitter.com/thecodingtrain
đ¸ Instagram: https://www.instagram.com/the.coding.train/
đĨ Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
đĨ Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA
đ p5.js: https://p5js.org
đ p5.js Web Editor: https://editor.p5js.org/
đ Processing: https://processing.org
đ Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct
This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new
#machinelearningml #ml5js #imageclassification #javascript #p5js #ml5js
detail
{'title': 'Teachable Machine 1: Image Classification', 'heatmap': [{'end': 1107.49, 'start': 1092.168, 'weight': 1}], 'summary': 'Teachable machine 2.0 enables training ml models in the browser for images, sounds, and poses with ml5.js library. it covers image project data collection steps and optimal image quantity for quicker training, transfer learning, model training with 400 images, local training, model export, ukulele recording, tensorflow.js usage, model export, and creating emoji variables for different categories and sound recognition.', 'chapters': [{'end': 188.559, 'segs': [{'end': 53.522, 'src': 'embed', 'start': 21.148, 'weight': 0, 'content': [{'end': 21.989, 'text': 'And in fact, I have.', 'start': 21.148, 'duration': 0.841}, {'end': 28.291, 'text': "And in fact, I've talked a lot about the kind of thing that Teachable Machine does called transfer learning.", 'start': 22.029, 'duration': 6.262}, {'end': 34.674, 'text': "But this video, I'm going to show you something that just launched today, which is Teachable Machine 2.0.", 'start': 28.611, 'duration': 6.063}, {'end': 38.435, 'text': 'And Teachable Machine 2.0 allows you to train a machine learning model in the browser.', 'start': 34.674, 'duration': 3.761}, {'end': 40.036, 'text': 'You can train it on images.', 'start': 38.695, 'duration': 1.341}, {'end': 41.637, 'text': 'You can train it on sounds.', 'start': 40.276, 'duration': 1.361}, {'end': 45.578, 'text': 'You can train it on poses and more to come in the future.', 'start': 41.817, 'duration': 3.761}, {'end': 49.9, 'text': 'And then you can save the model you trained and use it in your own project.', 'start': 45.938, 'duration': 3.962}, {'end': 53.522, 'text': "So I'm going to make a few examples, images and sounds.", 'start': 50.18, 'duration': 3.342}], 'summary': 'Teachable machine 2.0 launched, trains ml model in browser on images, sounds, poses, and more.', 'duration': 32.374, 'max_score': 21.148, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg021148.jpg'}, {'end': 74.804, 'src': 'embed', 'start': 54.322, 'weight': 1, 'content': [{'end': 65.889, 'text': 'demonstrate that and then bring the trained model into my p5.js sketch with the ml5.js library and have some fun making a goofy project and giving you some starter code for you to make your own project.', 'start': 54.322, 'duration': 11.567}, {'end': 69.451, 'text': "Let's get started by training an image classification model.", 'start': 66.349, 'duration': 3.102}, {'end': 72.673, 'text': 'And what do I need to train an image classification model? Props.', 'start': 69.711, 'duration': 2.962}, {'end': 74.804, 'text': "I've brought a lot of props with me.", 'start': 73.663, 'duration': 1.141}], 'summary': 'Train an image classification model with props for a p5.js project.', 'duration': 20.482, 'max_score': 54.322, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg054322.jpg'}, {'end': 126.293, 'src': 'embed', 'start': 93.855, 'weight': 3, 'content': [{'end': 95.056, 'text': "And I'm going to go through all of them.", 'start': 93.855, 'duration': 1.201}, {'end': 98.598, 'text': 'But the first step here is the data collection step.', 'start': 95.096, 'duration': 3.502}, {'end': 105.301, 'text': 'So what do I want? I want to collect a whole bunch of images of something and provide a label for those images.', 'start': 99.258, 'duration': 6.043}, {'end': 109.483, 'text': "Teachable Machine is going to assume you're at least going to have two kinds of images.", 'start': 105.561, 'duration': 3.922}, {'end': 114.365, 'text': "Otherwise, why are you classifying images if you don't at least have two different kinds to distinguish between??", 'start': 109.543, 'duration': 4.822}, {'end': 119.508, 'text': "And it's going to create automatic labels like Class 1 or Classification 1..", 'start': 114.765, 'duration': 4.743}, {'end': 121.128, 'text': "But it's much more fun to pick our own names.", 'start': 119.508, 'duration': 1.62}, {'end': 123.549, 'text': "So I'm going to click here and switch this to unicorn.", 'start': 121.388, 'duration': 2.161}, {'end': 126.293, 'text': 'And we give it some images of this unicorn.', 'start': 124.77, 'duration': 1.523}], 'summary': 'Data collection involves gathering images and providing labels for two different kinds of images, such as unicorns, for classification.', 'duration': 32.438, 'max_score': 93.855, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg093855.jpg'}, {'end': 178.73, 'src': 'embed', 'start': 150.496, 'weight': 5, 'content': [{'end': 152.678, 'text': 'It makes the training time take quite a bit longer.', 'start': 150.496, 'duration': 2.182}, {'end': 156.001, 'text': "And with this transfer learning process that I've described, you can get,", 'start': 152.998, 'duration': 3.003}, {'end': 159.902, 'text': 'I could probably get the same exact performance and accuracy with many fewer images.', 'start': 156.221, 'duration': 3.681}, {'end': 162.343, 'text': "So if you're following along, collect fewer images.", 'start': 159.943, 'duration': 2.4}, {'end': 163.524, 'text': 'The training will happen faster.', 'start': 162.544, 'duration': 0.98}, {'end': 164.184, 'text': 'It will be easier.', 'start': 163.544, 'duration': 0.64}, {'end': 168.346, 'text': "Then you could try it again with more images, with less images, just to experiment and see what works, what doesn't.", 'start': 164.404, 'duration': 3.942}, {'end': 172.627, 'text': 'But probably for getting started, I might start with, say, 25 to 50 images per category.', 'start': 168.646, 'duration': 3.981}, {'end': 175.008, 'text': 'Next, of course, is a train whistle.', 'start': 173.148, 'duration': 1.86}, {'end': 177.389, 'text': "We'll call class 2 train.", 'start': 175.489, 'duration': 1.9}, {'end': 178.73, 'text': 'Add samples.', 'start': 178.21, 'duration': 0.52}], 'summary': 'Transfer learning can achieve same accuracy with fewer images, starting with 25 to 50 images per category.', 'duration': 28.234, 'max_score': 150.496, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0150496.jpg'}], 'start': 0.73, 'title': 'Teachable machine 2.0 and image project', 'summary': 'Introduces teachable machine 2.0 for training ml models in the browser for images, sounds, and poses with the ml5.js library. it also covers the teachable machine image project, including data collection steps and optimal quantity of images per category for quicker training.', 'chapters': [{'end': 74.804, 'start': 0.73, 'title': 'Teachable machine 2.0: training ml models', 'summary': 'Introduces teachable machine 2.0, which enables training machine learning models in the browser for images, sounds, and poses, and demonstrates bringing the trained model into a p5.js sketch with the ml5.js library.', 'duration': 74.074, 'highlights': ['Teachable Machine 2.0 allows training machine learning models in the browser for images, sounds, and poses, and brings the trained model into a p5.js sketch with the ml5.js library. Teachable Machine 2.0 introduces the ability to train machine learning models in the browser for various data types, enabling easy integration with p5.js sketches via the ml5.js library.', 'Demonstrates training an image classification model and bringing the trained model into a p5.js sketch with the ml5.js library. The chapter demonstrates the process of training an image classification model and integrating the trained model into a p5.js sketch using the ml5.js library.', 'Introduction of Teachable Machine 2.0, which allows training machine learning models in the browser. Teachable Machine 2.0 is introduced as a tool for training machine learning models directly in the browser environment, providing accessibility and convenience for developers and enthusiasts.']}, {'end': 188.559, 'start': 74.824, 'title': 'Teachable machine image project', 'summary': 'Introduces the teachable machine image project, covering data collection steps, optimal quantity of images per category for quicker training, and the process of providing labels and samples for image classification.', 'duration': 113.735, 'highlights': ['The data collection step involves providing a label and collecting images, with the recommendation of starting with 25 to 50 images per category for quicker training.', "Demonstrates the process of providing labels and samples for image classification, such as switching labels to 'unicorn' and providing 413 example images of a unicorn.", 'Emphasizes the unnecessary nature of collecting excessive images, noting that the training time increases significantly without substantial improvement in performance and accuracy.']}], 'duration': 187.829, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0730.jpg', 'highlights': ['Teachable Machine 2.0 introduces the ability to train machine learning models in the browser for various data types, enabling easy integration with p5.js sketches via the ml5.js library.', 'Demonstrates the process of training an image classification model and integrating the trained model into a p5.js sketch using the ml5.js library.', 'Introduction of Teachable Machine 2.0, which allows training machine learning models in the browser.', 'The data collection step involves providing a label and collecting images, with the recommendation of starting with 25 to 50 images per category for quicker training.', "Demonstrates the process of providing labels and samples for image classification, such as switching labels to 'unicorn' and providing 413 example images of a unicorn.", 'Emphasizes the unnecessary nature of collecting excessive images, noting that the training time increases significantly without substantial improvement in performance and accuracy.']}, {'end': 371.91, 'segs': [{'end': 233.881, 'src': 'embed', 'start': 207.611, 'weight': 0, 'content': [{'end': 212.213, 'text': "I've actually made several videos all about transfer learning with ML5.js.", 'start': 207.611, 'duration': 4.602}, {'end': 217.295, 'text': 'And if you want, you can go back and look at those for a bit more of a deeper dive in how transfer learning works.', 'start': 212.473, 'duration': 4.822}, {'end': 221.297, 'text': 'But the short explanation is there is a pre-trained model.', 'start': 217.675, 'duration': 3.622}, {'end': 225.178, 'text': 'Somebody else already trained a model on many, many images.', 'start': 221.617, 'duration': 3.561}, {'end': 226.999, 'text': 'And this model is called MobileNet.', 'start': 225.318, 'duration': 1.681}, {'end': 228.98, 'text': "And there's a paper written about it that you could read.", 'start': 227.279, 'duration': 1.701}, {'end': 231.921, 'text': 'And the training data for this model is called ImageNet.', 'start': 229.56, 'duration': 2.361}, {'end': 233.881, 'text': "And there's a paper about that that you could read.", 'start': 232.161, 'duration': 1.72}], 'summary': 'Videos on transfer learning with ml5.js available; model called mobilenet trained on imagenet data.', 'duration': 26.27, 'max_score': 207.611, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0207611.jpg'}, {'end': 328.133, 'src': 'embed', 'start': 264.476, 'weight': 1, 'content': [{'end': 271.641, 'text': 'And this allows us to get something that works with just 400 images of unicorns and 400 images of train whistles.', 'start': 264.476, 'duration': 7.165}, {'end': 279.387, 'text': 'Because if you were training an image classification model from scratch without this base model, you probably would need a much larger data set.', 'start': 271.861, 'duration': 7.526}, {'end': 286.029, 'text': "So now that I've given you that brief explanation of how it works, we can actually press Train Model and watch it go.", 'start': 279.947, 'duration': 6.082}, {'end': 290.291, 'text': "So one thing to note is it's telling me, don't switch tabs.", 'start': 286.609, 'duration': 3.682}, {'end': 292.431, 'text': "Don't switch tabs.", 'start': 290.811, 'duration': 1.62}, {'end': 298.353, 'text': "The reason why I tell you not to switch tabs, and this is very important, is it's training the model in here in the browser.", 'start': 292.711, 'duration': 5.642}, {'end': 300.434, 'text': 'None of your images went anywhere.', 'start': 298.793, 'duration': 1.641}, {'end': 303.196, 'text': 'They have not been uploaded to any server.', 'start': 300.894, 'duration': 2.302}, {'end': 306.358, 'text': 'Everything is happening right here locally in the browser.', 'start': 303.476, 'duration': 2.882}, {'end': 308.399, 'text': 'The model is training in the browser.', 'start': 306.578, 'duration': 1.821}, {'end': 312.002, 'text': 'Now, Teaching Machine gives you options to save your data.', 'start': 308.66, 'duration': 3.342}, {'end': 315.364, 'text': "You can upload it to, I think there's an integration with Google Drive.", 'start': 312.062, 'duration': 3.302}, {'end': 319.427, 'text': 'And once the model is trained, I am going to upload that model to a server.', 'start': 315.644, 'duration': 3.783}, {'end': 328.133, 'text': 'But this is one of the wonderful things about working with JavaScript and machine learning is you can do it all right here from your local computer.', 'start': 319.827, 'duration': 8.306}], 'summary': 'Teaching machine can train a model with 400 unicorn and 400 train whistle images in the browser, without uploading data.', 'duration': 63.657, 'max_score': 264.476, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0264476.jpg'}], 'start': 188.619, 'title': 'Teachable machine: model training', 'summary': 'Covers the process of transfer learning and training in teachable machine, using a pre-trained model to create an image classification model with just 400 images, and emphasizes local training, data saving, and model export without uploading images to any server.', 'chapters': [{'end': 286.029, 'start': 188.619, 'title': 'Teachable machine: transfer learning and training model', 'summary': 'Explains the process of transfer learning using a pre-trained model called mobilenet and training it with a smaller dataset to create an image classification model in teachable machine, reducing the required data set from thousands to just 400 images.', 'duration': 97.41, 'highlights': ['Teachable Machine utilizes transfer learning with a pre-trained model called MobileNet, which has been trained on a large dataset called ImageNet, allowing for retraining with a smaller dataset of 400 images for custom image classification.', 'MobileNet is capable of recognizing about 1,000 different categories but may not have knowledge of specific items like unicorns, train whistles, or rainbows, which can be added through retraining with custom images.', 'Retraining MobileNet with a smaller dataset of 400 images for each category is emphasized as a more efficient approach compared to training an image classification model from scratch, which would require a larger dataset.', "The technique of transfer learning involves taking a pre-trained model's knowledge of images, represented by various numbers, and retraining it with custom images to create a new image classification model.", "A brief high-level overview of the training process is provided, highlighting the utilization of transfer learning with MobileNet to retrain the model with a smaller dataset and the subsequent action of pressing 'Train Model' to initiate the process."]}, {'end': 371.91, 'start': 286.609, 'title': 'Teachable machine: training and model export', 'summary': 'Explains the process of training a model in teachable machine, emphasizing the local training in the browser, the option to save data, and the ability to export the trained model, all without uploading images to any server.', 'duration': 85.301, 'highlights': ['The model is training in the browser, and none of the images have been uploaded to any server, ensuring local processing and privacy.', 'Teachable Machine offers options to save data, including integration with Google Drive, and allows for uploading the trained model to a server.', 'The process enables users to perform JavaScript-based machine learning tasks entirely from their local computers, demonstrating the convenience and accessibility of the platform.', 'The ability to export the trained model to be integrated into other projects is showcased, highlighting the flexibility and reusability of the generated models.', 'The demonstration of adding more classes and training images, such as a rainbow drawing, exemplifies the expandability and customization potential of Teachable Machine.']}], 'duration': 183.291, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0188619.jpg', 'highlights': ['Teachable Machine utilizes transfer learning with a pre-trained model called MobileNet, allowing retraining with a smaller dataset of 400 images for custom image classification.', 'Retraining MobileNet with a smaller dataset of 400 images for each category is emphasized as a more efficient approach compared to training an image classification model from scratch.', 'The model is training in the browser, and none of the images have been uploaded to any server, ensuring local processing and privacy.', 'The ability to export the trained model to be integrated into other projects is showcased, highlighting the flexibility and reusability of the generated models.']}, {'end': 972.119, 'segs': [{'end': 496.949, 'src': 'embed', 'start': 396.986, 'weight': 0, 'content': [{'end': 398.588, 'text': "So I think that'll be enough to demonstrate it.", 'start': 396.986, 'duration': 1.602}, {'end': 400.129, 'text': "So I'm going to hit Save Settings.", 'start': 398.828, 'duration': 1.301}, {'end': 403.171, 'text': "I'm going to get my camera focused here on the ukulele.", 'start': 400.449, 'duration': 2.722}, {'end': 406.353, 'text': 'And then I am going to do record six seconds.', 'start': 403.591, 'duration': 2.762}, {'end': 416.77, 'text': 'I have all of my data for one, two, three, four classes, categories, classifications, labels.', 'start': 410.407, 'duration': 6.363}, {'end': 418.011, 'text': 'You can use any of those words.', 'start': 416.79, 'duration': 1.221}, {'end': 420.012, 'text': "And I'm going to train the model.", 'start': 418.511, 'duration': 1.501}, {'end': 421.033, 'text': 'So here we go.', 'start': 420.152, 'duration': 0.881}, {'end': 424.715, 'text': "Don't switch the tabs.", 'start': 421.053, 'duration': 3.662}, {'end': 428.557, 'text': "Don't switch the tabs.", 'start': 424.875, 'duration': 3.682}, {'end': 430.938, 'text': "Don't We're trained, and we're ready to test.", 'start': 428.717, 'duration': 2.221}, {'end': 432.139, 'text': 'Here I am, a train.', 'start': 431.218, 'duration': 0.921}, {'end': 437.822, 'text': 'And here I am, a unicorn, a rainbow.', 'start': 433.78, 'duration': 4.042}, {'end': 449.338, 'text': "Ukulele! Now that I've trained the model on these four categories, I'm ready to move into my own code, into my P5 ML5 project.", 'start': 440.515, 'duration': 8.823}, {'end': 452.459, 'text': 'But before I do that, I need to make sure I save the model.', 'start': 449.638, 'duration': 2.821}, {'end': 455.66, 'text': 'And to save the model, the model is running right here in the browser.', 'start': 452.739, 'duration': 2.921}, {'end': 459.121, 'text': 'But I want to save the model by clicking this Export Model button.', 'start': 455.96, 'duration': 3.161}, {'end': 461.903, 'text': "Once I press that button, I'm going to see this pop up.", 'start': 459.901, 'duration': 2.002}, {'end': 463.143, 'text': 'And I have a lot of different options.', 'start': 461.923, 'duration': 1.22}, {'end': 468.227, 'text': 'For example, I could export the model to work with TensorFlow or with TensorFlow Lite.', 'start': 463.464, 'duration': 4.763}, {'end': 471.229, 'text': 'And you could click on the little i to find out more about those things.', 'start': 468.307, 'duration': 2.922}, {'end': 474.191, 'text': "I couldn't possibly cover all the options right here in this video.", 'start': 471.489, 'duration': 2.702}, {'end': 478.074, 'text': 'But for me, I want to use it with TensorFlow.js.', 'start': 474.432, 'duration': 3.642}, {'end': 481.096, 'text': 'I am going to use it with a library called ml5.js.', 'start': 478.534, 'duration': 2.562}, {'end': 484.219, 'text': 'But ml5.js is built on top of TensorFlow.js.', 'start': 481.316, 'duration': 2.903}, {'end': 488.722, 'text': 'And so the compatible model for ml5 and TensorFlow.js is the same model.', 'start': 484.479, 'duration': 4.243}, {'end': 491.404, 'text': 'So I could locally download it.', 'start': 489.182, 'duration': 2.222}, {'end': 495.408, 'text': "Again, this is important if you don't want anything related to your data.", 'start': 491.484, 'duration': 3.924}, {'end': 496.949, 'text': 'This is not uploading your data.', 'start': 495.448, 'duration': 1.501}], 'summary': 'Trained model on four categories and saved it using ml5.js and tensorflow.js.', 'duration': 99.963, 'max_score': 396.986, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0396986.jpg'}, {'end': 545.203, 'src': 'embed', 'start': 517.267, 'weight': 6, 'content': [{'end': 519.629, 'text': 'But whatever is here is the URL that you want.', 'start': 517.267, 'duration': 2.362}, {'end': 526.915, 'text': "After you're done, if you have uploaded your model, you then get a permanent web page where you can play around and test your model still,", 'start': 519.889, 'duration': 7.026}, {'end': 528.577, 'text': 'even after the training process is done.', 'start': 526.915, 'duration': 1.662}, {'end': 533.879, 'text': "So this is a really good tool for debugging your model, because I'm going to start coding with it, and it starts acting weird.", 'start': 528.697, 'duration': 5.182}, {'end': 536.68, 'text': 'I could come back to this and sort of test it out right here in the browser.', 'start': 533.899, 'duration': 2.781}, {'end': 538.681, 'text': 'I am finally ready to start coding.', 'start': 537.18, 'duration': 1.501}, {'end': 540.742, 'text': "So there's a couple of different ways I could get started.", 'start': 538.821, 'duration': 1.921}, {'end': 545.203, 'text': 'You might remember, actually, when I first uploaded the model, there were some code snippets there.', 'start': 541.242, 'duration': 3.961}], 'summary': 'The url provides a permanent web page to test the model after training, aiding in debugging.', 'duration': 27.936, 'max_score': 517.267, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0517267.jpg'}, {'end': 737.692, 'src': 'embed', 'start': 711.319, 'weight': 2, 'content': [{'end': 718.022, 'text': 'And then the first argument to the function, what I need to hand to it is the image that I want to classify, which is the video.', 'start': 711.319, 'duration': 6.703}, {'end': 720.623, 'text': 'And then now is sort of the important part.', 'start': 718.422, 'duration': 2.201}, {'end': 725.805, 'text': "JavaScript, if you've worked with JavaScript before, handles things asynchronously.", 'start': 721.343, 'duration': 4.462}, {'end': 732.669, 'text': "And by that, I mean it takes some time for it to classify the image in the video, and it's going to report an event back to me when it's finished.", 'start': 725.825, 'duration': 6.844}, {'end': 737.692, 'text': "And you need to handle that by giving it the name of a function that's going to get called as a callback.", 'start': 732.949, 'duration': 4.743}], 'summary': 'Using javascript to handle asynchronous image classification in videos', 'duration': 26.373, 'max_score': 711.319, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0711319.jpg'}], 'start': 377.193, 'title': 'Ukulele recording and tensorflow.js', 'summary': 'Demonstrates using settings to record ukulele with a two-second delay and six-second recording while training a model on four categories. it also discusses exporting a model to work with tensorflow or tensorflow lite and coding with tensorflow.js, including steps for loading the model, classifying video, handling asynchronous functions, and displaying classification results.', 'chapters': [{'end': 455.66, 'start': 377.193, 'title': 'Using settings to record ukulele', 'summary': 'Demonstrates using the settings icon to adjust recording settings, enabling a two-second delay and recording for six seconds while training a model on four categories.', 'duration': 78.467, 'highlights': ['Using Settings icon to turn off hold to record and enable a two-second delay, allowing recording for six seconds while training a model on four categories.', 'Emphasizing the need to not switch tabs while recording and training the model.', 'Importance of saving the model running in the browser before moving into P5 ML5 project.']}, {'end': 972.119, 'start': 455.96, 'title': 'Exporting and coding with tensorflow.js and ml5.js', 'summary': 'Discusses exporting a model to work with tensorflow or tensorflow lite, choosing to use it with tensorflow.js, uploading and testing the model, and coding steps including loading the model, classifying video, handling asynchronous functions, and displaying the classification results.', 'duration': 516.159, 'highlights': ['Exporting a model to work with TensorFlow or TensorFlow Lite The chapter discusses the option to export the model to work with TensorFlow or TensorFlow Lite, providing users with a variety of options.', 'Choosing to use the model with TensorFlow.js and ml5.js The user decides to use the model with TensorFlow.js and ml5.js, highlighting the compatibility of the model for both frameworks.', 'Uploading and testing the model The chapter details the process of uploading the model, emphasizing the ability to obtain a permanent web page to test the model even after the training process.', 'Steps for coding including loading the model, classifying video, handling asynchronous functions, and displaying classification results The chapter provides steps for coding, such as loading the model, classifying video, handling asynchronous functions, and displaying classification results, catering to both experienced JavaScript developers and beginners.']}], 'duration': 594.926, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0377193.jpg', 'highlights': ['Using Settings icon to enable a two-second delay and six-second recording while training a model on four categories', 'Exporting a model to work with TensorFlow or TensorFlow Lite, providing users with a variety of options', 'Steps for coding including loading the model, classifying video, handling asynchronous functions, and displaying classification results, catering to both experienced JavaScript developers and beginners', 'Importance of saving the model running in the browser before moving into P5 ML5 project', 'Choosing to use the model with TensorFlow.js and ml5.js, highlighting the compatibility of the model for both frameworks', 'Emphasizing the need to not switch tabs while recording and training the model', 'Uploading the model and obtaining a permanent web page to test the model even after the training process']}, {'end': 1190.974, 'segs': [{'end': 1018.334, 'src': 'embed', 'start': 994.849, 'weight': 0, 'content': [{'end': 1001.931, 'text': 'And let me change it so that whichever one of these objects I show, I see the emoji for it.', 'start': 994.849, 'duration': 7.082}, {'end': 1005.212, 'text': "And in fact, I won't even bother to show the video anymore.", 'start': 1002.011, 'duration': 3.201}, {'end': 1008.489, 'text': "In draw, let's first create a variable called emoji.", 'start': 1005.808, 'duration': 2.681}, {'end': 1012.672, 'text': "And let's just give it something, like I'll put in an emoji of the train.", 'start': 1008.87, 'duration': 3.802}, {'end': 1018.334, 'text': "And then let's actually draw that, same way using the text function.", 'start': 1014.272, 'duration': 4.062}], 'summary': "Using coding, create a variable 'emoji' and display it as an emoji of a train.", 'duration': 23.485, 'max_score': 994.849, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0994849.jpg'}, {'end': 1123.663, 'src': 'heatmap', 'start': 1092.168, 'weight': 1, 'content': [{'end': 1096.615, 'text': 'So many other creative possibilities for how you could use this in an interactive context.', 'start': 1092.168, 'duration': 4.447}, {'end': 1098.998, 'text': 'If you make something with it, please share it with me.', 'start': 1096.895, 'duration': 2.103}, {'end': 1102.803, 'text': 'You can write it in the comments, or you can go to the page on thecodingtrain.com,', 'start': 1099.038, 'duration': 3.765}, {'end': 1107.49, 'text': 'where you can submit your own project that you made with Teachable Machine p5.js and ml5.js.', 'start': 1102.803, 'duration': 4.687}, {'end': 1111.814, 'text': "I'm going to come back and do at least one more video and probably a bunch more.", 'start': 1108.311, 'duration': 3.503}, {'end': 1113.575, 'text': 'The two things that I really would like to show you.', 'start': 1111.874, 'duration': 1.701}, {'end': 1116.077, 'text': 'Number one, I want to show you the sound classifier.', 'start': 1113.875, 'duration': 2.202}, {'end': 1123.663, 'text': 'So how do you do exactly this but have it recognize the train whistle and the ukulele as different things? I will work on that in a separate video.', 'start': 1116.337, 'duration': 7.326}], 'summary': 'Teachable machine allows interactive projects, sound classifier coming soon.', 'duration': 31.495, 'max_score': 1092.168, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg01092168.jpg'}, {'end': 1145.187, 'src': 'embed', 'start': 1116.337, 'weight': 4, 'content': [{'end': 1123.663, 'text': 'So how do you do exactly this but have it recognize the train whistle and the ukulele as different things? I will work on that in a separate video.', 'start': 1116.337, 'duration': 7.326}, {'end': 1126.085, 'text': 'I also want to show you an important detail here.', 'start': 1123.943, 'duration': 2.142}, {'end': 1131.591, 'text': "And if I put the video back for a second, It's hard for you to see this because you're not standing in front of the computer.", 'start': 1126.245, 'duration': 5.346}, {'end': 1137.217, 'text': "It looks to me like you're seeing me with the same orientation that I'm standing here right here.", 'start': 1131.891, 'duration': 5.326}, {'end': 1137.918, 'text': "There's my hand.", 'start': 1137.297, 'duration': 0.621}, {'end': 1138.739, 'text': "Here's my hand.", 'start': 1138.118, 'duration': 0.621}, {'end': 1145.187, 'text': 'However, when I look at it, the image is not mirrored, meaning I look backwards when I see myself on the computer.', 'start': 1139.24, 'duration': 5.947}], 'summary': 'Addressing audio recognition and video mirroring in separate videos.', 'duration': 28.85, 'max_score': 1116.337, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg01116337.jpg'}, {'end': 1183.991, 'src': 'embed', 'start': 1151.452, 'weight': 3, 'content': [{'end': 1154.935, 'text': "And in fact, there's an ML5 function that will allow you to flip the image.", 'start': 1151.452, 'duration': 3.483}, {'end': 1162.5, 'text': "So I'm going to add that in a second video, which what I wanted to show you how to do is train a model that can be a game controller.", 'start': 1155.175, 'duration': 7.325}, {'end': 1163.78, 'text': 'So, for example,', 'start': 1162.72, 'duration': 1.06}, {'end': 1170.685, 'text': 'what if I train a model where I hold up my right hand and something moves to the right and I train a model and hold up my left hand and then have something move to the left?', 'start': 1163.78, 'duration': 6.905}, {'end': 1171.705, 'text': "So I'm going to do that.", 'start': 1170.785, 'duration': 0.92}, {'end': 1174.367, 'text': "I'm going to show you the sound classifier in two separate videos.", 'start': 1171.725, 'duration': 2.642}, {'end': 1175.447, 'text': 'Make stuff.', 'start': 1174.987, 'duration': 0.46}, {'end': 1177.288, 'text': 'Let me know what you think in the comments.', 'start': 1176.027, 'duration': 1.261}, {'end': 1183.991, 'text': 'And I look forward to all the wonderful creative rainbow unicorn train ukulele themed things that you make.', 'start': 1177.748, 'duration': 6.243}], 'summary': 'Demonstrating training a model for game control using ml5 function.', 'duration': 32.539, 'max_score': 1151.452, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg01151452.jpg'}], 'start': 973.283, 'title': 'Using teachable machine and emoji variables', 'summary': 'Covers creating emoji variables based on objects in a sketch, adjusting text size, and exploring creative possibilities of teachable machine, including training models for different categories and recognizing specific sounds.', 'chapters': [{'end': 1059.27, 'start': 973.283, 'title': 'Emoji variable and drawing', 'summary': 'Illustrates the creation of a variable to display different emojis based on the object shown in the sketch, such as a train or a rainbow, and the use of conditional statements to change the displayed emoji. it also demonstrates the adjustment of text size for the displayed emoji.', 'duration': 85.987, 'highlights': ['The nothing is the closest to the smallest thing with the least sort of distinguishable features, the train whistle.', "Creation of a variable 'emoji' to display different emojis based on the object shown in the sketch.", 'Demonstration of the adjustment of text size for the displayed emoji.', 'Use of conditional statements to change the displayed emoji based on the object shown in the sketch.']}, {'end': 1190.974, 'start': 1065.35, 'title': 'Teachable machine creative possibilities', 'summary': 'Delves into the creative possibilities of using teachable machine, including training models for different categories and recognizing specific sounds, with plans for future videos on sound classification and game controller training.', 'duration': 125.624, 'highlights': ['Teachable Machine creative possibilities Exploring creative possibilities such as training models for different categories and recognizing specific sounds.', 'Future plans for sound classification Intending to demonstrate sound classification in separate videos, including distinguishing between the train whistle and the ukulele.', 'Image mirroring and ML5 function Noting the image mirroring when using Teachable Machine and planning to showcase an ML5 function to flip the image in a separate video.', 'Training a model as a game controller Planning to demonstrate training a model to act as a game controller, using hand gestures to control movements.']}], 'duration': 217.691, 'thumbnail': 'https://coursnap.oss-ap-southeast-1.aliyuncs.com/video-capture/kwcillcWOg0/pics/kwcillcWOg0973283.jpg', 'highlights': ["Creation of a variable 'emoji' to display different emojis based on the object shown in the sketch.", 'Use of conditional statements to change the displayed emoji based on the object shown in the sketch.', 'Demonstration of the adjustment of text size for the displayed emoji.', 'Exploring creative possibilities such as training models for different categories and recognizing specific sounds.', 'Future plans for sound classification including distinguishing between the train whistle and the ukulele.', 'Planning to demonstrate training a model to act as a game controller, using hand gestures to control movements.', 'Noting the image mirroring when using Teachable Machine and planning to showcase an ML5 function to flip the image in a separate video.']}], 'highlights': ['Teachable Machine 2.0 introduces the ability to train machine learning models in the browser for various data types, enabling easy integration with p5.js sketches via the ml5.js library.', 'Demonstrates the process of training an image classification model and integrating the trained model into a p5.js sketch using the ml5.js library.', 'Introduction of Teachable Machine 2.0, which allows training machine learning models in the browser.', 'The data collection step involves providing a label and collecting images, with the recommendation of starting with 25 to 50 images per category for quicker training.', 'Teachable Machine utilizes transfer learning with a pre-trained model called MobileNet, allowing retraining with a smaller dataset of 400 images for custom image classification.', 'Retraining MobileNet with a smaller dataset of 400 images for each category is emphasized as a more efficient approach compared to training an image classification model from scratch.', 'The model is training in the browser, and none of the images have been uploaded to any server, ensuring local processing and privacy.', 'The ability to export the trained model to be integrated into other projects is showcased, highlighting the flexibility and reusability of the generated models.', 'Using Settings icon to enable a two-second delay and six-second recording while training a model on four categories', 'Exporting a model to work with TensorFlow or TensorFlow Lite, providing users with a variety of options', 'Steps for coding including loading the model, classifying video, handling asynchronous functions, and displaying classification results, catering to both experienced JavaScript developers and beginners', 'Importance of saving the model running in the browser before moving into P5 ML5 project', 'Choosing to use the model with TensorFlow.js and ml5.js, highlighting the compatibility of the model for both frameworks', "Creation of a variable 'emoji' to display different emojis based on the object shown in the sketch.", 'Use of conditional statements to change the displayed emoji based on the object shown in the sketch.', 'Demonstration of the adjustment of text size for the displayed emoji.', 'Exploring creative possibilities such as training models for different categories and recognizing specific sounds.', 'Future plans for sound classification including distinguishing between the train whistle and the ukulele.', 'Planning to demonstrate training a model to act as a game controller, using hand gestures to control movements.', 'Noting the image mirroring when using Teachable Machine and planning to showcase an ML5 function to flip the image in a separate video.']}