CCFest Material

Teachable Machine

https://teachablemachine.withgoogle.com/

Get Started

Image Project

Standard image model

Enable webcam in Class 1.

Pose or hold an object and "Hold to Record"

While holding, move around the screen to get variation. Around 50 to 100 images should be ok.

Same with Class 2.

Train Model and wait

When there's a popup on the preview, press x to close. Check two poses (or objects) and see if the classification works. If it doesn't work well, you can add more variation by going back to Class 1 and 2.

Press Export Model.

Keep the default (Tensorflow.js, Upload (shareable link)). And press Upload. Don't worry, it's going to uploaded the trained model only, and your webcam images stay in your computer.

On the right side of the shareable link, press Copy to copy the link.

Use the code below, but replace the link between double quotes. You need to evaluate line by line.

await loadScript("https://unpkg.com/ml5@1/dist/ml5.min.js")

imageModelURL = "https://teachablemachine.withgoogle.com/models/GY7Ov3xvL/";

label=0
ml5.setBackend('webgl');
classifier = ml5.imageClassifier(imageModelURL + "model.json");

s0.initCam()
src(s0).layer(src(s0).invert().luma(()=>label)).out()

lerp=(a,b,p)=>a*(1-p)+b*p
classifier.classifyStart(s0.src, res=>label=lerp(label,res[0].label=="Class 1" ? 0 : 1,0.1))

gradient(1).out()

voronoi().out()

noise().out()

shape(5).out()

osc().out()

gradient(1).out(o0);
osc().out(o1);
voronoi().out(o2);
noise().out(o3);
render()