Every few months we want to highlight creative projects from people in our community—that means you! If you have a project you’d like to submit to the round-up, submit it through this form. This month we’re featuring work from Yining Shi’s Machine Learning for the Web class.

Machine Learning for the Web is a 14-week class at ITP/NYU with a focus on building creative and interactive projects in the browser with machine learning techniques. Tools like Teachable Machine, RunwayML, ml5.js and TensorFlow.js are really making the creating process easy and beginner friendly. I’m so happy and proud to see so many creative projects made by students for every week’s homework. I’d love to share some of the projects with you and discuss creative applications of Machine Learning with you. — Yining

A gif of a person waving their arms up and down. Algorithmically generated colorful dots trail behind their hands.
A gif of a person waving their arms up and down. Algorithmically generated colorful dots trail behind their hands.

Bubble World includes three mini games in which you can interact with bubbles in fun ways through your webcam. You can move the bubbles with your hands, bounce the bubbles with your head, or use your voice to control the bubbles. (Video | Documentation | Live Example)

A cardboard box dispenses candy with voice control.
A cardboard box dispenses candy with voice control.

This project uses Google’s Teachable Machine Audio Classifier to identify when a user says “candy.” Upon hearing the keyword, a servo motor moves 90 degrees, allowing m&ms to fall on to a ramp and to the user. (Video | Documentation | Live Example)

A person uses their face to eat moon cakes on a screen.
A person uses their face to eat moon cakes on a screen.

Mooncake Hunter is an interactive game using ML5.js PoseNet and P5.js. In this game, PoseNet is used to track the user’s nose position. The user’s nose turns into a fork, which serves as a tool to hunt for mooncakes. (Video | Documentation | Live Example)

A person uses their nose to play a digital guitar on the screen.
A person uses their nose to play a digital guitar on the screen.

Move your head to make some noises! A virtual guitar that will be triggered by the physical movements of the user. (Documentation | Live Example)

In the holiday spirit, I decided to recreate my favorite halloween gif: the dancing Halloween man. This project allows users to become their own dancing pumpkin character by using ml5.js Posenet model to detect your body from your webcam and move the character on the canvas. (Video | Documentation | Live Example)

Friendly Machine Learning for the Web. ml5.js aims to make machine learning approachable for a broad audience of artists, creative coders, and students.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store